AI Mode is Here: And It’s Changing Everything 🤖

Overview

AI Mode is Walnut’s next-generation, AI-powered creation experience — built to help you build, edit, modernize, and publish demos faster than ever. Instead of clicking through menus or making repetitive manual changes, you simply tell the AI what you want, and it performs real actions directly inside the editor.

Think of it as vibe coding for demos: an AI that understands your screens, your narrative, your variables, and your template structure — then turns your instructions into actual editor operations, not just text edits.

Unlike traditional AI helpers, AI Mode combines content intelligence + editor control. It can update text, restyle elements, anonymize data, create or refine guides, manage variables, and even publish demos from templates — all through a single conversational interface.

Powered by the Walnut AI Power Stack — Story Capture, EditsAI, and InsightsAI — AI Mode lives inside the editor and helps you move from Idea → Structure → Polish → Publish in one seamless workflow.

You describe the demo. AI Mode builds it.

What AI Mode Can Do

AI Mode brings together everything you need to build, edit, personalize, style, anonymize, and publish demos — all from one conversational interface inside the Walnut editor. It’s your all-in-one workflow for turning screens into polished, guided product stories.

🧭 Build Your Demo Story (Guides & Narrative Creation)

AI Mode helps you shape your story — not just your screens.

• Create guided flows directly from screen context.
• Generate step titles, descriptions, and a clean narrative sequence.
• Turn Story Capture narration into structured steps (or use semantic screen data when narration isn’t present).
• Add or update annotations to highlight key UI elements.
• Apply best-practice storytelling patterns automatically.

📝 Edit & Personalize Your Content (Content Edits)

Refine your messaging, clarify flows, and personalize at scale.

• Rewrite or polish text anywhere in your demo.
• Run powerful find & replace across your template.
• Replace static text with dynamic variables (for example, {{company_name}}, {{role}}).
• Create new variables and apply them consistently across screens.
• Delete unnecessary UI elements or duplicate them for new content blocks.
• Improve tone, tighten clarity, and rewrite for specific personas or use cases.

🎨 Style & Clean Up Your Demo (Visual Edits via EditsAI)

EditsAI now lives inside AI Mode — giving you beautiful, consistent formatting in seconds.

• Change text colors, background colors, and font sizes.
• Apply bold, italics, underline, and adjust hierarchy.
• Fix spacing, alignment, and visual inconsistencies across screens.
• Blur sensitive content (with underlying text and HTML scrambled).
• Apply global styling updates across many screens at once.

🔐 Anonymize & Protect Sensitive Data (Privacy-Friendly Editing)

Perfect for healthcare, finance, and any regulated environment.

• Blur or anonymize names, emails, addresses, and logos.
• Randomize or anonymize identifying information.
• Keep demos compliant while still telling a clear product story.

🌟 Personalization at Scale (Variables + Dynamic Dates)

Make every demo feel custom — without manual work.

• Add variables for names, companies, roles, regions, and more.
• Replace hard-coded details across every screen in a single flow.
• Use dynamic dates to keep timestamps and examples looking fresh and recent without recapturing.
• Combine variables and dynamic dates to tailor demos by persona, account, and time frame.

🚀 Create & Publish Demos (Template-Driven Creation)

Go from template → published demo faster than ever.

• Create new demos directly from existing templates.
• Update access settings, including:
  • expiration date,
  • email required,
  • allowed or blocked viewers,
  • internal-only access.
• Adjust link settings, including:
  • show or hide guides,
  • Guides Toolbar behavior,
  • hotspots,
  • default language.
• Configure communication settings:
  • welcome message,
  • gate colors,
  • notifications.
• Publish demos automatically using your template defaults.

🧠 Built-In Intelligence (Smarter Guidance, Fewer Dead Ends)

AI Mode understands the structure of your demo and guides you every step of the way.

