Tool details
Wireframes
Simple sketches representing and communicating different screens for an idea or concept.
Tool category:
Tool thumbnail
When to use
When you wan to test navigational structures as well as content elements in a concept.
Why you should
To map out user behaviour or to align the different disciplines within a design team.
What you get
Insights regarding how the different parts of the software work together and what to improve.
Steps to take
Prepare wireframes by sketching rough versions of the different screens of the interface on paper,Wireframes can also be used to map out user journeys or act as the starting point for a paper prototype or interactive click-model. Wireframes are like a versatile blueprint for digital interfaces and can also be used to define user interface specifications, transitions, and gestures, as well as to map many other important aspects. whiteboards or digital. Don’t use colors or specific fonts. Leave out aesthetics as much as possible. You can even use placeholder content if needed.
Present the wireframes to your audience. Establish the context in which the presented wireframes will be used in the future application. Then introduce the wireframes, explain visual conventions, and present key elements.
Document as you go along. Add annotations to capture changes and new ideas about the behaviours of interface elements. You might also add details about the content or the context in which the system might be used.
Further reading
Wireframes can also be used to map out user journeys or act as the starting point for a paper prototype or interactive click-model. Wireframes are like a versatile blueprint for digital interfaces and can also be used to define user interface specifications, transitions and gestures, as well as mapping many other aspects.
Figma community
There are many different wireframing kits, plugins and widgets available in Figma's community page. All catering for different needs and suitable for individal preferences.
References & Links
