November 18, 2014
3 min

From Exposition to Resolution: Looking at User Experience as a Narrative Arc

Optimal Workshop
“If storymapping could unearth patterns and bring together a cohesive story that engages audiences in the world of entertainment and film, why couldn’t we use a similar approach to engage our audiences?’Donna Lichaw and Lis Hubert

User Experience work makes the most sense to me in the context of storytelling. So when I saw Donna Lichaw and Lis Hubert’s presentation on storymapping at edUi recently, it resonated. A user’s path through a website can be likened to the traditional storytelling structure of crisis or conflict, exposition — and even a climax or two.

The narrative arc and the user experience

So just how can the same structure that suits fairytales help us to design a compelling experience for our customers? Well, storyboarding is an obvious example of how UX design and storytelling mesh. A traditional storyboard for a movie or TV episode lays out sequential images to help visualize what the final production will show. Similarly, we map out users' needs and journeys via wireframes, sketches, and journey maps, all the while picturing how people will actually interact with the product.

But the connection between storytelling and the user experience design process goes even deeper than that. Every time a user interacts with our website or product, we get to tell them a story. And a traditional literary storytelling structure maps fairly well to just how users interact with the digital stories we’re telling.Hence Donna and Lis’ conception of storymapping as ‘a diagram that maps out a story using a traditional narrative structure called a narrative arc.’ They concede that while ‘using stories in UX design...is nothing new’, a ‘narrative-arc diagram could also help us to rapidly assess content strengths, weaknesses, and opportunities.’

Storytelling was a common theme at edUI

The edUi conference in Richmond, Virginia brought together an assembly of people who produce websites or web content for large institutions. I met people from libraries, universities, museums, various levels of government, and many other places. The theme of storytelling was present throughout, both explicitly and implicitly.Keynote speaker Matt Novak from Paleofuture talked about how futurists of the past tried to predict the future, and what we can learn from the stories they told. Matthew Edgar discussed what stories our failed content tell — what story does a 404 page tell? Or a page telling users they have zero search results? Two great presentations that got me thinking about storytelling in a different way.

Ultimately, it all clicked for me when I attended Donna and Lis’ presentation ‘Storymapping: A Macguyver Approach to Content Strategy’ (and yes, it was as compelling as the title suggests). They presented a case study of how they applied a traditional narrative structure to a website redesign process. The basic story structure we all learned in school usually includes a pretty standard list of elements. Donna and Lis had tweaked the definitions a bit, and applied them to the process of how users interact with web content.

Points on the Narrative Arc (from their presentation)

narrative arc UX

Exposition — provides crucial background information and often ends with ‘inciting incident’ kicking off the rest of the story

Donna and Lis pointed out that in the context of doing content strategy work, the inciting incident could be the problem that kicks off a development process. I think it can also be the need that brings users to a website to begin with.

Rising Action — Building toward the climax, users explore a website using different approaches

Here I think the analogy is a little looser. While a story can sometimes be well-served by a long and winding rising action, it’s best to keep this part of the process a bit more straightforward in web work. If there’s too much opportunity for wandering, users may get lost or never come back.

Crisis / Climax — The turning point in a story, and then when the conflict comes to a peak

The crisis is what leads users to your site in the first place — a problem to solve, an answer to find, a purchase to make. And to me the climax sounds like the aha! moment that we all aspire to provide, when the user answers their question, makes a purchase, or otherwise feels satisfied from using the site. If a user never gets to this point, their story just peters out unresolved. They’re forced to either begin the entire process again on your site (now feeling frustrated, no doubt), or turn to a competitor.

Falling Action — The story or user interaction starts to wind down and loose ends are tied up

A confirmation of purchase is sent, or maybe the user signs up for a newsletter.

Denouement / Resolution — The end of the story, the main conflict is resolved

The user goes away with a hopefully positive experience, having been able to meet their information or product needs. If we’re lucky, they spread the word to others!Check out Part 2 of Donna and Lis' three-part article on storymapping.  I definitely recommend exploring their ideas in more depth, and having a go at mapping your own UX projects to the above structure.

