1. Are wireframes necessary?

Ask yourself: are wireframes appropriate right now? Reaching for drawing software too early in the design process can affect the quality of solutions. Wireframes encourage analytical thinking, which stifles creative flow. Use sketches to capture the essence of your ideas then work them up and evaluate them later.

2. Choose the right software for the job

There are a variety of different tools that can be used to create wireframes; from multi-functional drawing packages, like Figma, Sketch, Adobe Illustrator, OmniGraffle and MS Visio, to purpose-made wireframing software such as Axure and Balsamiq, which offer prototype generation and cloud-based collaborative working respectively. Which package you choose is entirely a matter of personal taste. Try them out, use whatever suits your workflow and don’t be bullied into thinking there’s a right or wrong tool.

3. Use, and re-use, components

“Components”, “Libraries” or “Stencils”, whatever they’re called, invest the time in making re-useable pieces of UI, creating templates and customising your interface for the task in hand. This will enable you to focus on the ideas, not drawing the boxes.

4. Annotate your diagrams

Wireframes are specification documents; they should describe how UI should work and feel. Annotations are useful to explain the finer points of the design that might be missed by anyone looking at it cold: How should a list of items be ordered? What happens when a button is clicked? Where does that content come from? There are two ways you can do this; numbered references to points in the diagrams, or inline notes. I prefer the latter because the reader doesn’t need to do any cross-referencing to understand the diagram. It doesn’t look as pretty, but as hope you’ve gathered, that’s not the primary concern.