From 14f4d24ca393bedeb775273eef88f5dad953e6f9 Mon Sep 17 00:00:00 2001 From: Bruno Bornsztein Date: Fri, 6 Feb 2026 15:29:11 -0600 Subject: [PATCH] Add voice-driven development demo script for TaskYou Step-by-step bulleted script showing how to use TaskYou with voice dictation to plan, manage, and build an Emoji Mood Tracker web app. Covers task creation, execution, feedback, command palette, and CLI. Co-Authored-By: Claude Opus 4.6 --- docs/demo-script.md | 176 ++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 176 insertions(+) create mode 100644 docs/demo-script.md diff --git a/docs/demo-script.md b/docs/demo-script.md new file mode 100644 index 00000000..88f0502a --- /dev/null +++ b/docs/demo-script.md @@ -0,0 +1,176 @@ +# TaskYou Demo Script: Voice-Driven Development + +> **Goal:** Show how to use TaskYou with voice dictation to plan, manage, and build a simple "Emoji Mood Tracker" web app — all without touching the keyboard for task management. +> +> **Duration:** ~10 minutes +> +> **Prerequisites:** TaskYou installed and running, Claude Code configured as executor, microphone set up for voice dictation (macOS: Fn Fn, or any dictation tool) + +--- + +## Act 1: Introduce the Board (30 seconds) + +- Open TaskYou in your terminal + ``` + ty + ``` +- Show the **Kanban board** — point out the four columns: Backlog, In Progress, Blocked, Done +- Say: *"This is TaskYou — a task manager built for AI-assisted development. I'm going to build a small web app using mostly my voice to create and manage tasks, and Claude to write the code."* + +--- + +## Act 2: Create Tasks with Voice Dictation (2 minutes) + +- Press **`n`** to open the new task form +- **Activate voice dictation** (on Mac: press Fn twice) +- Dictate the first task title: + > "Create an HTML page with an emoji mood tracker" +- Press **Tab** to move to the description field +- Dictate the description: + > "Build a single HTML file with inline CSS and JavaScript. Show a row of five emoji buttons representing moods: very sad, sad, neutral, happy, very happy. When the user clicks an emoji, log it with a timestamp and display a history list below the buttons." +- Press **Ctrl+S** to save the task +- Say: *"That's our first task. Now let's break it down."* + +- Press **`n`** again to create a second task +- Dictate: + > "Add a mood statistics chart using CSS bar chart" +- Tab to description, dictate: + > "After the basic tracker works, add a simple bar chart below the history that shows how many times each mood was selected. Use pure CSS, no libraries." +- Press **Ctrl+S** to save + +- Press **`n`** one more time for a third task +- Dictate: + > "Add local storage so moods persist across page refreshes" +- Tab to description, dictate: + > "Save the mood history array to local storage. Load it on page load. The chart and history should populate from saved data." +- Press **Ctrl+S** to save + +- Say: *"Three tasks in about a minute, all created with my voice. No typing."* + +--- + +## Act 3: Execute the First Task (3 minutes) + +- Navigate to the first task using arrow keys or press **`1`** +- Press **`x`** to execute the task +- Say: *"Now I'm sending this task to Claude. It will create a Git worktree, spin up a Claude Code session, and start building."* +- Press **Enter** to open the task detail view +- Watch Claude work in the **executor pane** (left side) + - Point out: *"Claude is reading the task, exploring the project, and writing the HTML file."* +- While waiting, show the **shell pane** on the right (press **`\`** to toggle it) + - Say: *"I can also interact with the worktree directly in this shell."* + +--- + +## Act 4: Handle a Block / Provide Input (1 minute) + +- If Claude asks a question (task goes to **Blocked** status): + - Say: *"Claude has a question for me. Let me answer it with my voice."* + - Press **`r`** to open the retry/feedback form + - **Activate voice dictation** and speak your answer, for example: + > "Yes, use these five emojis: the very sad face, the slightly frowning face, the neutral face, the slightly smiling face, and the star struck face. Make the page dark themed with a deep purple background." + - Press **Ctrl+S** to send the feedback + - Say: *"I just gave Claude creative direction, all by voice."* + +- If Claude completes without blocking: + - Say: *"Claude finished without needing input. Let's take a look."* + +--- + +## Act 5: Review the Result (1 minute) + +- Once the first task shows as **Done**: + - Press **`o`** to open the worktree in your editor + - Show the generated HTML file + - Open it in a browser to demonstrate the working mood tracker + - Say: *"Fully functional mood tracker — built from a voice-dictated task description."* + +--- + +## Act 6: Chain the Next Task (2 minutes) + +- Press **Esc** to go back to the Kanban board +- Navigate to the second task ("Add a mood statistics chart") +- Press **`x`** to execute it +- Say: *"I'm now queuing the next task. Claude will pick up where the first task left off, in the same codebase."* +- Press **Enter** to watch progress +- When done, refresh the browser to show the new bar chart feature +- Say: *"Each task builds on the last. Voice in, working code out."* + +--- + +## Act 7: Use the Command Palette (30 seconds) + +- Press **`p`** or **Ctrl+P** to open the command palette +- **Activate voice dictation** and say: + > "mood tracker" +- Show how it fuzzy-matches to the relevant tasks +- Press **Enter** to jump to a task +- Say: *"The command palette works great with voice too — just speak the task name and it finds it."* + +--- + +## Act 8: Quick Status Update via CLI (30 seconds) + +- Switch to a regular terminal (or use the shell pane) +- **Dictate a CLI command:** + > "ty list" +- Show the task list output +- Then dictate: + > "ty create add a confetti animation when the user logs a happy mood" +- Show it appear in the TUI +- Say: *"You can also manage tasks from the command line — great for scripting or quick additions."* + +--- + +## Act 9: Execute the Final Task (1 minute) + +- Go back to the TUI, navigate to the third task ("Add local storage") +- Press **`x`** to execute +- Once done, demonstrate in the browser: + - Click some emoji moods + - Refresh the page + - Show that the history and chart persist +- Say: *"Data persists across refreshes. Three tasks, three features, all planned and directed with voice."* + +--- + +## Act 10: Wrap Up (30 seconds) + +- Show the Kanban board with all three tasks in the **Done** column +- Say: *"To recap — I used TaskYou to:"* + - *"Plan tasks by speaking them into the new task form"* + - *"Execute each task with a single keypress, handing it off to Claude"* + - *"Provide feedback and creative direction using voice dictation"* + - *"Navigate the board with the command palette using voice"* + - *"Build a complete web app without writing a single line of code myself"* +- Say: *"That's TaskYou — voice-driven, AI-powered task management for developers."* + +--- + +## Quick Reference: Key Presses Used in This Demo + +| Action | Key | +|--------|-----| +| Open TUI | `ty` in terminal | +| New task | `n` | +| Save task form | `Ctrl+S` | +| Execute task | `x` | +| View task details | `Enter` | +| Retry / give feedback | `r` | +| Open in editor | `o` | +| Command palette | `p` or `Ctrl+P` | +| Toggle shell pane | `\` | +| Back to board | `Esc` | +| Activate macOS dictation | `Fn` twice | + +--- + +## Tips for a Smooth Demo + +- **Practice the voice dictation** a few times before recording — know where to pause for punctuation +- **Pre-check Claude is working** — run a quick test task before the demo +- **Use a dark terminal theme** — it looks better on camera and matches the TUI styling +- **Keep the browser ready** — have it positioned next to the terminal for split-screen effect +- **If Claude is slow**, fill time by explaining what's happening: "Claude is analyzing the existing code and planning the implementation" +- **If dictation misfires**, just laugh it off — "Voice recognition isn't perfect, but it's faster than typing for task descriptions"