Helmut Schmid & Otsuka Pharmaceutical

In 1980 graphic designer and typographer Helmut Schmid produced packaging design for Otsuka Pharmaceutical. these examples, featuring Univers, are amazing exercises in typographic clarity and a beautiful example of graphic design boiled down to information and clear communication. Nice colours too.



There is a great book covering the design of Helmut Schmid, ‘Design Is Attitude’ not sure if it’s still in print, details here. You can check out more of his work in the archive section of his website.




Golang! Go Language.

Go Language or golang - is a relatively new language from Google.  It was created in 2009 – it’s essentially a system language. It’s statically typed and has some similarities to C and C++ (structure, and syntax to some degree).

I recently decided I wanted to do some system programming, or at least some command line tools. In the past I would have looked at C as the option, but I thought I’d give Golang a Go!

The task I set myself for the initial project was that of a simple ftp deployment helper. I currently have to do quite a lot of deployment of development work, and currently this involves a lot of ftping different files. This can be a real pain, making sure the correct files have been uploaded – especially if they’re in different git repositories (essentially I want to set up our servers so we can deploy via git, but that’s another project!). So what I wanted to do was create something simple so I could just type :

iri deploy config.json files.json

And it would do the hard work for me.

I started the development in my limited spare time, and found Golang very easy to get into – there are plenty of useful documents and plenty of help on the variety of forums out there. One great feature of golang is it’s ability to use code repository sites such as github to home packages and a lovely simple mechanism to install them – it’s as simple as typing

go get address_to_some_repository

And there are a whole host of packages listed at the GoDoc website.

My deployment project – code named iri – can be found over at github . It’s still early days, it doesn’t actually do what it should do as of yet – so keep an eye on it and I’ll make a proper post once the project is working properly.


Future Book!

Thoughts on the creative possibilities of the future textbook

There is a slightly tatty paperback on my bookshelf. It doesn’t often get to see the light of day but in its time it’s hung around various design studios and has been passed around any number of creative types. It is the 1975 paperback edition of Josef Albers’ teaching tool The Interaction of Color.

Originally published in 1963 The Interaction of Color presented Albers’ theory that colour was governed by an “internal and deceptive logic”. Alongside the texts and commentary in the original edition Albers included 150 silkscreened plates intended for use in the classroom.

However, it’s my tatty 1975 paperback (with its small number of illustrations) that many would best know: a limiting format that doesn’t do the work any justice. The Interaction of Color was never meant to be read in such a limited, linear fashion, divorced from its rich illustrations. As such it is a perfect work to be given the interactive treatment – and in July this year Yale University Press launched the The Interaction of Color iPad app.

As a designer working in digital publishing this is an exciting project. The impact of digital on the industry is obviously huge, and projects like The Interaction of Color iPad app are significant pointers to the capabilities of the future textbook.

Albers’ exercises are all included in the app. Users can create, compare, save and share their own colour experiments. And of course functions that enable linking, annotating and bookmarking are all included – as is video. This is an addition that Albers could have never anticipated and it is to the app designers’ credit that this video content sits seamlessly alongside the texts and interactive studies. The ability to create studies is the most powerful tool in the app. Studies can be saved, commented on and shared. Colour pallets can be created and saved and used across studies.

The app does not pander to the book metaphor. There are no page curls or skeuomorphic page turning animations and so on. Unlike much of the digital publishing industry, it does not wholly align itself to the physical and metaphorical. It is the kind of design project that rises above the hackneyed ‘flat vs skeuomorphic’ debate. This app has great visual design – with enough affordance and signposting to understand the interactive model without relying too heavily on metaphors.

The Interaction of Color feels like an appropriately designed experience. It does not simply pander to current design trends and is a fantastic example of the level of design excellence that can be achieved at the intersection of hardware and software.

It is obvious tablet usage is growing as the technology gets cheaper. Tesco has just launched a £119 tablet with the questionable name of Hudl (‘the whole family can huddle around the Hudl’). Tablets and smartphones are becoming ubiquitous and integrated into our lives in a way unimaginable just 10 years ago. There is a mass of evidence pointing to the rise of tablet and mobile devices in the realm of education.

