Prototype Gallery
Standalone UI experiments for team discussion. Each prototype is fully independent — no build step, just open and explore.
Adding a new prototype: create a folder (e.g.
my-experiment/), drop a self-contained index.html inside it, then add a card below. No build tools, no dependencies — just HTML, CSS, and optional CDN scripts.
Change Request Form
6 prototypes
Library
Interaction Pattern Library
All four UX variations shown side by side for direct comparison. Use this to discuss patterns with the team.
Side-by-side
Comparison
Overview
Form
Step Wizard
Multi-step form with a progress indicator. Each step validates before moving forward — familiar and safe.
Wizard
Step progress
Validation
Form
Command Centre
Command-palette driven input experience. Power-user pattern — keyboard-first, fast, with contextual suggestions.
Command palette
Keyboard-first
Form
Flow State
Conversational, context-aware form experience. Fields appear progressively as the user moves through a narrative flow.
Progressive disclosure
Conversational
Form
Hybrid + Branch Console
Hybrid form pattern with a live branch/status console. Combines structured input with real-time system context.
Hybrid
Split view
Live console
Invite
Work Session Invite
AI-assisted work session invitation UI. Explore how AI co-design sessions can be scheduled and framed.
Invite
AI-assist
Scheduling
Content Tools
1 prototype