• Reads your captured HTML, UI structure, and semantic content.
• Uses narration (when present) to generate stronger guided flows and clearer stories.
• Falls back to screen content and structure when narration isn’t used.
• Automatically surfaces relevant Knowledge Base articles when an action isn’t supported.
• Provides instructions and recommended workflows directly inside the editor, so you always know what to do next.

Never Get Stuck Again: Your AI Co-Pilot Has You Covered

AI Mode is designed to support you as you build — even when it can’t perform a specific action yet.

• Automatic Knowledge Base links: If you request something AI Mode doesn’t currently support, it will surface the most relevant KB article right inside the editor.
• Inline instructions: AI Mode can pull step-by-step guidance directly from Walnut’s Knowledge Base and display it in the chat, so you don’t have to leave the editor to keep building.

• Alternative suggestions: When an action isn’t yet possible, AI Mode recommends the closest supported workflow or editor tool to help you accomplish your intent.

You never hit a dead end — AI Mode always offers a clear next step, instructions included.

Before You Start

Before using AI Mode, make sure your template is set up for success. An Admin must enable AI access, and your template should already include a few captured screens—either from Story Capture or Single Capture. AI Mode relies on this screen context (HTML, UI structure, and narration, if provided) to understand your demo and take meaningful actions like generating guides, editing content, and applying styles.

• Enable AI Access (Admins Only)
• Prepare Your Template for AI-Powered Creation

Enable AI Access (Admins Only)

1. Go to Company Settings in the left navigation menu.
2. Select the Account Settings tab.
3. Scroll to the AI section.
4. Toggle on Enable AI Feature Access.
5. Click the Save Changes button in the upper right corner.

Once AI access is enabled — and your template contains at least a few captured screens — the AI Mode button will appear in the top-left corner of the editor.

Prepare Your Template for AI-Powered Creation

AI Mode only appears when your template has screen content to work with. Add at least a few captured or imported screens so AI Mode can read the semantic HTML, text, and UI structure — this allows the AI button to activate and ensures it can generate guides, edit content, and perform meaningful actions.

How to Add Screens Before Using AI Mode

AI Mode works with all of Walnut’s capture and import workflows. Choose the option that best fits your demo-building style:

Story Capture

• Records your clicks as you walk through your product.
• Lets you optionally record narration (in English) to describe your product and flow.
• If narration is present, AI Mode uses both the on-screen content and your spoken explanation to infer intent, identify guide opportunities, and generate a draft story.
• If narration is not present, AI Mode uses semantic screen data — captured HTML, UI structure, and content hierarchy — to build guided steps based on what it sees in each screen.

Best for: guided demos, narrative-first demos

Single Capture

• Captures one screen at a time.
• AI Mode reads the HTML, content hierarchy, and UI elements to understand each screen.
• Great for bulk edits, variable replacement, anonymization, and style updates.

Best for: all purpose, guided demos, non-guided demos, and hybrid demos

Screens Library

• Pull in screens your team has already captured—no recapturing needed.
• Works seamlessly with static images, desktop app captures, Figma exports, and non-HTML screenshots.
• AI Mode analyzes the visual structure to enable step generation, refinements, and style updates.

Best for: assembling demos quickly from existing assets, showcasing desktop apps, importing Figma designs, or static screenshots

Quick Start Guide

From any template, click the AI Mode button in the upper-left corner of the editor.

A conversational AI panel opens on the left with:

• Smart suggestions and common actions
• Contextual help when an edit isn’t supported
• Your previous chats for quick reuse

"Just Chat” and “Manual Editing” Modes

AI Mode is designed to run alongside your normal editing workflow. You can move between conversational AI and manual edits at any time — and AI Mode will keep processing your requests in the background.

⬆ Just chat:

• Talk to AI Mode without applying changes to the template.
• Use it to ask questions, get Knowledge Base instructions, or draft ideas for guides and copy.
• In this mode, AI Mode behaves like a pure chatbot and will not modify your template.

✏️ Manual editing:

• Switches the editor back to standard manual edit mode.
• You can update screens, elements, and guides by hand as usual.
• While you edit, AI Mode continues running any active processes in the background and incorporates your manual changes into its understanding of the template.

