Sketching a Story Arc

I’ve found that if I ask our clients to start their sketching by thinking of requirements and modules, it can be difficult to relate to if they’re not working designers or developers. Recently, I’ve been adding storytelling techniques like using familiar characters and relatable situations to help our kickoff group brainstorm more empathetic solutions to design problems.

After everyone at the kickoff has spent 10 minutes sketching a set of 6–10 rough ideas on a sheet of paper, each person, working with a partner, presents his/her ideas in turn. Next, the partners collaborate to sketch a page that encompasses the best ideas from their thumbnail sketches. As we continue through the iterations of sketching and collaborating, the size of the group grows along with the size of the pages they are sketching. At the end of the exercise, there are 2–3 large groups that present their ideas for the redesigned site on the largest Post-it note in the known universe.

One part of the Design Studio that I’ve been experimenting with is how to introduce the task of what the kickoff team is going to sketch. In earlier iterations of the Design Studio, the sketching tasks were aligned with page requirements: “sketch a homepage that includes a slideshow, a news and events module, and a social media feed.” As I’ve evolved this workshop, I’ve also evolved what it is we’re giving folks as a starting point for their sketching. I have found it’s valuable to introduce a story arc to solve a design problem such as the sketching task in the Design Studio.

The Story Arc

Let me define what I’m thinking of when talking about story arcs. In the simplest terms, a story arc involve three things: a character, a conflict, and a resolution. Here’s an example from the cinema:

Alex is a veteran police officer who one day is attacked and killed by a gang of street toughs. Luckily, Alex is able to be resurrected in a biomechanical exoskeleton with his consciousness partially intact. He is then able to continue his police career, to avenge his “death,” and continue to fight the corruption that has plagued his home city of Detroit.

Let’s examine this character and situation. It’s safe to say both are clichés. If I say “veteran police officer,” it shouldn’t be too difficult to pull an image of a character into your mind. That character emerging as a hero on the other side of a conflict is just as easy to imagine. If I had said, “Marjorie, a recent college graduate, is looking for a roommate,” anyone can relate to that character and situation. Avoiding the abstract qualities of things like requirements and page modules (which are relatively easy for designers and developers to imagine) opens up the discussion for anyone on the client side to meaningfully contribute to the workshop.

I use this approach to guide our client team in the Design Studio. I start with a character who is representative of a key audience type (think low-fat persona) and encounters a conflict drawn from the business goals of the project and stakeholder interviews. Here’s how this works: At the beginning of the exercise, I will hand everyone in the workshop a sheet of paper; each sheet has a framework for a story written at the top, along with some crucial restraints to consider when they are brainstorming solutions. I typically hand out three different stories that each speak to a crucial problem that needs to be solved in the redesign project. Here’s an example from an absolutely real and not-at-all-made-up university project:

Michael is a prospective student at Jeremy’s Ventriloquist College, who was surprised by the low rating the school received in U.S. Bread and Circus Report’s review of puppetry schools. He’s interested in attending but concerned about his job prospects after graduation.

So, we have a character, budding puppeteer Michael, and a conflict, a less than stellar review of the school from a trusted source. We want to guide our sketchers to think about this beginning of a story arc and how to reach a resolution. The worksheet continues:

Perception is a problem. The historic perception of Jeremy’s Ventriloquist College doesn’t align with where the program is today. The Jeremy’s Ventriloquist College experience isn’t being represented well on the website. Prospective students are hungry to learn what the academic experience is like at Jeremy’s Ventriloquist College beyond their biases and misconceptions. Being able to see successful peers attending Jeremy’s Ventriloquist College community is important.

Sketch no less than six ideas demonstrating how the new Jeremy’s Ventriloquist College website provides informative content, stories, or step-by-step processes from which the students could learn more about life during and after their academic career.

Show and Tell

When we get to the presentation part of the Design Studio, I’ll ask people to show us their results and to frame their presentation in terms of: “How does this help Michael? What does Michael feel when he reads that information? What will Michael do next?” Because we are using characters and situations that the clients can relate to, the ideas they present are loaded with personal experience and are deeply empathetic. As a result, our characters can be at the center of all the ideas being presented.

When you design through storytelling, you’re thinking about: who is the audience for the story, how does the story begin, what is the audience’s journey along the way, and (hopefully) a happy ending. Looking at a design problem through that lens gives you a very compassionate view that can help your design reach the appropriate audience for the site in a very rich way based on personal experiences. What techniques have you found that use storytelling as a way to solve design problems?

Back to Top