Generate: "create 5 cat images" Edit: Paste an image onto the canvas, then say "make @i3 pink" Reference: Use @i/@v/@t to reference images, videos, and notes (e.g., "make @i3 pink" or "animate @i5 into a video") Notes: Click "📝 Create Text Node" button or say "create a note" Extract: "extract the title from https://example.com" (requires Firecrawl API key) Canvas: Images automatically appear on canvas with IDs!
Nano Banana Workspace Guide
Use this walkthrough to understand how the agent, canvas, and toolbar fit together so you can go from prompt to polished boards quickly.
Connect your tools – Open ⚙️ Settings to add your Gemini API key for chat & imaging, plug in Firecrawl for web extraction, and run the optional Veo proxy for video jobs.
Explore the canvas – Review the toolbar buttons, ID sidebars, and save indicator so you know where undo, export, and auto-save feedback live.
Prompt the agent – Describe what you need in natural language and reference canvas items with @i/@v/@t to edit or extend previous work.
Iterate & organize – Drag, regenerate, or annotate assets directly on the canvas, then export when you’re ready to share or archive.
Agent commands & actions
Generate images
Ask for batches like generate 4 vaporwave posters. Results land on the canvas with metadata and unique @i IDs you can reference later.
Generate stories
Request narratives such as generate a 3-part origin story for our mascot. The agent replies generating images using the reference of the last images. Like for create image 2 will us image 1 and for image 3 will use image 1 and 2.
Edit existing images
Reference assets with @i2 to iterate: make @i2 warmer lighting or add neon outlines to @i4. The agent invokes Gemini image editing and replaces the selection in place.
Create videos
Text prompts such as create a cinematic sunset video call the Veo proxy (when running) and drop playable clips onto the canvas as @v items.
Use images as video seeds
Blend workflows by saying animate @i5 into a 12s hero reel to trigger generate_video_from_image with your existing art direction.
Understand videos
Request analysis with describe @v2 or extract video frames from @v1 at 0s, 4s, 7s to pull captions or stills straight into chat.
Extract from the web
Unlock structured scraping with Firecrawl: extract the headline and bullets from https://example.com. Results render as collapsible JSON for easy copying.
Capture ideas with notes
Say create a note titled lighting directions or press the 📝 button to drop sticky text cards that persist alongside your media.
Reuse prompts with templates
Open the template manager (🧩) to save complex prompts as commands like /template_productshot, then type the shortcut in chat to expand it automatically.
Track request progress
Status updates appear in chat for every request (Queued → Running → Complete). Use them to spot failures quickly and jump back to the relevant command.
Canvas toolbar reference
↩️ Undo / ↪️ Redo
Step backward or forward through canvas changes. Keyboard shortcuts Ctrl/⌘ + Z and Shift + Ctrl/⌘ + Z (or Ctrl/⌘ + Y) mirror these controls.
🗑️ Delete
Remove the current selection. Select items first by clicking them or using box-select, then tap Delete or press the keyboard key.
📝 Create Text Node
Drop a sticky note anywhere on the canvas for briefs, checklists, or scene descriptions. Notes inherit IDs so you can reference them with @t.
🧩 Create Template
Open the prompt template manager to store reusable commands. Saved templates appear in chat when you use their /shortcut.
✋ Pan Mode
Toggle grab-to-pan navigation. You can also hold Space or press H to activate it temporarily.
🔍 Zoom In / Out
Adjust the viewport to focus on details or view the whole board. Zoom centers on your cursor location for precise framing.
🔄 Reset View
Snap the canvas back to the default zoom and origin if you get lost.
🧹 Clear All
Remove every asset from the canvas. Use export options first if you need a backup.
💾 Export JSON
Download a project snapshot containing prompts, placement, and media metadata—perfect for archiving or sharing setups.
📦 Export Assets
Bundle all current images and videos into a ZIP so you can move deliverables into other tools.
Canvas interactions & layout tips
Hold Space or press H to toggle Pan Mode, then drag to move around the infinite canvas.
Drag a blank area to box-select multiple items, then move or align them together; toolbar actions like Delete and Export respect the current selection.
Paste screenshots, image files, YouTube links, or direct .mp4 URLs to import external media instantly.
Use the header controls (♻️ regenerate, ⬇️ download) on each image/video to iterate without leaving the canvas.
Click IDs in the side panels to jump focus to that asset and reveal its on-canvas controls.
Watch the 💾 indicator in the canvas footer to confirm when auto-save finishes or if IndexedDB encounters an error.
Keyboard shortcuts
Enter — Send chat command
Shift + Enter — Insert a newline without sending
Esc — Close this guide
Delete / Backspace — Remove selected items
Ctrl/⌘ + Z — Undo (add Shift or press Ctrl/⌘ + Y to redo)
Ctrl/⌘ + + / - — Zoom in/out wherever your cursor is focused
H — Toggle Pan Mode for keyboard-centric navigation
Need more help?
The README.md covers setup & security, while docs/ dives into prompting, Veo video setup,
Firecrawl usage, and release context. Keep both handy as you explore advanced workflows.