Experiences to treasure.
Stephen King offers an interesting quote about storytelling …
There are books full of great writing that don’t have very good stories. Read sometimes for the story … don’t be like the book-snobs who won’t do that. Read sometimes for the words – the language. Don’t be like the play-it-safers who won’t do that. But when you find a book that has both a good story and good words, treasure that book.
This notion can be applied to customer and user experience design. Creating an experience is like writing a book. The user is the reader and the design team the author. The concept is the substance of the story, the plot. And the design and execution are the words, the language.
Like books, there are experiences that tell great stories without great execution. And then there’s beautifully designed experiences that lack substance.
We need to create experiences like the books we treasure – wonderful stories conveyed beautifully. The challenge is doing both in tandem: tapping into users’ mindsets to tell a story that connects and telling that story in the best way possible, free of distractions.
You can fix anything but a blank page.
Nora Roberts
Author
The process.
Storytelling takes a very specific and refined skill set. It takes time to get from an initial artistic vision to an end-product. In the case of writing, the progression might go from an idea and outline, to draft, to proof. And through several iterations where the story and writing are both considered and distilled to be their best.
In experience design, the progression is similar, moving from wireframes to static mockups and finally to high-fidelity interactive prototypes. This gives designers the opportunities necessary to find the right combination of elements to create something worth treasuring.
It’s important to understand these distinct – but interrelated – design deliverables so that you’re not just creating a good story. Or a beautiful design. But an experience that’s both.
If you're trying to persuade people to do something, or buy something, it seems to me you should use their language, the language they use every day, the language in which they think.
David Ogilvy
The Father of Advertising
Wireframes.
The outline
In writing, the author might begin realizing an idea with an outline. The parallel in UX is a wireframe. Here, the designer establishes hierarchy, structure, the user journey and the calls to action.
Wireframes are low-fidelity blueprints that enable quick ideation and multiple iterations. They illustrate the stories we can tell through our experience.
What I use: Whiteboard, Paper, Illustrator, InDesign, Balsamiq, Omnigraffle, Axure, Sketch (and many others)
Static mockups.
The draft
Like a draft in writing, mockups are where designers explore and experiment with (visual) language. Mockups allow designers to instill branding, explore imagery in conjunction with messaging, create unique graphics and add other artistic elements like iconography, texture and color to present a high-fidelity representation close to the final customer-facing experience. As you might expect, creating mockups is time intensive. That’s due to the care put into infusing beauty into the experience.
Rapid ideation and iteration are more challenging to demonstrate in mockups than wireframes. But the benefit of mockups is that they make the concepts presented in wireframes tangible – and are an accurate depiction final product. This step follows wireframing because where wireframes established the plot, the mockups establish the language in which the story will be told.
What I use: Photoshop, Illustrator, Fireworks, InDesign
Interactive prototypes.
The proof
Now that the story (experience presented in wireframes) and language (design presented in mockups) has been crafted, it needs to be read.
Prototypes allow an interactive exploration of our story … we can enjoy it as if it were already developed and in market. By interacting with a prototype we can test how our plan has come to life and we can make improvements prior to sharing with our users.
This ensures that we spend less time making improvements and adjustments while in development. And it ensures the highest quality end product will make it to our users.
What I use: InVision; Marvel, Axure, Avocado
When you see a fashion show, you see those seven minutes of what was six months of tedious work of, you know, going up an inch and down an inch, changing it from one shade of red to another shade of red. So it's the same as any creative process. The result is what we see, but the process is really labor intensive.
Marc Jacobs
Fashion Designer
Why the process?
By moving from one step to another, you’re allowing time to consider and evolve the work thoughtfully. And you’re creating opportunities to collaborate with your team. Through this consideration, collaboration and evolution, your concept will naturally develop and mature, becoming more cohesive and intuitive; your design will be refined to convey that concept in a way that appeals to users’ eyes and minds.
Chances are you are working with experienced professionals that have the expertise to jump ahead. And sometimes that’s necessary. But you might be skipping the step that would have made your experience something your users would truly treasure.