wireframe-prototyping

Design visualization and feedback tool for early-stage UI validation before development. Wireframes and prototypes bridge the gap between ideas and implementation, enabling teams to test concepts, get feedback, and refine designs before costly development. Minimal working example: Detailed implementations in the references/ directory: - 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 - Overview - When to Use - Quick Start - Reference Guides - Best Practices - Early concept validation - Stakeholder alignment - User testing and feedback - Developer handoff - Feature exploration - UX problem-solving - Rapid iteration - Start with low-fidelity sketches - Get feedback early and often - Test with real users - Iterate based on feedback - Use consistent grids and spacing - Document interaction flows - Include edge...