What Are Low & High Fidelity Wireframes?
June 15, 2015
If you are going to use wireframes in your interface design projects, you should know how wireframing can affect the usability of your UIs without concern whether you are designing for websites or fidelity. Wireframes help connect developers of layouts and web designs. They also help in connecting clients with production teams by helping them realise how their site or application will work.
Low Fidelity Wireframes
These are focused on the key components of an interface, including:
- Information architecture
But graphic design is not included in it.
Interestingly, these wireframes emerged onto computer displays from rapid paper prototyping wireframes. This used to involve development of rough sketches of graphical UIs as prototypes of applications for visualising and testing usability. The development took place during the 80s and 90s when the coding process hand not yet started.
High Fidelity Wireframes
These wireframes, also known as high-fidelity prototypes, are closer to the final UI design. Because of this they will have well polished design elements. They can also simulate the workflow and logic of the application in much more details.
They may look perfect but they are still prototypes. The high level of detailing means that these wireframes are both time-consuming and costlier when it comes to creating. Besides, they can be created only by more experienced developers with advanced technical knowledge. The drawback is that this could lead to hindrance in the feedback process because the clients and testers could get distracted by the visual cues and not focus on the usability factor.
Besides, there is a general lack of will in criticising the design because it will seem that the design will require more time and effort to be changed. The clients and testers may fear that the project costs could increase further. This will result in affecting the feedback process. This is why it is essential to explain the goals and methods used for creating high fidelity wireframes. Proponents of these wireframes mostly push for running usability tests.
Pros & Cons
There are pros and cons to both low and high fidelity wireframes. The good thing about low-fidelity wireframes is that they are easy, fast and much cheaper to produce. They can be easily modified as per the needs. It is also easy to start from scratch if the design is unacceptable.
The feedback process also works more efficiently and effectively. Because the designs will not look as refined and complete as in high fidelity wireframes, it is easier to point out the flaws.
High fidelity wireframes are however more developed and provide everyone a clearer idea of how the user interface will look and work. But they have their own set of drawbacks – they are expensive and time consuming.
Besides, high fidelity mockups will usually be more confusing to clients. Most of the time clients don’t have much technical knowledge. Many find it difficult to understand the differences between a wireframe and the final version of the application.