🔄 Keep Editing While AI Works for You

• AI Mode and manual editing are fully compatible, giving you a smooth, parallel workflow.
• Start an AI operation, then immediately continue working with manual edits.
• Jump back into AI Mode at any time to run new prompts or refine previous changes.

Try a suggested action to see AI Mode in action immediately:

• Anonymize personal content on all screens
• Personalize customer details
• Make dates look more recent

👉 For the full set of supported actions, see What AI Mode Can Do.

Use AI Mode like a chatbot — but one that can perform real operations in your demo.

Editing & cleanup examples:

“Rewrite all text in a clearer, more professional tone.”

“Blur any sensitive data across this template.”

“Replace all company names with variables.”

Guides & structure examples:

“Create guide steps across all screens.”

“Add an annotation highlighting the primary call-to-action.”

Styling examples:

“Update all button labels to use our dark-mode purple.”

Publishing examples:

“Publish this demo with a 14-day expiration and email required.”

After each action, AI Mode shows exactly what it changed — giving you full control to refine or roll back edits.

• ✨ Review & Adjust
  • Inspect AI-generated changes directly on your screens
  • Refine or regenerate edits from the AI Mode panel
  • Discard specific suggestions you don’t want to keep
• 🔄 Undo the most recent change
  • Use Ctrl + Z (Windows) or Cmd + Z (Mac) to undo the last AI action.
  • Note: This only works for the most recent edit.
• 🗑️ Revert all changes from a specific prompt
  • Open the AI Mode panel
  • Find the prompt
  • Click ⋮ → Delete chat
  • Deleting a chat removes all edits tied to that prompt across all screens.
    Spot-reverting individual actions from earlier in the prompt is not supported.

AI Mode can automatically turn your captured screens into a guided demo — no manual step creation required. This works with any capture method from the Walnut Extension:

• Story Capture with narration: AI Mode uses your clicks, narration, and on-screen content to infer intent and generate meaningful guide steps.
• Story Capture without narration: AI Mode interprets the semantic HTML, text, and UI structure to build a logical guided flow based on your walkthrough.
• Single Capture or Screens Library content: AI Mode analyzes each screen’s layout and text to help you quickly create a narrative or propose starter guide steps.

AI Mode always uses the richest context available — narration if it exists, and if not, the screen’s semantic data — to create the strongest draft story possible.

If you used Story Capture, AI Mode can convert your actions + narration into structured guide steps:

“Generate a 12-step guided demo based on my narration.”

Use AI Mode to check your demo for consistency before publishing:

“Before we publish, check for long steps, repeated phrases, and inconsistent capitalization.”

Then publish:

“Publish this demo using the current template settings.”

AI Mode is designed to guide you as you build — even when it can’t take a specific action yet.

• Clear explanations: If AI Mode can’t perform a request, it will tell you why directly in the editor.
• Automatic Knowledge Base links: AI Mode surfaces the most relevant help articles so you can follow step-by-step instructions without leaving the editor.
• Alternative solutions: When the requested action isn’t supported, AI Mode will recommend the best way to accomplish your goal using available editor tools or suggested workflows.

You never hit a dead end — AI Mode always shows the next best step and provides the instructions to keep you moving forward.

If AI Mode can’t perform something, it will explain why and link you to the relevant Knowledge Base article.

Best Practices for Getting the Most from AI Mode

• Start with your outcome. Tell AI what you want to achieve — it already understands your screens and context.
• Use narration when possible. Story Capture gives AI deeper context, leading to stronger, more accurate guided flows.
• Iterate in micro-passes. Short, focused prompts produce faster refinements and higher-quality results.
• Personalize early. Use text variables and dynamic dates to prepare your demo for different personas, accounts, and scenarios.
• Run a cleanup pass before publishing. A single prompt can refine tone, styling, formatting, or clarity across all screens.

See AI Mode in Action 💫

Open in a new tab

FAQs