wireframe-prototyping
Installation
Summary
Design visualization and feedback tool for early-stage UI validation before development.
- Covers three fidelity levels: low-fidelity sketches (30 min–2 hrs, brainstorming), medium-fidelity layouts (2–8 hrs, team alignment), and high-fidelity prototypes (8+ hrs, developer handoff)
- Recommended tools span Balsamiq and whiteboards for sketches, Figma/Sketch/Adobe XD for medium fidelity, and Figma/Framer for interactive prototypes
- Best practices emphasize early user testing, mobile-first design, consistent spacing, documented interaction flows, and iterative refinement based on feedback
- Includes guidance on edge cases, accessibility considerations, and avoiding premature high-fidelity design before validation
SKILL.md
Wireframe Prototyping
Table of Contents
Overview
Wireframes and prototypes bridge the gap between ideas and implementation, enabling teams to test concepts, get feedback, and refine designs before costly development.
When to Use
- Early concept validation
- Stakeholder alignment
- User testing and feedback
Related skills