Back to Plugins
Prototype Note Toggle

Prototype Note Toggle

Add floating notes and instantly generate documentation directly inside your Figma prototypes.

Plugin Preview

Prototype Note Toggle preview

About this plugin

Prototype Note TogglePlugin · by kippeum.namAboutDrop interactive toggle notes anywhere on your Figma canvas. Each note is a collapsible component — click the badge circle to reveal the full description, click again to collapse. All prototype interactions are wired automatically.No more sticky notes cluttering your designs or manually connecting variant interactions.────────────────────────HOW TO USE────────────────────────1. Open Prototype Note from the plugin menu.2. Enter the badge number on the first line and your description on the next line.3. Choose bubble direction: Left or Right.4. Click "Drop Note" to place a toggleable note instance on the canvas.5. Drag it into your target frame.6. Click "Generate Note Summary" to auto-extract all notes into a structured specification panel.────────────────────────HOW THE PROTOTYPE WORKS────────────────────────- Badge circle → Click to expand bubble (Dissolve, 0.15s)- Expanded bubble → Click to collapse back to badge- Left / Right direction supported — bubble opens in the chosen direction- Single Master Component architecture — all notes are instances of one shared master- Master is placed off-canvas (-5000, -5000) and never interferes with your design────────────────────────REAL-TIME SYNC────────────────────────- Edit a note's content → Summary panel updates automatically- Add or remove a note from a frame → Summary panel reflects the change instantly- Edit a badge number or description in the Summary panel → The linked note instance updates back (bidirectional sync)- No need to regenerate — everything stays in sync as you work────────────────────────IMPORTANT NOTES────────────────────────▸ Do NOT delete the Summary panel frame if you want live sync to keep working. Removing the panel breaks the connection — you would need to regenerate it.▸ Frame names must be unique. The plugin matches notes to panels by frame name, so duplicate frame names will cause sync conflicts.▸ If you upgrade from an older version, the master component will be recreated automatically. Existing note instances will need to be re-dropped.────────────────────────WHY PROTOTYPE NOTE?────────────────────────▸ Annotate prototypes with numbered, interactive notes that collapse out of the way.▸ Skip manual variant setup — prototype interactions are connected automatically on creation.▸ One master, unlimited instances — consistent styling across your entire file.▸ Auto-generated summary panels turn scattered notes into clean, organized specification docs.▸ Bidirectional live sync means your documentation is always up to date.────────────────────────FEATURES────────────────────────▸ Collapsible toggle notes with badge number + description▸ Left / Right bubble direction selector▸ Auto-wired prototype interactions (no manual setup)▸ Master Component architecture (single source of truth)▸ Generate Note Summary — per-frame specification panels▸ Real-time bidirectional sync (Note ↔ Summary Panel)▸ Badge number, content, add/remove — all sync live▸ Component Properties (ID, Content) for easy editing in the properties panel────────────────────────© kippeum.nam — Unauthorized redistribution is prohibited.

Plugin Details

Version2
CreatedMarch 14, 2026
Last UpdatedApril 8, 2026
CategoryPrototyping & animation plugins
Creatorkippeum
Stats3 installs, 2 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:ui.html
  • main:code.js
  • Document Access:dynamic-page
  • Editor Types:
    figma
  • Allowed Domains:
    • none