Digital.gov Guide
Developing and communicating your design
This guide provides tools and approaches for developing and communicating your design.
Wireframes
On this page
Method: Wireframes
What
A wireframe is a simple visual representation of a product or service interface.
Why
Wireframes help you communicate design direction and support early usability testing and feasibility discussions.
How to do it
Build preliminary sketches that show structure, placement, and hierarchy for your product. Avoid font choices, color, or other elements that would distract from the structure. Lightweight designs are conceptually easier to reconfigure. Wireframes are usually simple line drawings.
- List what user experience and user interface patterns you will need.
- Review your wireframes with specific user scenarios and personas in mind. Ask, "Can users accomplish their task with the wireframe you are sketching out?"
- Share the wireframes with your team and use their feedback to iterate.
Time required
1 to 3 hours