A word about crises. The idea of a ‘crisis’ is at the heart of the narrative arc. As we know from watching films and reading novels, the main character always has a problem to overcome. So crisis and conflict show up a few times through this process.While the word ‘crisis’ carries some negative connotations (and that clearly applies to visiting a terribly designed site!), I think it can be viewed more generally when we apply the term to user experience. Did your user have a crisis that brought them to your site? What are they trying to resolve by visiting it? Their central purpose can be the crisis that gives rise to all the other parts of their story.

Why storymapping to a narrative arc is good for your design

Mapping a user interaction along the narrative arc makes it easy to spot potential points of frustration, and also serves to keep the inciting incident or fundamental user need in the forefront of our thinking. Those points of frustration and interaction are natural fits for testing and further development.

For example, if your site has a low conversion rate, that translates to users never hitting the climactic point of their story. It might be helpful to look at their interactions from the earlier phases of their story before they get to the climax. Maybe your site doesn’t clearly establish its reason for existing (exposition), or it might be too hard for users to search and explore your content (rising action).Guiding the user through each phase of the structure described above makes it more difficult to skip an important part of how our content is found and used.

We can ask questions like:

  • How does each user task fit into a narrative structure?
  • Are we dumping them into the climax without any context?
  • Does the site lack a resolution or falling action?
  • How would it feel to be a user in those situations?

These questions bring up great objectives for qualitative testing — sitting down with a user and asking them to show us their story.

What to do before mapping to narrative arc

Many sessions at edUi also touched on analytics or user testing. In crafting a new story, we can’t ignore what’s already in place — especially if some of it is appreciated by users. So before we can start storymapping the user journey, we need to analyze our site analytics, and run quantitative and qualitative user tests. This user research will give us insights into what story we’re already telling (whether it’s on purpose or not).

What’s working about the narrative, and what isn’t? Even if a project is starting from scratch on a new site, your potential visitors will bring stories of their own. It might be useful to check stats to see if users leave early on in the process, during the exposition phase. A high bounce rate might mean a page doesn't supply that expositional content in a way that's clear and engaging to encourage further interaction.Looking at analytics and user testing data can be like a movie's trial advance screening — you can establish how the audience/users actually want to experience the site's content.

How mapping to the narrative arc is playing out in my UX practice

Since I returned from edUi, I've been thinking about the narrative structure constantly. I find it helps me frame user interactions in a new way, and I've already spotted gaps in storytelling that can be easily filled in. My attention instantly went to the many forms on our site. What’s the Rising Action like at that point? Streamlining our forms and using friendly language can help keep the user’s story focused and moving forward toward clicking that submit button as a climax.

I’m also trying to remember that every user is the protagonist of their own story, and that what works for one narrative might not work for another. I’d like to experiment with ways to provide different kinds of exposition to different users. I think it’s possible to balance telling multiple stories on one site, but maybe it’s not the best idea to mix exposition for multiple stories on the same page.And I also wonder if we could provide cues to a user that direct them to exposition for their own inciting incident...a topic for another article perhaps.What stories are you telling your users? Do they follow a clear arc, or are there rough transitions? These are great questions to ask yourself as you design experiences and analyze existing ones. The edUi conference was a great opportunity to investigate these ideas, and I can’t wait to return next year.

Publishing date
November 18, 2014
Share this article
Topics

Related articles

min read
Affinity mapping - an introduction

User research is key to discovering the inner workings of your users’ minds – their emotional, organizational, informative needs and desires. These are all super important to creating a user experience that is intuitive and meeting your users’ needs in a way that means they feel loved, cared for and considered. All the deep understanding stuff that keeps them coming back!

Qualitative research allows you to collect verbatim data from participants that give insights into why they do or feel things. You can even get into whether ‘Dee’ understood how the website worked or why ‘Andrew’ would (or wouldn’t) revisit the app outside of testing.

Gathering these awesome insights is one step. Analyzing and organizing these is a skill and talent in its own right. And armed with the right tools or methods it can be immersive, interesting and a great way to get under the skin of your users. Let’s take a look at affinity mapping as a method of analyzing this data - as a tool it can help researchers visualize and easily group and theme data.

