
Whimsical is a mid-fidelity wireframe design tool that includes flowcharting and team collaboration. Later, in the iteration process, if the designer needs to change the color of the button, instead of changing every single button object, they can change it once, and all the child button objects are immediately affected. This button is used multiple times throughout the wireframe.
WIRE FRAME SKETCHER SOFTWARE
The software allows for finite object editing and page management, giving designers the ability to define “master” objects, which can save a lot of time when making changes to the wireframes during the iteration process.įor example, a designer creates a master button object with a specific size, shape, and color. Moqups distinguishes from Balsamiq in a few other ways. While Balsamiq produces a “hand drawn” look, Moqups provides full-color stencils and kits for mobile-app and web design including iOS, Android, and Bootstrap. The main difference between Moqups and Balsamiq is the fidelity of the wireframes. Unlike Balsamiq, it is purely web-based and is meant to make wireframes for web and mobile applications. Moqups is another creative collaboration tool that focuses on wireframing but can also be used for prototyping. Designers can add their own assets and customize the layout.īasic prototyping can be achieved by linking mockups to create simple click-through experiences for usability testing when displaying the project in Full-Screen Presentation mode or as an exported PDF.īalsamiq is offered as a desktop version (Windows and Mac), cloud service, or as a plug-in for Google Drive, Confluence, and JIRA.īalsamic produces low-fidelity wireframes that appear “hand drawn.” ( Miklos Phillips) Moqups It comes with a set of pre-built templates that can be used quickly and easily with a drag-and-drop editor.

Balsamiqīalsamiq is a low-fidelity, simple-to-use wireframing tool favored for its ease of use and iconic “hand drawn” look. Choosing to use one tool over the other (or several together) comes down to designer preference. Some of the tools in this guide are focused more heavily on wireframing, while others try to strike a balance between wireframing and prototyping, and mockup functionality.


The ability to produce a variety of fidelities (low to high).Here are a few characteristics of great wireframing tools to look for: New tools are continually entering the market so it can be hard to keep up. The Top Wireframing Toolsĭesigners have a lot of choices when deciding which wireframing tool(s) to use. A helpful tool for that is a wireframe map.Ī wireframe map combines wireframes with user journeys (or user flows) to demonstrate the user’s journey through a product using wireframes. While there are more complex ways of showing user journeys, there is a trend toward including them in the simplicity of a wireframe. (Source: the NNGroup)Īn issue designers encounter with wireframes is communicating the user journey. Wireflows are a UX deliverable that illustrate task flows using wireframes.
