SKILL.md
Prototyping Strategy
Fidelity Spectrum
| Fidelity | Tool | Best For | Time |
|---|---|---|---|
| Paper | Paper + pen | Early concepts, team brainstorming | Minutes |
| Lo-fi wireframe | Balsamiq, Whimsical | Structure validation, flow testing | Hours |
| Mid-fi | Figma wireframes | Usability testing, stakeholder alignment | Days |
| Hi-fi | Figma, Framer | Final design validation, development spec | Days-weeks |
| Code | HTML/CSS, React | Production-ready, complex interactions | Weeks |
When to Use Each
- Paper: When you need to explore 10+ ideas quickly
- Lo-fi: When testing navigation and flow (not visual design)
- Mid-fi: When testing usability before investing in visual design
- Hi-fi: When testing visual design, brand response, and polish
- Code: When testing complex interactions, animations, or real data
Prototype Testing Rules
- Match fidelity to the question you're testing
- Use real content (not lorem ipsum)
- Build only the paths you're testing (not the whole app)
- Let users find their own way (don't guide them)
- Prototype the error states and edge cases too