I was lucky enough to catch postgraduate medical student Joshua Harding talk at UKSG 2013 back in April. His presentation described his transformation into a paperless student.  He very succinctly summed up his issue with the printed textbook by showing a photo of the entire set of textbooks and ringbound notes from his first degree – a rather large pile.

His problem was obvious: how to quickly find information within that pile. So Joshua abandoned paper and went 100% digital. His iPad ‘study buddy’ was with him always, allowing him full access to all his texts wherever he might be. He could quickly find information through the search capabilities of his iPad. His notes and annotations were also made on his iPad – and could be linked and cross referenced with his textbook content.

Based on such experiences its easy to imagine the value of tablets in the classroom, and the opportunities digital brings to both instructors and students.

The networked device

There is a growing ‘standard’ feature set for digital texts. You can bookmark, highlight and annotate just like you could do with a paper textbook. But with digital you can also cite, track, organise, share, discuss and generally exploit the interconnectivities of the internet. No longer constrained by the linear format of the printed book, students can construct their own narratives individually and collectively and tailor the multitude of shared user generated narratives to their own needs.

The Kindle provides an excellent example of the usefulness of annotation tools within a networked environment. When a sentence gets highlighted everyone sees it – the more people that highlight the same sentence, the more affordance is given to the highlight that everyone sees. This functionality opens the door to user generated hierarchies just as link tracking helps generate user defined navigation.

To be able to align these sorts of social, utilitarian feature sets with the design consideration of texts such as The Interaction of Color and apply them to digital books that live online (and are therefore updatable, live, and delivered seamlessly across multiple devices) should be the utopian aim of today’s etextbook designers and developers.

In Future Shock (1970) Alvin Toffler argued that the accelerated rate of technological and social change caused people to be ‘Future Shocked’ or left in a state of “shattering stress and disorientation”.  It was hard not to think about Future Shock when I attended the recent AGI Open panel discussion on the current state of editorial design. There seemed to be a little bit of Future Shock in the eyes of the venerable members of the AGI when digital was discussed.

But they were reassured by strong evidence that print is not dead, or even dying. Hyphen Press and Unit Editions provided perfect examples of publishers producing small runs of beautifully crafted books for a niche audience. A smaller run means more care over design and construction and has a parallel with music formats. Vinyl had been long pronounced dead but a new audience has now embraced this (apparently) anachronistic format. Sales are up and so is the quality: todays pressings all seem to be of the 180g variety – reassuringly thick and heavy. A little like my huge Unit Editions Herb Lubalin book:

So the book is not dead. It has a little life yet. It’s possibly going to be more specialised, more  niche.

And with digital the opportunities and possibilities are there for all to see. The Interaction of Color app is an assured step into the future and hopefully a sign of things to come.

An edited (therefore probably less meandering) version of this post first appeared on the Semantico blog.


Firefox OS :: ZTE Open

I recently (today) received the ZTE Open Firefox OS hand set.  This is a £60 hand set running Firefox OS.  I’ve been watching the development of FirefoxOS since it was called Boot2Gecko with great interest.  As a advocate of open technology, the idea of using HTML5 (HTML,CSS,JS) as a platform for developing mobile apps really interested me, so I was keen to support an OS that is essentially a web-browser.  Now this concept isn’t new.  Palm did it, Google are doing it (With their Chrome OS).  So I was incredibly interested when Mozilla decided to focus on what they do best (after all Firefox Web Browser is one of my favourite browsers).

I was suprised when opening the packaging.  The shell of the phone does feel a little flimsy and plasticy – not sure it will handle too much of a hammering, but the actual feel of the phone in my hand was nice.  The shocking Orange colour wasn’t too bad on the eye.  It was a breeze to set up – with a very nice and slick wizard that holds your hand all the way.  I havn’t found the interface at all clunky, or sluggish – which was a bit of a suprise as nearly all the articles I’ve read have indicated that it wasn’t a particularly nice experience.  But then I’ve recently been using a terrible HTC wildfire with Android 2.2 which is a pig.