Affinity mapping is used outside of the UX world and can be done independently, however is a great analysis method to use collaboratively. For researchers, it can be a great tool to collaborate and engage the team and potentially stakeholders. Bringing people together to identify, discuss and resolve user experience issues. 

Here we’ll lay out what affinity mapping is, specifically why it’s useful for user research and set out key steps to get you underway. 

What is Affinity Mapping? 🗺️

By definition, affinity mapping is the process of collecting, organizing, and grouping qualitative data to create an affinity diagram.

Put simply it is a tool to group, map, sort and categorize information. A tool where you’ll look at the information and patterns of your qualitative user research and work to group these together to make sense of them. It helps you to find patterns, similar outcomes and insights that allow you to draw conclusions and collate results in a cohesive manner, then report to the wider team in a way that makes sense and provides a clear road to applicable and achievable outcomes.

What is an Affinity Diagram? 🖼️

An affinity diagram is what you have once you have gone through the affinity mapping process. It is the final ‘diagram’ of your grouping, sorting and categorizing. An ordered visual sorting of insights and information from your user research. And the place to filter or funnel observations and information into patterns and reach final outcomes. 

Allowing you to see where the key outtakes are and where there may need to be improvements, changes or updates. And from here a roadmap can be decided.

An affinity map using Reframer by Optimal Workshop

Essentially the mapping part is the process of creating the diagram, a visual sorting of insights and information from your user research. So how do you make affinity mapping work for you?

1. Start with a large space

This could be a table, desk, pinboard or even a whiteboard. Somewhere that you can stick, pin or attach your insights to in a collaborative space. Becoming more common recently is the use of shared digital and online whiteboard tools.  allowing people to access and participate remotely.

2. Record all notes

Write observations, thoughts, research insights on individual cards or sticky notes.

3. Look for patterns

As a group read, comment and write notes or observations. Stick each of the notes onto the board, desk or whiteboard. Add, and shuffle into groups as you go. You can keep adding or moving as you go.

4. Create a group/theme

This will start to make sense as more sticky notes are added to the map. Creating groups for similar observations or insights, or for each pattern or theme.

Create a group/theme using affinity mapping

5. Give each theme or group a name

As more notes are added there will be natural groups formed. Openly discuss if there are notes that are more difficult to categorize or themes to be decided. (We’ve outlined some ideas for UX research themes in another section below.)

6. Determine priorities

You’ve tidied everything into themes and groups, now what? How do you decide which of these are priorities for your organization? Discussion and voting can be the best way to decide what outcomes make the most sense and may have the biggest impact on your business.

7. Report on your findings

Pulling together and reporting on the findings through your affinity diagram process should be key to putting actionable outcomes in place.

How to define research themes 🔬

Commonly, user research is digested through thematic analysis. During thematic analysis, you aim to make sense of all the notes, observations, and discoveries you’ve documented across all your information sources, by creating themes to organize the information. 

Depending on your role and the type of research you conduct, the themes you create for your affinity diagram can vary. Here are some examples of affinity groups that you could form from your UX research:

  • User sentiment and facial expressions when completing certain tasks
  • Frequently used words or phrases when describing a product or experience
  • Suggestions for improving your product or experience

Wrap up 🌯

Qualitative user testing and the resulting observations can be some of the best insights you get into your users’ minds. Filtering, organizing and ordering these disparate and very individual observations can be tricky. Especially if done in silo.

So, draw a team together, bring in stakeholders from throughout your organization and work collaboratively to sort, organize and categorize through affinity mapping. This opens the doors to discussion, buy-in and ultimately a collective understanding of user research. Its importance and its role within the organization. And most importantly the real-world implications UX research and its insights have on organizational products and output.

min read
Product Roadmap Update 2024 🛣️ 🎉

We’re excited to announce the latest updates to our platform to help teams test, validate and gain insights early in the design process. Looking ahead to the rest of 2024, stay tuned as we expand Optimal’s research capabilities with new tools and features, including Prototype Testing, Qualitative Insights, and upgraded Surveys along with enhanced admin management and user roles!

What’s new at Optimal? 🤩

