Experience a story
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.
The digital creative
Converging disciplines.
A question you might have had, whether interviewing for a role, growing your team or personally contributing: how do user experience responsibilities overlap with those of a creative director? And subsequently, is the user experience practice limited to digital or does it venture into traditional terrain as well?
With digital playing a crucial role in nearly every growth and marketing campaign, user experience design is as critical a contribution as traditional creative – visuals and tone – to the success of any initiative.
Design can solve society’s biggest problems … if we cultivate a love of learning through the design process.
David Sherwin
Director of User Experience at lynda.com
Consider the role.
As a creative director, you facilitate all aspects of the creative process. You’re a guide for your team with skills and experience related to design, fine arts, motion graphics, writing and/or other creative industry fields.
In traditional mediums, such as print or television, this means strategic and on-brand use of color, typography, messaging, video, music, imagery, etc. These types of endeavors require a ‘man behind the curtain’ (or a very closely-nit team) making sense of the chaos and ensuring alignment to a shared vision. In total, a creative director’s goal is overseeing all creative deliverables to ensure strategic alignment, proper branding, consistency, and quality.
Not an easy task in itself, but add the mechanics and the interactivity of digital deliverables and diverse channels, like, extended reality, voice interfaces, mobile, desktop, and social, and it’s easy to be overwhelmed.
You don’t have to change who you are. You have to be more of who you are.
Sally Hogshead
New York Times Bestselling Author
Add more to your thinking.
The need for user experience thinking and skill can’t be neglected if you want to create a great product, one you’d want to use. It’s a layer of thinking that’s as important as the strategy, art and writing.
But resources are limited and it’s your responsibility to oversee the overall quality of a campaign; so you need to be a hybrid. And an ever-evolving, curious one. As a digital creative director, you must not leave the user experience to someone else, even if there’s the benefit of having an expert on your team. It’s just another facet of the final product to which you can contribute.
Principles of user experience design will benefit more than just your digital deliverables. This mindset will challenge you to consider your campaign from your audience’s perspective. You’ll more deeply consider how each tactic is connected to the next and how to ensure that each has the desired outcome, similar to a path-to-purchase in traditional shopper marketing.
Adopting these principles, you’ll approach the campaign as an interconnected journey, not just a creatively consistent one.
Those who learned to collaborate and improvise most effectively have prevailed.
Charles Darwin
Bring them together.
Of course, having (or acquiring) user experience expertise doesn’t eliminate the need for a diverse team with their own unique specialities. Differing points of view and areas of focus only make the work better and from collaboration comes the best results. So it’s important to acknowledge where your contributions are best and most efficiently applied based on your team.
But by adopting user experience into your personal skill set, you’ll better adapt to the team’s abilities and fill any gaps. Even better, when you apply your new thinking more broadly, your work will be more than a cohesive campaign; it will be an interconnected experience.
Inclusive by design
Diversity is a start.
Inclusivity is the goal.
Many places I’ve worked are striving for diversity. They have initiatives for employees, like LGBTQ-ally programs and minority workshops. And formal – and informal – incentives for hiring “diverse” candidates. That’s a good start.
But if I’m being honest, there’s not been any that have felt effortlessly and authentically inclusive – at least for not more than a few moments. But when those moments happen – or when you visit an office where there’s an easy atmosphere of all people feeling valued, heard and respected with the same access to the same opportunities – it’s magic. And you don’t know what you’re missing until you’ve witnessed it.
As employees in tech, we have to make an effort to foster an inclusive culture and model the behavior we hope to see in others. We need to encourage the shift from outdated paradigms. And – especially as designers – we need to wield our unique power and strive to be inclusive in our work that’s experienced by so many.
By no means exhaustive, but here’s some things I keep in mind …
Seek diverse points-of-view
Hear people out
Embrace the the unfamiliar
Be curious and ask questions
Avoid stereotypes
And represent everyone in the work (some resources below)
Make your work more inclusive.
The Gender Spectrum Collection is a stock photo library featuring images of trans and non-binary models that go beyond the clichés. This collection aims to help media better represent members of these communities as people not necessarily defined by their gender identities—people with careers, relationships, talents, passions, and home lives.
Humaaans is a free library of mix-&-match illustrations. You can customize people’s positions, clothing, colors and hairstyle to create some unique, inclusive scenes. Rotate and position the elements in your humaaans however you like. They’re like legos made out of flesh … and vectors. And add backgrounds to make them your own.
Nappy provides beautiful, high-res photos of black and brown people to startups, brands, agencies, and everyone else. It’s easy for companies to be purposeful about representation in their designs, presentations, and advertisements. And the images aren’t generic like a lot of stock photography, so it’s easy to be inclusive and authentic.
Jopwell’s smaller selection of photography features diverse coworkers in an office setting. The first collection is live and that there’s a first collection, we might hope that additional ones are to follow. Making use of the photos is free with a visible attribution to Jopwell.
A nicely curated selection of Muslim women found on Getty Images. You’ll find photos of Muslim women in casual and professional settings. While a few images may read a little too “stock” overall there’s a nice selection.
Getty Images partnered with Verizon Media and the National Disability Leadership Alliance to create a growing collection of images that break stereotypes and more authentically portray individuals with disabilities. The collections works with contributors to expand and grow it over time.