I’ve not spent a great deal of time with the phone, played with a few apps (FirefoxOS allows apps to be either hosted, or installed – hosted apps are essentially just short cuts to web-sites that run the app, installed are ones that you dl and keep on your phone).  I’ve made a few calls and the sound quality was good, and the dialler app worked as expected. From my experience so far things seem to be quite nice actually!

Firefox OS main emphasis is to focus on the emerging markets (China, India), so they want an OS that will run on low end handsets – and to be honest so far so good.  I fully anticipate some teething problems, after all this is an OS in its infancy (well the very foundations is GNU/Linux – so not too infant) – but at the moment I am pleased to be supporting Mozilla and their Firefox OS.

I’ll add some more posts as I continue to use this new handset – my main reason for getting it was to do some development work on Firefox OS and also to move away from Google / Apple products.


Culture eats itself: The aesthetic of technological fail made real

There is something weirdly odd but satisfying in seeing the aesthetic results of technological failure being realised as artefacts in the ‘real’ world. Glitch art has been kicking around as long as technology has been failing and recently there seems to be a new bunch of designers and artists creating some interesting glitch inspired art.

These self referencing, technical and cultural mashups are painfully post modern. As exercises in extreme cultural navel gazing they remind me of Ouroboros, the mythical snake that is constantly eating itself, the perfect symbol of eternal recurrence (and possibly postmodern regurgitated self referencing art culture …)

Here are three projects/artworks that I have come across over the last couple of months through various design blogs that are inspired by the glitch:

Glitch textiles by Phillip Stearns

These are just great, and what a good idea. Glitch art faithfully re-created as textiles. The lines of corrupted pixels make a great weave and Phillip Stearns is a clever man for making seeing this possibility and using Kickstarter to get this project up and running. Buy his glitch textiles here. … Also check out his Year Of The Glitch blog.


/ "


/ "


/ "


Abstract paintings by Beverly Fishman

Beverly Fishman produces abstract paintings that look just like corrupted bitmap images. I would imagine these 84″ wide, enamel on steel paintings would look impressive seeing them for real and I’m sure that glitched images are not her only influence … they kind of make me think of Koons and his aluminium ‘inflatables’ in an odd way – especially as I am looking at her paintings on a computer screen – they really do look like glitched out jpegs and I have to trust the accompanying copy telling me she’s an artist and these are paintings, just like I had to trust the little bit of text telling me a Koons’ ‘inflatable’ caterpillar was made of aluminium.  Here is some serious art speak:

“The patterns of Beverly Fishman paintings are transcriptions of EKG, EEG, and neuron spike readouts, with some bar codes thrown in to add a social measure to the disembodied bodily data. And, for good measure, some of the patterns are derived from the modular shapes of the pills and capsules that are supposed to cure us of our ailments, mental as well as physical. The pattern registers time, giving it spatial form, a geometrical objectification that suggests that all our problems are subjective and thus of no great consequence, however fraught with understated consequence the diagnostic patterns are.” - Donald Kuspit.

(Via triangulationblog.com)




\ ¿


| \ ¿


An architecture of density

These photographs of Hong Kong by Michael Wolf are just lovely. I cannot read any reference to glitched images on his site, so the inclusion of these images in this post is directly because of the meaning I put upon them. To me, they look like glitched out jpegs. Whether this was intended, whether glitch was an influence or reference I don’t know, but to my eyes, they certainly look like it.










Sketchbook pages 18.07.2013

A few recent sketchbook pages. I have been slow in my sketchbooks recently and after about six years of using Moleskines I have ditched them. Mainly because of the hefty prices Moleskines now charge – I feel I am subject to some kind of hipster tax. Moleskines recent crowd sourcing marketing fail also contributed to me moving on …

So more skulls (again) and Blondie.








ios7 – a few thoughts on UI design

A small disclaimer. I am an Apple user, and have had an iphone for a number of years now. I get on with the current interface but do find it a little over decorated. With ios7 I was hoping for some toning down of the various visual embellishments. I was excited about the more minimal approach Apple were said to be taking: I was looking forward to the dumping of the leather effect, the stitching and the green felt …

as flat as I could make it

I am using a slightly buggy developer version for this review (7 Beta 2), I will not comment on the really flaky bits as I am sure these will be fixed once the final version is launched. There has been a lot of talk around the interaction detail and I don’t want to add to the noise, but with so much chat over the design – chat all based around the same static images – I wanted to experience the operating system myself, on a device in my hand, interact with it and hopefully offer up a few salient comments.

