Template Overview

Interactive prototypes bridge design intent and engineering execution. Live walkthroughs uncover micro-interaction failures, confusing icon affordances, and cognitive gaps before code is written. The Prototype Walkthrough Feedback Record provides a structured log of participant actions, unexpected clicks, and design recommendations in plain Markdown.

Markdown Template Structure

Copy the block below or click Download .md File to add this template directly to your personal vault:

---
title: "Prototype Walkthrough: [Flow Name] — [Participant ID]"
date: [YYYY-MM-DD]
facilitator: "[[Design Lead / Researcher]]"
prototype_version: "Figma v4.2 / Principle build"
participant_role: "Staff Software Engineer"
walkthrough_status: "Complete / Incomplete"
tags: [ux-research, prototype, walkthrough, interaction-design]
---

# Prototype Walkthrough Feedback — [Flow Name]

## 1. Walkthrough Objectives & Scenarios Tested
- **Core Scenario:** Participant records a 2-minute meeting audio sample, triggers Markdown summary, and customizes frontmatter tags.
- **Fidelity Level:** High-fidelity interactive component prototype with realistic data states.

## 2. Screen & Component Feedback Matrix
| Screen / View | Tested Component | Participant Interaction | Observed Issue / Friction | Recommendation |
|---|---|---|---|---|
| **Recording Bar** | Pause vs Stop Button | Clicked stop when intending to pause | Icons too visually similar | Add text labels or distinct shapes |
| **Transcript View** | Real-time text stream | Scrolled up during live recording | Auto-scroll reset user position | Allow free scrolling without snap |
| **Template Drawer** | Search input & chips | Selected 'Governance' category chip | Chip state lacked clear active contrast | Boost active chip color contrast |
| **Export Modal** | 'Copy Markdown' button | Looked for clipboard success toast | Toast disappeared too fast (1s) | Extend toast duration to 3s |

## 3. Notable Verbatim Observations
- On real-time recording feedback: *"I love seeing the audio waveform dance locally, but I was nervous it might stop if I switched virtual desktops."*
- On Markdown export: *"The fact that frontmatter includes ISO dates and tags automatically saves me 5 minutes of editing."*

## 4. Affordance & Micro-Interaction Bugs
- **Bug 1:** Double-clicking a template card opened preview instead of inserting directly into note.
- **Bug 2:** Esc key failed to dismiss the custom prompt configuration modal.

## 5. Design Synthesis & Next Prototype Iteration
> [!NOTE] Design Polish
> Clarify button differentiation between Pause and Finish Recording. Increase toast message persistence to guarantee user feedback clarity.

## 6. Action Items
- [ ] Update Figma interactive component states for pause/stop buttons.
- [ ] Deliver updated micro-interaction spec to engineering team.

Filled Real-World Example

Here is a realistic example demonstrating how this template captures actual deliberations:

---
title: "Prototype Walkthrough: Search & Filter — P08"
date: 2026-10-06
facilitator: "[[Elena Rostova]]"
prototype_version: "Figma Component v5.1"
participant_role: "Senior Engineering Manager"
walkthrough_status: "Complete"
tags: [ux-research, prototype, interaction]
---

# Prototype Walkthrough Feedback — Search & Filter

## 1. Session Overview
Elena Rostova observed P08 navigating the redesigned global vault search modal.

## 2. Interaction Observations
P08 praised the instantaneous fuzzy search performance across 500 simulated notes. They suggested adding standard Vim keybindings (`j`/`k`) for navigating search results directly from the keyboard without reaching for the mouse.

## 3. Action Item
Design team added keyboard shortcut options to the interaction backlog.

When to Use and When to Avoid

When to Use

  • Use during design sprints when validating interactive Figma or code prototypes.
  • Use to test new UI interactions, animations, and gestures with target users.
  • Use to create clear interaction bug backlogs before sprint planning.

When to Avoid

  • Avoid using when only validating abstract business models without interface mockups.
  • Avoid using for retrospective post-launch analytics.

On-Device AI Integration

Summarize your recording in Oyma with this local instruction:

Analyze the prototype walkthrough recording:
1. Extract all observed interaction hurdles, affordance failures, and unexpected clicks.
2. Group feedback by specific screen and UI component.
3. Generate a concrete design iteration checklist in Markdown.

Your data remains securely on your Mac with zero cloud exposure.

Frequently Asked Questions

What is an interactive prototype walkthrough?

A guided walkthrough where a designer or researcher observes a participant navigating a high-fidelity interactive prototype to evaluate UI mechanics and interactions.

How does this differ from early concept testing?

Concept testing evaluates broad desirability and value proposition, whereas prototype walkthroughs evaluate specific UI controls, button affordances, and interaction flows.

Can component-level feedback be organized cleanly in Markdown?

Yes. This template organizes feedback by UI screen and component, tracking affordance issues, visual clarity, and interaction bugs.