Halvor William Sanden

UI sketches, not just a waste of time

I stopped making them several years ago, people don’t ask me for them and I don’t get handed any. 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 completely useless.

Fidelity and intent #

Sketches can be useful when made with the right fidelity for the 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 base our interfaces on.

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

  1. It’s not about the complete picture. Research and coming up with ideas include taking a look 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. Somewhere in the heaps of identical examples of current styles and colours, we can find hints that spark new ideas.
  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 mostly 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 a different one.

Understanding #

Sketches can also be a good thing to make when many people are trying to get a shared understanding of an interface description. Images are inferior to text when it comes to represent or describe interfaces, but can work as supplements or as a way to move a larger process forward. 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. This is where things can get tricky if not everyone involved has a clear understanding of what they are looking at.

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

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 coding becomes 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 interfaces that actually work, has a higher chance of getting more useful hands-on feedback instead because it’s more realistic. There’s something there to work with, not only look at and get explained.

Strangely enough, a finished-looking drawing is seen as more locked than something made with code. Working with drawings gives the impression that they are the truth, something that must be signed off on before "going to production". But if something is code from the start, it can be changed, it’s flexible – and it 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. There’s a lot to be said about those workflows and how unfit they are to build interfaces with but that’s for another time.

When it comes to sketches, they are mostly non-essential to make 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.