I guess its a little harsh reviewing the design of a product still in development, I will try to keep this to a critique of the general aesthetic – what it looks like and how it feels to use. it’s difficult to judge what is a know issue and is going to be ironed out, and what are deliberate choices by Apples UI team.

To start there is the obvious talking point – the turning anti-clockwise of the Skeuomorphic dial and the flipping on of the Flat switch (sorry). I feel this whole skeuomorphic vs flat debate is overcooked, a generalization and focusing debate away from more important matters. And as for skeuomorphism, this overused term is one I look forward to seeing the back of (I am guilty of adding to the skeuomorphic noise myself). None of Apples design has even been truly skeuomorphic (can anything digital be skeuomorphic?)  but I guess the word has a new life and a new context … in reality Apples OS has been heavy on the use of metaphors. These metaphors still exist in ios7 no matter how ‘flat’ the design. An example is the dials for setting time on the alarm. exactly the same as they were, a forward facing dial, receding on the top and bottom edges giving a 3D effect. So a metaphor then. Of a real dial. A stylistic change rather than a conceptual one and not exactly ‘flat’ at all.

So onto the ‘flat’ design. There are many instances where the minimal design really does look quite beautiful – the easily accessible settings screens look lovely, and the weather app certainly looks ‘nice’. The calculator, with its simple functionality, really benefits from the minimal aesthetic and the subtle ‘tapped’ animation on the buttons game me one of those nice ‘ahhhh’ moments.

The icons suit this minimal thin lined aesthetic but the thin Helvetica just doesn’t work for me (more on that later). With the weather app, a cloudy day means white thin Helvetica on white clouds renders the text unreadable – hopefully something that will be fixed on the final release.

… And talking of the Weather app, if I swipe down to reveal the overview panel, the weather is shown as a description. Without any visual clues I missed it … and tapping on the description takes me to the weather app – an interaction with absolutely no signposting – a slightly concerning issue.

The calendar, music player and Messages app are examples of how white space and pure typography doesn’t always work, especially for small screens with dense information. For all its cleanliness the reduction of structure makes it all look a little out of focus – with no clear delineation of content the elements on the screen feel a little lost. When looking through the messenger app I was hankering for a little decoration or colour (I never thought  would write this but … ) a little drop shadow to lift the design and separate out the content a little.

The use of colour seems a little haphazard. In places garish colours seem to clash (the horrific Game Center homescreen) within other apps (the music player, Messages app) the lack of colour and predominantly white and grey colorway contribute to the lack of structure evident on these screens.

To be frank, I am not getting along with the thin Helvetica. Retina displays mean the screen resolution can do a good job rendering thin typefaces but just because you can doesn’t mean you should.

I am not sure of the rationale for choosing this typeface – I am guessing that it was because connotations of slickness that Helvetica thin has are values Apple shares and aspires to, but unfortunately there are other connotations. Helvetica thin is the typeface of makeup counters, lipstick ads in fashion magazines, flyers for cheezy house clubnights … not all high flying fashion expensive watches and ‘aspiration’. My initial gut feeling was that it felt too much ‘fashion’, too ‘cheeze’.

I have seen the word ‘Holographic’ used for the subtle animated effect of the homescreen icons and background. again, this could be memory issues, but it was a little glitchy. It also felt a little Flash Parallax effect circa 2003 rather than 2013 cutting edge tech. Overall a little gimmicky. I felt the same about the number pad in the previous Beta version. Tapping a number makes made the numeral and its circular holder become transparent, briefly showing the parallaxing background behind. This should have been one of those lovely tactile moments you associate with a slick Apple Interface or transition but it just came across as a little, well, cheap. In the updated Beta version flat colour is used instead of the background – an improvement, but with a lovely ‘tapped’ animated effect in use for the calculator other conventions are really not needed – I hope these conventions are reduced and Apple go for one effect for each interaction.