Advanced Recruitment 🙋🙋🏾


We’re thrilled to share the launch of our new Advanced Recruitment offering with high quality and expanded profiling capabilities for hard-to-reach audiences. Advanced Recruitment leverages our in-house recruitment team and a new powerful, award-winning panel — PureSpectrum — to give you access to millions of participants across 100+ countries. Optimal handles recruitment logistics from start to finish, guaranteeing quality responses and replacing low-quality participants at no extra cost.

Early access is now available. To get started, submit your criteria via the request form. Starting in early August, you’ll be able to access Advanced Recruitment via the Optimal Recruit tab. Recruitment is available for all Optimal tools except for Qualitative Insights (Reframer).

What’s coming next? 🔮🧙

Test your designs early and often with our latest tool:  Prototype Testing ⚙️

The newest edition to the Optimal toolkit is just around the corner.  Prototype testing will allow you to quickly  test designs with users throughout the design process, to help inform decisions so you can build on with confidence.


You’ll have the option to easily import low or high-fidelity prototypes directly from Figma or build your own prototypes from scratch  by uploading images or screenshots and creating clickable areas. Prototype testing allows you to Identify usability issues and areas for improvement throughout the design process to iterate and improve your designs quickly with your users.

Video Recording 🎬📽️🎞️

Soon after we launch Prototype testing, we’ll be adding Video Recording to allow you to record a participant completing a prototype test. You can capture nonverbal cues like eye rolls and frustration, screens and voices to better understand user experiences, and gain deeper insights for Prototype Testing. Video recording is browser-based, with no plug in required eliminating setup complexities. Consent to record is captured upfront in the testing process and can be tailored to meet your organization’s policies.

Qualitative Insights & AI 🤖✨

You’ll be able to capture meaningful insights faster and more efficiently with the new Insights feature under our Qualitative Insights (Reframer) tool. Create Insights — takeaways or key findings from a study — and keep them organized under the new Insights tab. Create a new Insight from observations or use AI to generate Insights. Each Insight will contain a title, description, and associated observations.

Note that you and your organization will always maintain complete control over any AI engagement. All AI-generated results are editable. Leverage AI as needed for your studies or decide to turn off access completely for your organization.

Admin Management and User Roles 👨🏻💻

For Enterprise customers, we’ll be introducing enhanced admin management capabilities. Create and manage multiple workspaces tailored to your team’s needs, with improved reporting and user role flexibility. The new admin role ensures robust control without consuming additional licenses.

Surveys Upgrade 📋

We’ll be transforming surveys with enhanced usability, advanced survey logic, and AI integration, empowering you to create, launch, and analyze surveys with ease. Our focus on improving usability will make creating, editing, and launching surveys easier than ever, including new question types, question cloning, question grouping, and AI assistance to streamline survey creation.

Help us build a better Optimal Workshop 🧰

We’re looking for customers to join our research and beta panel to help influence product development. From time to time, you’ll be invited to join us for interviews or surveys, and you’ll be rewarded for your time with a thank-you gift.  


If you’d like to join the team, email product@optimalworkshop.com.

min read
How to create an effective customer journey map

Understanding your customers is central to any organization which wants to deliver an outstanding experience. But how do you understand your customers better? Tailoring their experience with your products and your organization to suit them should include a customer journey map.

It doesn’t mean your organization needs a brightly colored, fully designed infographic that outlines each and every action your user takes within your product. It does mean an effective customer journey map that promotes empathy and provides a clear vision for improving customer interactions. There are no rules around what that visualization looks like and it is up to your team to create one that makes the most of your customer’s journey.

What is customer journey mapping? 🤔

Customer journey mapping (sometimes referred to as a user experience map) is a technique that allows you to visualize your customer’s key touchpoints, sentiments, pain points, and actions. Plotted in sequential order. It’s a map of a customer’s experience with your brand or product, from awareness to purchase and beyond. 

Customer journey mapping helps you look beyond key touchpoints and encourages empathy with your customers. To understand who they are, even a persona to give them a life and demographic. Helping designers and key stakeholders understand where they are coming from. And where you can address their needs, avoid their pain points and encourage them to engage with your product. And even identify opportunities for innovation and improvement across the board.

