The story of a system
Some time ago, we were working on the usability of a website for one of our clients. Opinions within the client’s team were divided—do we really need to design these wireframes? Isn’t it a waste of money? Why not go straight to the graphics? However, it quickly became clear that even by looking at a simple sketch of the layout, we could determine that there would be two types of accounts, so it made sense to immediately offer a choice between Account A and Account B. Often, just glancing at a sketch can reveal that what the client thought would work well in theory might actually introduce chaos into the website. But with a few small changes, it’s possible to propose a solution that works simply and clearly on both a monitor and a mobile phone, minimizing the risk that users will get lost and leave the site.
What is a Wireframe?
Wireframes, or page schematics, are simply website blueprints—sketches that outline the path a user will follow when navigating the site. The designer’s job when creating these schematics is to present the site’s structure and arrange key elements like logos, text, images, drawings, icons, and, most importantly, the places where we expect user actions (CTA buttons). Wireframes can vary in complexity, from basic sketches with empty boxes to gray-box wireframing (where different shades of gray are used to indicate the importance of elements), and even to wireframes that include colors or fonts that will be used in the final graphic design.
Do I Need This?
Wireframe design may not be essential for every project (though it’s always helpful), but even the simplest sketch can greatly improve the quality of the final product. It allows both designers and clients to think carefully about the site’s elements and functionality.
The truth is, if someone visits your site and can’t easily find what they’re looking for, they won’t come back. By preparing wireframes before launching the site, we can catch mistakes that would be expensive to fix later. We can also discover that sometimes tried-and-true solutions are the best, and that users expect certain elements to be in specific places. This helps us create a website (or app, system, etc.) that is easy to use.
By developing wireframes for the project mentioned above, we reduced the time spent on graphic design by 10% (compared to the estimated time) and significantly lowered the number of revisions during the testing phase.
O AUTORCE
Anna Owczarczak
Creative Director
Członek Zarządu i Dyrektor Kreatywny Yetiza. Zafascynowana typografią zwolenniczka powiedzenia 'lepsze wrogiem dobrego’. Lubi stonowane kolory i jednopikselowe linie.