There seems to be the addition of depth in the overall design strategy – the animated background that sometimes peeks through the layer above, all hint at navigating through, into, rather just from side to side – when transitioning in and out of apps, scale is part of the animation transition, again, hinting at navigating ‘through’  - this 3D aspect of the navigation is a possible clue for future development into interaction models and is the one genuinely exciting thing I get from i0s7.

In conclusion

The new minimal ‘flat’ (arghhhhhhhh) design almost works, most of the time it looks lovely. There is a slight lack of visual clues for interaction, rather worryingly so. For all the over-embellishment of the previous OS at least thought had gone into wayfaring and signposting. A little more thought needs to go into the design of the more dense screens but from what I have seen so far small tweaks will fix these, and I am confident the final release will have these issues solved.

The thin type just does not work. A bespoke face, designed for screen must surely be in the pipeline if Apple really are claiming to be leaders in mobile design. Culturally and practically, Helvetica Thin is just not suitable or appropriate.

The hints of navigating through a 3D space are intriguing even though it is just a hint, and it will be interesting to see if this ends up being just gimmick instead of a clue for future innovation.

I am looking forward to the final release, my main hope is that the interaction signposting and wayfaring is much clearer, I have confidence this will be so, and that at some future point they dump Helvetica Thin for a bespoke face designed by Apple for Apple devices. The Helvetica fanboys may not like it but it just ain’t right.



Bouncer The One Armed Gunslinger: Alexandro Jodorowsky and Francois Boucq


Published in late 2011 but only arriving on my lap the other day, Bouncer The One Armed Gunslinger (published by Humanoids) is the second volume of collected issues in the ongoing adventures (or misadventures) of the half indian one armed gunslinger Bouncer, written by Alexandro Jodorowsky with art by Francois Boucq.

Bouncer, as his name suggests is the bouncer of the Inferno Saloon in the frontier town of Barro City, and his story is a violent one. The varied cast of characters in this graphic novel include a creepy, freaky trio of Mexican assassins, an aged spooky indian, evil landowners, a loyal three legged dog, a whole array of raggedy outlaws and the odd lynch mob. These characters inhabit a story drenched with violence. All very Sergio Leone, very spaghetti western. Oh, I forgot to mention the opium dens, the revenge obsessed hangwoman, the freaky murderous monkey and the hideously burnt and bedridden owner of the Inferno Saloon. All vital ingredients in this quite epic but exploitive tale. And by exploitive I mean very 70’s, very B movie. Which is a good thing.

Published in late 2011 but only arriving on my lap the other day, Bouncer The One Armed Gunslinger (published by Humanoids, US) is the second volume of collected issues in the ongoing adventures (or misadventures) of the half indian one armed gunslinger Bouncer, written by Alexandro Jodorowsky with art by Francois Boucq.

Bouncer, as his name suggests is the bouncer of the Inferno Saloon in the frontier town of Barro City, and his story is a violent one. The varied cast of characters in this graphic novel include a creepy, freaky trio of Mexican assassins, an aged spooky indian, evil landowners, a loyal three legged dog, a whole array of raggedy outlaws and the odd lynch mob. These characters inhabit a story drenched with violence. All very Sergio Leone, very spaghetti western. Oh, I forgot to mention the opium dens, the revenge obsessed hangwoman, the freaky murderous monkey and the hideously burnt and bedridden owner of the Inferno Saloon. All vital ingredients in this quite epic but exploitive tale. And by exploitive I mean very 70’s, very B movie. Which is a good thing.


The story opens with Bouncer becoming the town hangman against his wishes, corralled (contextual verb usage!) into the job by the town’s corrupt officials. Events conspire and he ends up being the reluctant hand that brings about the death of his old lover and her new amour. Both are victims of a set up by evil landowner Clark Cooper, with Bouncer the reluctant hangman. Clarke was previously embarrassed by Bouncer as he was booted out of the Inferno saloon and their mutual hatred fuels much of the plot. As all these shenanigans are going on, a mysterious old indian dude is jumping about the town rooftops knocking off members of the towns ruling elite by the nefarious means of a poisonous green coral snake.

There is much more to this graphic novel, and in particular the old Indian, than what I have described above. There is a flashback sequence that fills in some important backstory, and some heartbreaking plot twists and turns, but revealing more would be adding spoilers so I will resist it.


