Halvor William Sanden

UI sketches, not just a waste of time

Sketches – complete drawings as interface blueprints – have no place in interface design. Their fixed nature is fundamentally different to that of the fluid interface. Yet, that doesn’t mean such drawings are always entirely useless.

Fidelity and intent #

Although I stopped making them several years ago, people don’t ask me for them, and I don’t get handed any. Sketches can be useful when made with the proper fidelity for conscious minds.

Ideas #

I’ve been searching for galleries that feature a wide selection of well-made sites and applications, but I’ve yet to find anything interesting. The showcase and award sites seem to be mostly about contemporary styles and marketing – two things we can’t use as a base for our interfaces.

Among the more realistic options are services like Dribbble and Pinterest. Ironic, given that it’s rare to find actual interfaces there. But even those graphic design exercises can be helpful because:

  1. It’s not about the complete picture. Research and coming up with ideas include looking at what’s out there. When planning and describing a solution has revealed areas that are difficult to solve, or we’re fed up with our current ideas, it can be time for some external input. Maybe we find that one piece of functionality, layout or detail we hadn’t thought of on our own. We can uncover rare hints that spark new ideas in the heaps of identical examples of current styles and colours.
  2. User-driven beats curation. The strength of these sites is in their user-driven collections and relatively good search functionality. It’s not too different from what a lot of the web is about – open for all and doing things yourself. The curated web galleries are more like the music of format radio, devoid of anything interesting and mainly featuring companies blowing their own trumpet.

It’s not the same as what sites featuring actual interfaces could have provided. But as long as interfaces get separated into visuals and code at the scale we still see today, we’re stuck with good code practices in one community and its visual symbiont in another.

Understanding #

Images are inferior to text when it comes to representing or describing interfaces, but they can work as supplements or as a way to move a larger process forward. Sketches can also be a good thing to make when many people are trying to get a shared understanding of an interface description. Crude drawings supporting flow and logic descriptions to get everyone on the same page, not blueprints for developers to “translate”

Concepts #

Related to a shared understanding, we find concepts. They envision ideas as finished pieces without pretending to be the actual thing. For instance, proposals presented to stakeholders or customers intended to sell an idea. As long as everyone involved understands what they are looking at, it shouldn’t be too risky.

It’s difficult to balance something intended to create a positive gut reaction while asking people to hold off on their gut reaction because it’s not the finished piece. But if you manage to differentiate between concept and interface, drawings can also play a part here.

Treachery of images #

The more refined a drawing becomes, the more it solidifies at a significant distance to the nature of the interface. The moment we start making pixel-perfect sketches, as in fully-fledged drawings meant to be handed off, is the moment we start holding off on writing code. You don’t have to draw much before writing code is way more efficient.

A finished-looking drawing opens the floor to superficial feedback on something that should have been more about an inherent logic. Code, as in actual working interfaces, has a higher chance of getting more useful hands-on feedback because it’s more realistic. There’s something there to work with, not only look at and have explained.

A finished-looking drawing is, strangely enough, seen as more locked than something made with code. Working with drawings gives the impression that they are the truth and something that the truth definers must sign off on before it’s “going to production”. But if something is code from the start, it can be changed; it’s flexible and makes people aware of iteration.

It’s just a tool #

I’ve gotten a reputation for disliking sketches. And that’s true. Not because they’re all useless, but because they are used uncritically in handoff-based workflows. I can say a lot about such workflows and how unfit they are, but another time.

When it comes to sketches, they are mainly non-essential to making interfaces, but it boils down to using the right tool at the right time. Not when the software vendors or collaboration theatre tell us to.