Why you need a customer journey map 💥

What’s better than a customer that feels seen and understood once? A customer that feels the organization or product really understands their needs (and responds to their frustrations). Like all successful, long-term relationships, keeping customers returning is built on empathy and a solid grasp of their needs and frustrations. 

When you want to get to know your customer, like really get to know them, it’s essential to map their customer journey. Creating a shared understanding of what your customers think, feel, and struggle with as they interact with your organization. Spending the time to establish a customer journey map can help align around identifying known problems, identifying new user pain points, and removing roadblocks for your customers, ensuring their success.

Spending the time to get inside the mind and journeys of your customers through mapping helps your team to:

  • Create a visual guide of the end-to-end customer experience
  • Get an understanding of multiple customer pathways and unravel complex user experiences
  • Create target personas and allow insights to solve problems more effectively
  • Increase your organization’s empathy for your current and future customers
  • Identify potential pain points and roadblocks for your customers
  • Breakdown silos within your organization and improve alignment across teams
  • With a clearer understanding of your customers, better insights to achieve stakeholder buy-in

How to create a customer journey map 🛤️

Here are 8 key steps to get the most out of your customer journey map process:

  1. Bring key stakeholders together for an initial brainstorming session
  2. Identify potential user personas - demographics, pain points, interests, etc
  3. Create an empathy map - get a real feel for your customer, who they are, and what they want
  4. Flesh out your ideas with user research. Get under your user persona skin with focus groups, interviews, and surveys
  5. Identify possible customer touchpoints
  6. Choose the information you want to highlight - not everything will be relevant
  7. Decide on the best customer journey map tool to answer your questions
  8. Start building your map

Customer journey mapping examples 🗺️

Each and every customer’s journey is different. This, of course, means that there is no single best customer journey map example or template. Instead, the best customer journey map for any given situation will depend not only on your customers but also on your product, your team, and the goals you’re hoping to achieve by creating the map in the first place.

We’ve found a few examples of customer journey maps to help inspire your thinking:

Current state customer journey maps help you to visualize a user’s experience as it is right now. These are fact-based journey maps - to create an accurate, current state journey map. A good dose of user research data around your actual customers and interactions will help shape this.

An example of a customer journey map
An example of a customer journey map

Future state customer journey maps focus on what the customer journey can and should look like in the future. Although UX data is certainly an important aspect of understanding customers, future state journey maps involve a fair amount of creative speculation and interpretation. These customer journey maps focus on customer hopes and wants (future feelings), in addition to experiences and reactions. They can be a little objective and should be developed in balance with both positive and negative interactions.

Day in the life customer journey maps help you visualize your customer’s entire daily routine. Interactions with family, their commute, work meetings, afternoon coffee, etc. Regardless of whether or not the activities are related to your company. This type of journey map should be organized chronologically to give key insights into how and where customers are. What are the distractions, and where could they interact with your brand or product? How can key pain points be eased?

Service blueprints are a useful counterpart to a classic customer journey map. Whereas a customer journey map focuses on the thoughts, needs, and actions of the customer, a service blueprint reflects the perspective of the organization and its employees. What needs to happen behind the scenes to ensure the customer’s experience is the very best it can be.

Circular customer journey maps may be useful to visualize the customer journey as a circle or loop. Recognizing that some customers are recurring and non-transactional. Particularly through subscription-based relationships.

An empathy map is used to create a shared understanding of customers around their wants, needs, thoughts, and actions. This can be a great starting point to getting under your customer’s skin.

An example of an empathy map
An example of an empathy map

Wrap Up 🌯

There is no one size fits all customer journey map. Each customer is unique, each organization is different. Through creating customer journeys, personas and visualizing their key touchpoints, pain points, and understanding who they are, empathy throughout the organization can be generated. With this as a tool to bring key stakeholders on board and to pinpoint where products (and services) can be improved to keep customers or even bring new ones on board, the user experience can be better and more effective.

Seeing is believing

Dive into our platform, explore our tools, and discover how easy it can be to conduct effective UX research.