As a writer and director Jodorowsky is simply legendary and he is rightly celebrated for his films as well as his comic book writing. I first saw his very tripped out film Holy Mountain a couple of years ago and reading Bouncer reminded me that I really need to watch El Topo, his famously weird western.

My first introduction to Jodorowsky was via comic artist genius Moebius and The Incal, a series of comics with a vaguely parallel plot to that of Holy Mountain, that of a twisted and somewhat surreal journey to spiritual awakening. On the back of the success of The Incal Jodorowsky went on to write some great science fiction, notably Les Technopères (The Technopriests). Bouncer … was my first view of Jodorowsky writing a western, and I was a little reluctant to pick it up as my first – my only exposure to Jodorowsky is through his sci fi writing, but I should not have been worried, after a couple of pages in I was hooked.

The art in Bouncer … is by Francois Boucq. A french comic legend, the only Boucq art I have been exposed to previously is the set of satirical shorts collected as Pioneers of the Human Adventure and featuring his absurd character Jérôme Moucherot (published in 1989 by Catalan Communications and translated by Elisabeth Bell who seems to have translated every foreign language comic I read growing up.)

The art by Boucq is excellent, he has that lovely loose but realistic french style, full of energy and expression, and with the analogue appearance of pens and pencils rather than the sterile computer generated look of many contemporary mainstream comics. His art in Bouncer … has moved along since the eighties and Monsieur Moucherot. The quality of line is less scratchy and urgent, but still fluid and expressive. The colouring more subtle and muted. The colour palette in Bouncer … is especially evocative of seventies westerns, all sepia and beautiful autumnal shades of red and orange.

The exaggerated proportions and features of his characters has been replaced with a much more considered approach, but there is still huge expression and character in the faces of his protagonists. Maybe this is due to the subject matter, I would be interested to check out his other contemporary work, and after reading Bouncer … I certainly will track some down.



Chatting to my comicbook aficionado friend about Bouncer … the other night we both remarked on how painterly some of the panels look, in their composition. Bouncer looks like it has been inspired by the epic westerns of John Ford, and my friend pointed out that Ford himself was influenced by the great american painters of the frontier, painters like Thomas Cole, Frederic Church and Albert Bierstadt. Seeing the beautifully composed painterly panels within Bouncer … seems to complete the circle. Bouncer … is a perfect love letter to the Westerns of Ford, but it’s also a note scrawled in blood on the back of a fag packet, addressed to Sergio Leone.

All in all I can’t really fault Bouncer, The One Armed Gunslinger. I am not a huge fan of the western in comic format, Blueberry by Moebius aside. The fact that I enjoyed this so much is a testament to artist and writer. Having always been a fan of Jodorowsky’s writing, I am now on a mission to track down more contemporary English language translations of work by Boucq. Can’t say much more than that really.


Wireframing: Why low fidelity rules

Wireframing is a fairly ubiquitous tool used as part of the UX process when building sites, apps and games – anything you would interact with through a screen. Generally used to convey what requirements and features are on each page or screen, and to communicate a rough understanding of layout, grouping and hierarchy, wireframing is a great tool for UX practitioners.


This post is not about whether wireframes are needed or not – sketching out a project in one form or another is never a bad thing even if your canvas of choice is the back of a fag packet … and semantics aside, I see ‘sketching’ as wireframing too; sketching out pages or features is simply wireframing in a very low fidelity manner. This post is my thoughts on why low fidelity wireframing can be a much more useful process than high fidelity wireframing.

I will try to outline my issues with high fidelity wireframes below:

They are costly to produce

Firstly they are time consuming (and therefore costly) to produce – time better spent prototyping and refining features rather than specifying and documenting them with detailed annotations and diagrams.

They can become scope

With full-on bells and whistles wireframing there is a risk that a wireframe document becomes a project scope – other documents should be fulfilling this task, using stories and scenarios is a sensible approach to defining functionality and scope and one that developers can produce and work to.

They can be intimidating

Very detailed annotated wireframes are often cumbersome, can be intimidating to those unused to working with wireframes, and are hard to decipher. They have a very ‘final’ feel to them when they need to be open to amendment and feel ‘live’ – wireframes should be ripped up regularly – the first iteration of your wireframes will never solve every problem, and will always highlight issues that will need fixing.

They are too prescriptive

Probably the most common issue most would have experience with is when wireframes are too ‘designed’. This leads to issues with your client having to separate Information Architecture from design. Again, hard to do if you are not used to working with these kind of documents. I have had very sensible UXDs tell me this ain’t so, clients know the difference. Well, sadly my own experience contradicts this – having once been parachuted halfway through the ‘discovery’ process of a site build, when visual designs were finally presented I had to explain why I wasn’t using the button styles as defined on the wireframes …

… and this leads me to another problem with high fidelity wireframes – the situation where non designers are designing. By choosing that option of beveled corner, that line thickness, design decisions are being made that will be hard to unpick later when a visual designer gets to start the design process. “… but I liked those buttons you had in the previous designs …”

High fidelity wireframes can also be very prescriptive for a designer, and take away the value a good visual designer brings – even for grouping and layout wireframes should not be too prescriptive and need to allow for interpretation – wireframes cannot show how typography, colour, tone, contrast and texture can can all impact upon the hierarchy of information on a page.

The UX community is its own worst enemy with this issue. The amount of high fidelity tools and GUI kits available to create prototypes, diagrams and wireframes is a little scary. Perfect for rapid prototyping but not so good when used for static wireframes.

I understand the temptation to make a wireframe look pretty, resist it. If you can’t resist it, then you’re probably a frustrated graphic designer rather than a UX designer. If you’re worrying how a client will get excited about a load of grey boxes, how you’re going to sell an idea based on a sketched wireframe – well, if you’re asking those kind of questions you just don’t get what wireframing is. You’re a salesman or marketeer and you need other tools.

Your clients need to be able to divorce features and layout from aesthetics – functionality needs to be understood, tested and refined without the influence of style. Coke, for example, are instantly identifiable due to their strong red colourway even though they are currently all about personalisation (buy one with your name on it!). These values inform your concept, your idea. There is no need to to colour your wireframes bright red.

So what makes low fidelity wireframes or sketching any better?

Low fidelity wireframes encourages collaboration

Anyone can draw. The simple physicality of paper and pens lends itself to a more open discussion. Rather than one sole UXD in front a computer screen, diagramming away in Omnigraffle or Axure, UXDs, UI designers, developers – all can have input when sketching around a table. The wireframe does not become a document with one author, to be checked and approved by others, but a collaborative piece of work which can have input from all relevant areas of your business.

Speedy speedy

Sketching and producing low fidelity wireframes is a fast exercise: you fail sooner, which is a very good thing – problems can be identified and solved much quicker. Deal with fail as soon as you can. Speed also means several layouts can quickly be reviewed, refined or discarded. Time less spent on wireframing means more time and budget can be spent prototyping, a much more valuable exercise than creating detailed static wireframes.


Low fidelity wireframes look just that – lo-fi. Even more so if sketched onto paper. This communicates that the wireframes really are just sketches and not design. By avoiding ‘design’ discussion can focus on features, hierarchy and layout rather than whether your button edges are rounded or not.

Gets your client involved

Around a table, participating in the production of your low fidelity sketches, can sit your client. And this is possibly the greatest advantage of low fidelity wireframes – you can involve client stakeholders from the start – and not in a political exercise, giving client involvement a bit of lip service, but as a way to gather vital opinions, thoughts and insight. Opinions that might pop up to rock the boat unless you can prise them out of your client and deal with them at the earliest possible stage.

So, to sum up – I am definitely a low fidelity fan, but I can see the case for more high fidelity wireframing; for when complex functionality needs defining but is not reliant on visual design. Lists and search results, e-comm functionality and pages based around forms, all examples where more fidelity could be needed. Even in those cases, any high fidelity wireframing is logically an evolution of low fidelity wireframing or sketching. However you look at wireframing, the sooner you are prototyping, seeing and experiencing interactions on a screen, the better.

The best way of knowing if and what wireframes are applicable? Talk to your client. Find out their expectations, where they need help, where they don’t. Don’t have a standard process for every job or client, as not every job or client is the same. Easy!