STORYPLY: Designing for User Experiences Using Storycraft

Abstract

The role of design shifts from designing objects towards designing for experiences. The design profession has to follow this trend but the current skill-set of designers focuses mainly on objects; their form, function, manufacturing and interaction. However, contemporary methods and tools that support the designers’ creative efforts provide little help in addressing the subjective, context-dependent and temporal nature of experiences. Designers hence need to learn by trial and error how to place experiences at the center of their creative intentions. We are convinced that there is room for new tools and methods that can assist them in this process. In this chapter, we argue that storycraft can offer part of the guidance that designers require to put experiences before products right from the very start of the design process. First, we establish the background behind the shift from products to experiences and explain the challenges it poses for the designer’s creative process. Next we explore the contemporary conceptual design process to understand its shortcomings, point out the opportunity that storycraft offers and propose our approach to take on this challenge. Last but not least, we propose a specific method called Storyply that we have designed and developed iteratively by testing it in conceptual design workshops with students and professionals.

These keywords were added by machine and not by the authors. This process is experimental and the keywords may be updated as the learning algorithm improves.

From Products to Experiences

Design is fundamentally an exploratory process. It starts with an idea. Inspirations motivate designers to approach a problem and/or opportunity by generating, developing and testing ideas (Brown 2009). This is a process in which creative minds extend the boundaries of what is possible (Osterwalder 2010). An average training in design teaches you what you need to know about how to systematically try a design challenge, and provides you with the skill-set to explore your options. This skilled practice of conceptualizing and appropriating innovative ideas into people’s lives on a daily basis is in the designer’s generic job description.

However, the designer’s specific roles in industry along with their impact on society have evolved tremendously in the last couple of decades. If you put the popular designer titles in a chronological order of appearance you would get something like: (1) Industrial Designers, (2) Product Designers, (3) Interaction Designers, (4) User Experience Designers and (5) Service Designers. This is due to the shift of focus from ‘manufacturing-centered form-giving’ towards ‘human centered creation of experiences and services.’

To explain this evolution, Brown points at the shift of economic activity from industrial manufacturing to knowledge creation and service delivery in the developing world (Brown 2009). Irwin, suggest that this is the century for design since it is the only discipline that is equipped to address today’s problems, envision a new future and shift the conventions around how people think, behave and understand the world (Baskinger 2012). Sibbet sees this situation as a consequence of the emerging economies interest in creativity and innovation (Sibbet 2011).

Surely technological developments play a big role here since design is more relevant through technology than ever before. The extensive integration of technology into people’s lives translates into the design domain as a new generation of requirements. Useful, comfortable and beautiful is not enough anymore. Design efforts need to explore solutions beyond useful, usable, efficient and effective towards universal (inclusive), sustainable, socially responsible, emotionally desirable and meaningful. Consequently, the technical and behavioral knowledge that is expected from a designer has significantly increased. The variety of the people that need to collaborate has multiplied. Designers are less independent and the design profession is more inter-dependent than ever before.

In order to conceptualize and appropriate innovative ideas into our lives, designers first need to work through those ideas. An ideation process is just that. Ideation starts with diverging by generating and elaborating a number of options (ideas) (Buxton 2007; Osterwalder 2010), followed by converging and synthesizing those options into decisions. The outcome is concepts to follow through. To live this process properly designers need to be able to appropriately discuss ideas. To discuss, they need a common ground to communicate and collaborate with each other. Even a one-man-design job requires a self-reflective process where a similar discussion occurs in the form of a self-conversation by externalizing thoughts through sketching (Buxton 2007; Cross 2011; Lawson 2005).

Discussing experiences is quite different from discussing products and interactions. User experiences are subjective, context-dependent and dynamic over time (Moggridge 2006) and the usual operating principles that work for products do not allow to bring the emotional, contextual and temporal aspects of an experience into discussion (Buxton 2007). When envisioning a tangible product, you can always make a two dimensional (2D) sketch to see the reflection of the idea you had in your mind on paper. It helps you to understand a little more about what you imagined. You can play with that idea just using pen and paper. Even then you can only envision a certain level of complexity and if you are convinced of the potentials of your idea then you need to advance to a tangible model that enables you to envision by exploring your options in the third dimension (3D). This routine becomes even more complicated when the challenge shifts from product to experience.

Allow us to elaborate with the story about The Mechanic and the Heart Surgeon. A renowned heart surgeon brings his car to the garage. To pass time he starts watching the mechanic while he removes a cylinder head from the engine. The mechanic notices him and teases the doctor saying: “Well Doc, check this out. I just opened up the heart of your car, found the problem, fixed it, closed it up and it works like new. So, tell me, how come you earn so much more than me while we are basically doing the same work?” The cardiologist glanced at the mechanic, leaned over smiling and said: “Try doing the same work with the engine running”.

In a designerly fashion, what is expected of an experience designer is similar to what is expected of the heart surgeon in the story. He needs to design for an ongoing sequence of events and be aware of the implications that constant change brings. Designing an experience means generating, developing and testing ideas on the fourth dimension (4D); time. The challenge exceeds the physical product and he needs to consider the time factor, as this is an essential aspect of experiences. How can he discuss and weigh his options about an event that has not occurred yet? How does he assess an emotional experience that belongs to a future context long before it becomes an established component of his design?

Designing-for-experiences means designing for the state of changing. Moggridge, described this situation as designing verbs instead of nouns (Brown 2009). Irwin seconds this thought by pointing at the shift of articulation from designing as an entity to designing as a behavior (Baskinger 2012). We understand that designing verbs or behaviors requires different principles, knowledge, skill-set and tools than designing nouns or entities.

In the next section, we first provide an overview of contemporary conceptual design methods and tools that are currently in use with designers. Subsequently, we introduce storycraft as a means to incorporate experience into the designer’s creative thinking, and propose a method and a framework to achieve this goal.

Contemporary Conceptual Design Process

As we mentioned in the first section, design work starts by exploring new ideas. Implementation of those ideas (design actions taking place, supported by design skills) is guided by decisions made in the conceptual design process. Therefore, the best opportunity to establish an experiential influence over the whole project lies in the conceptual design stage. However, as design professionals find out repeatedly, this is easier said than done. To explain the complications that an experience focus brings to the envisioning process, we first need to introduce the contemporary state of the art.

Conceptual Design

Conceptual design is the act of sketching, outlining, and drafting key characteristics of a product, interaction, service or experience early on in the design process, with the goal of initiating creative reflection and planning subsequent phases (Atasoy and Martens 2011). In order to test, evaluate and refine ideas, designers externalize and represent ideas into tangibles (Cross 2011). It can be a sketch on a piece of paper or a bundle of sticky notes. It is an essential step in any creative process where the mind(s) needs to keep track of the thought process and reflect on the options under consideration. Sketching also functions as an external memory for the designer and supports the creative process by reducing the mental effort on the working memory (Bilda and Gero 2007).

Often the conceptual design process starts with a brief, which is an initial summary of project objectives. The team is likely to adapt the brief as the project develops. It is hence an open-ended document that helps the team to creatively explore without losing perspective.

The first step is collecting information where the team explores the project background with the objective of revealing opportunities. The aim is to cultivate insight from the project domain, relevant user and context information. A quick approach is to consult secondary information sources (websites, wikis, books, etc.) but the team may also decide to collect primary user information through interviews, direct observation or self-documentation (such as diaries, probes, inquiries, etc.). Interpreting the collected information into a shared understanding can help to envision present and future user behaviors. Subsequently, the ‘concepting’ starts with the team collaboratively processing content and creating alternative approaches that lead into propositions for new concepts. The outcome is shared with outside stakeholders by presenting illustrations of the new concepts such as product sketches, system flow charts, storyboards of user scenarios, etc. Next, the selected concepts are compared mutually and with competing systems in the market by reviewing their potential with respect to the project objectives. Depending on the scale of the project, qualitative research methods might be used, either without user involvement, such as team evaluation, expert evaluation, heuristic evaluation, or with user involvement, such as focus groups, contextual inquiry, cultural probes and low-fidelity prototype testing. Finally a decision is made and the chosen concept starts its long journey towards the market (Keinonen and Takala 2006).

Contemporary Conceptual Design Tools

The conceptual design process has incorporated diverse tools to support the complete range of design activities. Their common function is to structure conversations and to assist design teams to understand and empathize with people in their pursuit of envisioning meaningful products (Marin and Hanington 2012) and experiences. For the purpose of this chapter, we focus on a selected group of tools that are widely used in concept generation to generate and illustrate concepts. The common purpose of these tools is to enable designers to explore and discuss the variety of propositions that they generate. These tools complement each other and their goal is to promote effective communication between team members by providing an opportunity for explicit reflection.

Mind Mapping, Affinity Diagramming and User Journey Mapping are prominent examples of tools that support the collaborative thinking process by visually mapping out the discussion topics. Mapping out the thinking process encourages designers to collaboratively explore and recognize new patterns by revisiting and reorganizing fragments of information and elaborating new ideas.

Mind Mapping is used to visually organize data by representing relations between dynamic elements of a topic or a problem (Marin and Hanington 2012). It helps to make connections for providing a general sense of a whole (Brown 2009). Affinity Diagramming is used to find common aspects between ideas and to meaningfully cluster them according to identified themes (Bonacorsi 2008; IDEO 2003). It helps the team to constantly ground their decisions on the collected data (Marin and Hanington 2012). User (or Customer) Journey Mapping aims to visually represent the steps taken by the user in order to envision key events and interactions during the process (Hagen and Gilmore 2009). It helps the team to exclusively focus on and evaluate key moments of an experience (Marin and Hanington 2012) (See Fig. 1).

Fig. 1

Mind mapping, affinity diagramming and user journey mapping

Personas condense actual user information into the general characteristics of a user group and represent it in the form of the profile of an (fictional) individual. Personas help the design team to align their design intentions with the people for whom they are designing and to ground their decisions on actual user data (Long 2009).

Scenarios are believable narratives about imaginary courses of actions while people engage with a product or service. They are usually written for a future setting from a Persona’s perspective to describe the goals, behaviors and experiences of users in a specific context to test the design assumptions (Cooper 2004; Marin and Hanington 2012).

A Poster (Gray et al. 2010) is a fictional advertisement of a product and/or service while it is still being designed. It is a visual representation aimed at elaborating the design vision and “understanding the link between the service idea and the existing reality” (Norman 2009). Next Year’s Headlines a.k.a Cover Story (Gray et al. 2010) have a similar goal as the Poster but focus more on the possible impact of a design idea on society in an imagined future (IDEO 2003). Designers use these tools to project themselves into the future and to ideate around future scenarios in an imaginary but believable context (IDEO 2003) (See Fig. 2).

Fig. .2

Persona, scenarios, poster and next year’s headlines

Mood boards (a.k.a. Image boards or Collages) are visual compositions made out of a collection of pictures and materials to communicate impressions in order to share values between collaborators that are difficult to express in words (Gray et al. 2010; Lucero 2009; Tassi 2010) (See Fig. 3). While a picture of a calm lake in the middle of a pine forest in the fall could infer ‘serenity’, a ripe green apple with a drop of morning rime could represent ‘freshness’ and ‘health’. Mood boards involve imagery with a focus on the impressions rather than interpretations. They aim to create a unified perception of inspirational materials in order to guide the team towards a shared direction. Discussing such abstract impressions in the early stages of the design process helps the team to build a shared understanding about values on which decisions are made.

Fig. 3

Mood board, Storyboard

Storytelling, Storyboard, and A day in the Life are used to ground the conceptualization process by attaching design ideas to their experientor in a real context. These tools help designers to establish an empathy with users on a level where designers can participate in the feelings and ideas of their target user group (Fritsch et al. 2009). Storytelling is an articulation tool that connects ideas within a flexible context and stimulates discussion towards a unified understanding on a level where all stakeholders can contribute regardless of their background (Chastain 2009; Rees 2010). ‘Storytelling’ is a notoriously generic term and used in various disciplines (including design) for various purposes. This causes a cacophony around the term and we will try to address this issue in the next section to avoid any misunderstandings.

Storyboarding (a.k.a Continuity Board) is a visual story-planning tool that was originally used in the pre-production of movies to plan and communicate scenes between members of a film crew (director, cinematographer, cameraman, sound designer, etc.). It is telling a story through a series of pictures (Glebas 2008). In the case of a design process, storyboards help design teams to capture key events of an experience by illustrating and viewing them in a sequential order (See Fig. 3).

A day in the Life is a tool to imagine the potential experience of a user in the course of a day. Focusing on routine actions during the day helps disclosing unnoticed details that might reveal essential issues (IDEO 2003) (See Fig. 4).

Fig. 4

Body storming, a day in life

Role Playing and Body Storming assist in igniting fresh inspiration through improvisation and physical involvement. Role Playing is used as a tool in which collaborators act out potential users within a real or imagined context. Assigning roles to the team members emphasizes empathy with different users and strengthens the perception of context, hence providing insight into the impact of circumstances on the user experience (IDEO 2010). Body Storming is a type of role-playing where the focus is on the physical interaction with the objects and the environment. Props are generally involved in the process as product placeholders and this gives the team the opportunity to observe potential responses and behaviors in an imaginary context (Tassi 2010). Improvisation tools provide valuable opportunities for designers to envision the embodied qualities of an experience (See Fig. 4).

The mentioned methods and tools all support designers in the conceptual design process to collaboratively envision hypothetical situations where imagined users act in an imagined context. The task of the design team is to pull new and yet believable concepts out of this process and describe them in a convincing way to influence the overall design process. All these tools represent a clear demand for organizing the creative thinking process in order to promote collaborative creativity through explicit communication. In the hands of experienced design teams, these tools can significantly improve the process of conceptualizing for tangible products and the interactions they provide.

Envisioning experiences in their temporality on the other hand requires the ability to communicate and reflect on the dynamic change of the emotional experience over time according to the design intentions and none of the above methods looks like it is adequately providing just that. We will elaborate further on this topic in the following section.

Storycraft

Although Storytelling is the popular term when there is a need to address story-related issues in the design domain, it does not fully support the meaning that we are trying to infer within our work. Storytelling takes many forms. The traditional storytelling forms are oral storycraft, written storycraft and in the last century; film storycraft (McClean 2007). Firstly, we are interested in film storycraft over its predecessors for several reasons, which we will explain in the next section. Secondly, our work is more about the act of “crafting” instead of “telling”. Therefore, we are going to use the term storycraft when we need to emphasize our focus and intentions.

Why Storycraft?

The similarity between the key properties of a story and an experience is evident. They are both made up of people, places and objects and they both emerge from the interrelations of all three over time (Buxton 2007). This implies that both are subjective, context-dependent and dynamic in nature. They share a sequential structure with a beginning, middle and end that can be crafted and influenced through design. However, most importantly, both stories and experiences evoke and influence the emotions of their experientors.

Our interest in storycraft is motivated by its proven ability to create emotionally satisfying and meaningful experiences (Glebas 2008). Storycraft has a well-established tradition, and makes use of an appropriate set of tools to influence the experiences of its consumers (audiences). Certain branches, such as film storycraft, also have extensive expertise in managing the complex orchestration of multidisciplinary production teams towards a common purpose. We look at the communication and orchestrations required in the conceptual stage of designing for user experiences and investigate if it can be improved by adopting tools used in film storycraft. Glebas suggests that we organize our experiences in the form of a story and we use stories to structurally communicate our experiences to others (Glebas 2008).

Although the film and design domains produce different kinds of outputs, the early design process where they create their fictional/conceptual backgrounds share common tools such as Scenarios, Storyboards, Role Playing and Personas to envision future experiences. The reason for this similarity between disciplines comes from a common need for a quick, inexpensive and flexible way to explore and communicate ideas between collaborators.

Despite their shared benefits, the filming process seems to be more advanced in its explicit awareness and clearly defined strategies to engage the audience emotionally (Chastain 2009). Filmmakers tell stories in a professional way. Stories have the power of engaging people into an experience, and screenwriters (a.k.a. scriptwriters or scenarists) are experts at crafting story structures and plots based on story ideas. It is therefore relevant to try and understand the structural strategies behind this craft that deliberately aims at influencing the emotions of its audience.

Story Structures

A story structure is the structural framework that determines the order and fashion in which a story is presented. A plot is the storyteller’s pick of events and their arrangement in time from numerous interrelated possibilities of how things could unfold (McKee 2010). They are used as a strategic guide to pull the audience emotionally and hold their attention (Inchauste 2010). Explicit knowledge and use of story structures is essential for a successful transition from script to scenes (visual planning or storyboarding).

There are prominent studies that suggest empirical evidence for a common structure that is at work in the type of stories that transcend through time, despite cultural and geographical differences: Propp’s Morphology of the Folktale analyzes numerous Russian folk/fairy tales that indicate the same structure with 31 commonly occurring themes. He called them ‘story functions’ – classifiable actions that characters can take that occur in a consistent order (Hammond Sean 2011). Campbell studied myths, fables, folktales and stories across cultures and various periods in history. He pointed out that there is a common structure to the journey of the hero in all the great stories that have transcended throughout history (Duarte 2010) (See Fig. 5).

Fig. 5

A visual representation of the structure of a hero’s journey

This basic formula that he called “Hero’s Journey” suggests a process where the story can be summarized as follows; first the hero is introduced, then he is called to an adventure. Though the hero resists the call at first, he is encouraged to take the challenge by the mentor with whom he crosses a threshold from the ordinary world to the new world of the quest. Then the hero is tested and events take a climax where the hero is forced to take an ordeal. He collects the reward of the ordeal that also transforms him. Finally, he starts the journey back home, enriched by the experience (See Fig. 5). Gilgamesh, Beowulf, Odyssey, Hobbit, Star Wars, Matrix are few examples sharing the same basic formula (Inchauste 2010; Schlesinger 2010).

Evidently, the history of story structures started long before screenwriting. In Poetics, Aristotle observed and analyzed the connection between storytelling techniques and emotional experiences. His drama theory inquiries into the capacity of the storytelling technique to evoke certain emotional experiences in the audience (Hiltunen 2002). The Aristotelian system maps the structure of actions as a unified plot where beginning, middle and end describe the order of actions. Hiltunen interpreted Aristotle’s approach as a strategy of understanding the mechanics of creating emotional experience through storytelling and suggests that it may lead to the ability of predicting probable success of stories beforehand (Hiltunen 2002). The Aristotelian plot has been expanded by Freytag into a five-act structure that mostly applies to ancient Greek and Shakespearean drama (Freytag 1900).

In Freytag’s Curve, Exposition provides the context by introducing the hero and the villain along with the conflict at hand. Rising Action is the stage where the tension increases through complications and uncertainties towards an identified goal. Climax (or Crisis) is the point in time at which tension and uncertainty in the story peaks while pulling up the audience engagement to the maximum. Falling Action is the point where the conflict unravels in favor of the hero over the villain. Dénouement (or Resolution) is the conclusion where the suspense ends and the complications are resolved (Wheeler 2004) (See Fig. 6).

Fig. 6

Freytag’s (five act structure) curve

A more contemporary story structure is proposed in Field’s Paradigm (Duarte 2010). It is more commonly known as the three-act structure and is a simplified and compressed version of Freytag’s five-act structure.

According to Field, what moves a beginning to the middle and the middle to an end are called plot points which are definitive moments where an event happens that changes the direction of the story (Duarte 2010). Act One introduces the reader to the setting, the characters, and the conflict and establishes relationship between them along with the hero’s unfulfilled desire (Duarte 2010; Quesenbery and Brooks 2010). Act Two develops through a series of complications where characters encounter obstacles that keep them from achieving their goal (Duarte 2010). Though each of these crises are temporarily resolved, the story leads inevitably to an ultimate crisis, which is the global climax (Quesenbery and Brooks 2010). Resolution ties together the loose ends of the story, offers a solution rather than an end and allows the reader to see the outcome of the main character’s decision or action at the time of the climax (Quesenbery and Brooks 2010) (See Fig. 7).

Fig. 7

Three act structure

Freeman, interpreted the three-act structure as an energy curve, called “Aristotle’s Plot Curve” (Sparknotes 2011), that visually communicates the relationship between time (horizontally) and dramatic intensity (vertically) (See Fig. 8). Glebas took a step further and interpreted dramatic intensity as emotional involvement. In his interpretation, the vertical axis depicts how much the audience is involved or “lost” in the story (Glebas 2008).

Fig. 8

Aristotle’s plot curve

Quesenbery and Brooks suggests that a well-structured story with appropriate plot points can provide a storyline with qualities such as coverage, fit, coherence, plausibility, uniqueness and audience imagination (Quesenbery and Brooks 2010). Coverage means that the story addresses all the necessary facts. Coherence and plausibility assure that the story makes sense (i.e., doesn’t create confusion). A story that fits well with the facts of the context feels in place. Uniqueness is required to intrigue the audience (i.e., avoids boredom). A good story always leaves room for the audience to fill in-between the lines, i.e., to imagine details (Quesenbery and Brooks 2010).

The efforts around analyzing stories that ‘work’ originate from the common need to distill operating principles for good storytelling. However, it is important to realize that the strategies above do not provide a formula or recipe that guarantees success but can only serve as guidelines to think in a structured way.

We provided an overview of the prominent crafting tools that support a storyteller’s creative process. From a User Experience Design point of view the identified patterns of story structures may inspire designers in several ways: (1) they provide an explicit representation of the strategy behind creating emotionally satisfying and meaningful experiences, and can help to raise common awareness, (2) they reveal that storytelling is not entirely an intuitive technique; and that usage of pre-defined guides to support the process is common practice, (3) the change in pattern of the intended user response, when visually represented, can assist the storyteller in the orchestration and communication of the story.

Storyboarding in Film and Design

Another aspect of crafting stories is visual planning, or storyboarding, where storytellers interpret written scripts into a visual sequence of actions. Storyboarding has its origin in Disney’s animation studios out of a need to track and organize the massive amount of drawings in a feature-length animation. It was then and still is a tool that enables collaborators to view the sequence of frames in order to reflect, discuss and detect problems and make changes quickly and easily (Glebas 2008). Storyboarding starts with a script that is “a verbal plan for a story” (Glebas 2008) or loose treatment that is a sketch of a script. From this, the visual artist builds the actual look of the world in the movie under the supervision of the art director and production designer (Glebas 2008).

In live action, Alfred Hitchcock was one of the first who implemented storyboarding in order to project and assure the seamless flow between shots (continuity) beforehand (Glebas 2008). Storyboards provide visual assistance to the director and feeds information to the planning phase with respect to cinematography, camera angles, choreography and the positioning of actors (blocking) and props. It is a cheap way of exploring and experimenting options before shooting live action (See Fig. 9) (Glebas 2008). It also assists the producer in searching for financers, casting and locations (Lelie 2005).

Fig. 9

An example of how a storyboard for film looks like

Storyboards became especially important with the development of special effects in live action movies where Computer Generated Images (CGI) need to be combined with real footage (Glebas 2008). Peter Jackson is one of the contemporary directors who utilize storyboarding extensively in his process, which he refers to as “version zero of the movie” (Botes 2003). During the filming of The Lords of the Rings Trilogy, in addition to storyboarding firsthand he commissioned a professional storyboard artist to redraw his own sketches. He also used Story Reels, which are a version of storyboards with voice-over, sound and music (Botes 2003). Story Reels are not only useful to help detect and solve story problems but they also provide an emotional road map for the film (Glebas 2008).

Storyboarding in the design domain is used to help designers understand and communicate the interaction between a user and product/service in context and over time (See Fig. 10) (Lelie 2005). Designers are visual thinkers. Representing an idea in the form of a story is a challenging but lucrative task. It forces designers to consider the context of use in the temporality of action. The challenges that target users might face gain believable circumstances even though they are hypothetical. The reader of a storyboard can empathize with the design issue at hand and can reflect upon it regardless of his/her background or discipline (Lelie 2005).

Fig. 10

An example of how a storyboard for design looks like

Several of the visual planning and communication strategies used in the early moviemaking process are already being adopted partially into the design practice. We want to take this interest further and focus more explicitly on the cross-section of user experience design and film storycraft. We believe that understanding and assimilating the principles of storycraft will enable designers to “aim for the heart by working at a structural level” (Glebas 2008). In order to test this proposition, we have adopted a research through design approach in which we iteratively design and develop a method that incorporates many of the key storytelling techniques mentioned above, and subsequently apply this tool in the user experience design process in order to establish opportunities, problems, etc.

Storyply

Designing for experiences requires design teams to empathize with the people for whom they design on an emotional level. The challenge is to envision not only the ‘dynamic qualities of experiences’ but also ‘the constantly changing emotional response to those changes’. This calls for an approach that allows exploring and discussing on the fourth dimension starting from the very beginning of a project.

We argue that this could be achieved by designers expanding their creative process and cultivating visual story-crafting skills. Especially film storycraft provides unequaled strategic guidance in addressing emotional change over time. We try to harvest this potential and integrate it in the designer’s creative process using a conceptual design method called Storyply, accompanied by a toolkit and implemented through a workshop.

In this section we start by describing the research process we followed and then introduce the method, toolkit and workshop we designed, tested and developed through successive case studies. We conclude with a reflection on what was learned along the way.

Research Approach

Our research approach is to generate knowledge to enhance design practices by linking the theory to practice through investigating the processes and tools of thinking and making in design projects (Marin and Hanington 2012). This is frequently referred to as a Research Through Design Approach (Archer 1995; Marin and Hanington 2012). It involves a creative and critically reflective process in which literature survey and case studies are used to discover insights that are subsequently incorporated into the (next version of a) design of a conceptual design method.

We previously mentioned that storytelling takes many forms such as oral, written and film storycraft. We focused on film storycraft as our role model for the qualities it provides for visual communication and orchestration of a collaboratively creative process. We also pointed out the limitations of contemporary tools that support creative thinking when it comes to envisioning experiences. To overcome these limitations we seek guidance in storycraft as a means to assimilate experience into designer’s creative thinking. Storycraft is the skilled practice of generating/building stories. Experience -driven design requires design teams to embrace storycrafting skills in order to ideate comfortably in the fourth dimension: time.

We built a method called Storyply (formerly known as Storify (Atasoy and Martens 2011)) that tries to merge the skilled practice of generating stories with the skilled practice of design thinking. Following a year of literature studies (backed by 15 years of professional design consultancy experience) we started designing and testing the framework through workshops that we conducted with BA, MSc and PhD students, professional design teams, professional storytellers, R&D and Innovation teams at firms from various industries in Europe (See Fig. 11).

Fig. 11

Snapshots from several storyply workshops conducted with students, trainees and professionals

Throughout the process we were guided by the following research questions:

• Does incorporating storycraft within conceptual design provide an improvement on the process of designing for experiences?

• Does Storyply help designers to focus on and prioritize the experiential aspects of a design project?

• Does Storyply help designers to address the subjective, context-dependent and temporal nature of experiences?

• Does Storyply help designers to envision user experiences in a better (more profound) way?

• Does Storyply help to envision – better (more profound) user experiences?

Addressing these questions required a relevant and realistic project context were the value that is generated by the user experience focus can clearly manifest itself (in order to increase external validity). Moreover, to observe real design teams trying the method we needed a coherent framework and appropriate setting to apply, observe and document. For communication purposes we first built a dummy case project scenario called Re-designing the Waking-up Experience and presented everything designer (creative workshop) style; on a (white) board using a collage of drawings, sticky paper notes and printed materials (See Fig. 12). The dummy scenario raised an experience design challenge where we could employ the proposed method, try out and prepare for the real project challenges. This presentation style complemented our explanation and provided not only the experts to follow a visual track of how process flows but also allowed them to comment on our thinking and decision making process. We utilize the same “Re-designing Waking-up Experience” case also in this chapter to explain the method in the following section.

Fig. 12

Mock-up presenting the dummy case project scenario called Re-designing the waking-up experience in which a renowned alarm clock producer is rapidly losing its customers to personal mobile devices. The scenario presents this imaginary company as desperate and open to revolutionary ideas. They hire a team of designers (the workshop participants) to come up with an innovative idea/solution that will change the game in their favor. The creative brief interprets the goal as generating new ideas and concepts by focusing on the experience such as sleeping, waking up, the need for an alarm, etc. It encourages prioritizing experience over ‘product’

Observing the success of communication in these sessions encouraged us to follow a similar format to test our initial design. We built a ‘meaningful workspace’ (Gray et al. 2010) out of pre-made templates that served as the canvas for the participating team members to post artifacts/idea containers (Osterwalder 2010) (print outs, sticky notes) and to sketch and write on. Our goal was to allow the design team to quickly and easily explore relationships between the artifacts they generated while keeping a visual track of their progress. Artifacts/idea containers acted as a carrier of meaning that makes the processed information tangible, explicit, portable and persistent (Gray et al. 2010; Osterwalder 2010). The combination of our framework within the specified workspace allowed a mixture of conceptual design tools to be utilized during the workshop such as Brainstorming, Scenarios, Persona generation, Post Up and Storyboarding to support the creative process. In fact, these early mock-ups laid the foundations of the Storyply Toolkit that we use currently for academic and professional purposes in practice. The details of the method, process and toolkit are explained in the following section.

Storyply Method, Toolkit and Workshop

The Storyply Method combines ‘conceptual design’ and ‘story planning techniques’ to help the design team visualize the solutions for themselves as well as for the potential audience of the project such as users, clients and other stakeholders. The method suggests two main layers: Backstage and Onstage. Each stage is guided by ready-made templates and instructions to work with the provided template. The templates divide the total effort into more manageable sub-activities, next to offering support for the sub-activities themselves (Fig. 13).

Fig. 13

Sub-activities in the Storyply method

Insploration is a pre-workshop phase that suggests a preliminary effort where team members individually prepare for the conceptual design process by exploring the sources of inspirations that will fuel the creative process. Design is a creative endeavor and designers are explorers of inspiration: Ins-plorers. Insploration works as a conscious and systematic act of searching for and capturing stimulants that may inspire new ideas (Atasoy and Martens 2011). The project brief sets the focus of interest which influences the creative minds’ selective perception to start highlighting relevant and potentially inspirational materials according to the subject matter. Designers are visual-thinkers so the majority of insplorational material is likely to consist of visual collections (Fig. 14) (Keller 2007).

Fig. 14

In order to make the insploration process more accessible for the whole team, participants are asked to prepare six images (two images of people, two images of places and two images of objects) of their own choice that belong to the project context according to their perspective before the session. In the beginning of each session, these images are added to a collection of images that is called “insplorers deck” that consists of 90 (5x5 cm) readymade generic images to support the creative process

Storyply provides a toolkit with clear instructions to assist the creative process in which participants can apply the method by simply following the instructions on the foreground while they actually implement a combination of story-thinking and design-thinking principles in the background.

Backstage is the first layer in which the collaborative process starts at the workspace. The first template of this section is the Interpret Project Goals which guides the team to first self-reflect and then to share and discuss their understanding of the project brief at hand. The format and instructions are designed to encourage the participants to briefly look at the initial project brief from an experience-focused perspective (See Fig. 15).

Fig. 15

Storyply workspace and toolkit. The toolkit consists of nine various A0-sized paper templates with instructions, insplorers deck: 90 pieces of 5x5 cm pictures (30 people, 30 places and 30 objects), UX guides: a compact collection of practical and relevant information from user experience research, sticky papers and markers for each member to write and draw. Moreover, the workshop experience requires a workspace with a wall to hang eight of the templates side by side and a desk to lay one template on and gather around while using other components such as insplorers deck, stick papers, sharpies, etc. throughout the session. The storyply toolkit will be available at www.Storyply.com soon

Our observations showed that Template1 serves the following purposes; (1) The chance to write down a personal interpretation of the challenge at hand is especially valuable not-only for self-reflection but also to detect the diversity of perspectives and to start building a shared vision at the very beginning. (2) The wording of the instructions sets a tone that agrees with the experiential focus from the start. (3) The opportunity to individually title the project not only reinforces participant’s ownership of the task but also sometimes helps revealing their priorities (Fig. 16).

Fig. 16

A section of Template1: interpret project goals for re-designing the waking-up experience project

The second template that guides the backstage is called Categorize Story Elements. Here the design team organizes and interprets the collected materials to assist them in the design process. The template is laid flat on a desk and each team member categorizes their inspirational collections individually under three themes; People, Places and Objects.

The themes are represented by three intersecting Venn diagrams to be filled with images according to their relevance (See Fig. 17). Then, as a group, the elements placed on the canvas are sorted for potential building blocks of a context of experience. We call this template Categorize Story Elements since it provides a pool of potential elements for the participants to choose from in later stages. During our studies, we observed that Template2 serves the following purposes; (1) it helps individual designers to organize their visual collections and focus on the project space. (2) Sorting collections according to people, places and objects appropriates materials to be used as story elements. (3) Participants see each other’s collections and get inspired by each other while they try to pick appropriate materials together, which also encourages discussion. (4) Filling the canvas serves as a good warming-up exercise for the team members to familiarize themselves with the process and each other.

Fig. 17

A section of Template2: categorize story elements

The third template of this section is Cast Characters that allows the team to build characters that will be actors in the user experience that is aimed for. Similar to a Persona creation, the team is expected to envision believable archetypes to represent a target group of potential users. Step 1 is giving a face, a name, age, occupation and location to a main character then, giving a face and a name to the most prominent supporting characters who have a direct interaction with the main character and/ or the experience. One important difference of Casting from a Persona is that the main interest is the conflict that drives the character in a story, rather than their consuming behaviors and/or decision-making strategies. Hence, Step 3 and 4 encourage participants to think about the motivations and potential points of tension in a characters life, which helps to identify the conflict that could provide the team with an understanding of the character on an emotional level, which they can in turn build the experience upon.

We learned from our observations that Template3 serves the following purposes; (1) since the process resembles casting a main-character for a film story, it is familiar to every participant regardless of their background and this familiarity adds confidence to their actions. It is especially important at this early stage of the process to obtain contributions from all participants, even those who claim an allegedly non-creative background. (2) Casting provides a means of identification as in the film. Identification cultivates emotional attachment with the experience that is the fundamental goal of the process. (3) Conflict is a professional expression in storycrafting with rather unfamiliar vocational interpretations for a non-story crafter. The most meaningful instances often arise when one can imagine a conflict from personal experience. Some sort of guidance tends to be required at this stage, and is provided in the Storyply Method by two quick questions about Motivations (i.e., Drivers) and Points of Tension (i.e., vulnerabilities) (See Fig. 18).

Fig. 18

A section of Template3: cast characters; Step 3 and step 4

The fourth template is called Contextualize Experience. It helps the team to build a visual representation of the space where the experience takes place. A set of guiding questions about the spatial properties of the experience supports their imagination about touch-points in context (See Fig. 19). The task is to imagine the space where the experience could take place as vividly as possible and then sketch a very simple visual representation of that scene as if you are a fly on the ceiling or a bird flying over the scene.

Fig. 19

A compacted version of Template4: contextualize experience

We learned from our observations that Template4 serves the following purposes: (1) Simple but concrete questions prompt participants’ imagination to a richer setting than they would usually think without guidance. (2) The visual representation of the setting establishes a mutual agreement about the spatial qualities of the setting and grounds the discussion in a more believable context that leads to concrete suggestions.

Onstage is the second layer where the design team generates and assesses the content and creates alternative approaches that can lead into propositions for new concepts. The outcome is one or more concepts that can subsequently be assessed with users and other stakeholders. The process is very similar to storyboarding, knowing that the biggest challenge of storyboarding, even for the experienced storytellers, is where and how to start. Story-craft becomes an essential tool to assist them in this stage. The procedure guides and facilitates the team to build five key frames for each step that encompasses one event with a beginning, middle and an end.

The first step of the Onstage section is the fifth template of the overall framework and initiates the visual story-building process itself. It is called Identify Conflict and it is the most crucial of the following steps in which the participants are asked to imagine the story space (See Fig. 20). We learned from our observations that Template5 serves the following purposes: (1) Introduction of the quest for conflict feels utterly refreshing and mind opening even to the most seasoned designers since it clearly promotes a smooth transition from design thinking to story-thinking. (2) Each previous step proves to be indispensable at supporting this first step into the story space.

Fig. 20

A compacted version of Template5: identify conflict. The event is assessed frame by frame over time by moving sticky paper frames up and down with respect to the chosen value on the right. Relatedness/belongingness is picked out of UX guides, as the emotional need to appraise the experience in this instant. It is described by Hassenzahl et al. (2010) as “the feeling that you have regular intimate contact with people who care about you rather than feeling lonely and uncared for”

The sixth portion is Reveal Consequences and follows the same procedure as the previous stage but this time the framework guides the team to envision the impact of the conflict on the character and thus the consequences on the experience (See Fig. 21). We learned from our observations that Template6 serves the following purposes: (1) pushing participants into envisioning further into the consequences of their imagined experience, encouraging them to bring daring and rich insights from their own personal life into the story. (2) The severity of consequences fuels empathy with the main character and thus the reality and believability of the situation.

Fig. 21

A compacted version of Template6: reveal consequences

The seventh portion is called Propose Alternative and this time the framework guides the team to make their own proposal using the conflict and its consequences that they identified in previous stages (See Fig. 22). Once again, they are expected to use the same five key frame structure to build their proposal and evaluate the situation with the same values.

Fig. 22

A compacted version of Template7: propose alternative

We learned from our observations that Template7 serves the following purposes: (1) feeling the pressure of the consequences from the previous stage adds an extra sense of responsibility towards the opportunity to propose the experience that they would rather like to have. (2) Participants start to utilize the dramatic qualities in their story more confidently than in previous steps.

Finally, it is time to see the impact of your contribution and Resolve Improvement is the template just for that. For the last time the team creates five frames that illustrate how the events could unfold with their intervention to the situation at hand. Additionally they still have the scale of emotional needs that they can reflect on and see how the envisioned experience could be better aligned with those values over time (See Fig. 23).

Fig. 23

A compacted version of Template8: resolve improvement

We learned from our observations that Template8 serves the following purposes: (1) The resolution in the story provides a proper closure for the process (2) participants starts to see the further potentials of the method in the future.

The very last step is to capture initial ideas as a tangible outcome of the process. That is called Draft Concepts and its purpose is to scribble quick and dirty visual reminders of the initial ideas and directions that the project may take in the future (See Fig. 24).

Fig. 24

A compacted version of Template9: draft concepts

We learned from our observations that Template9 serves the following purposes: (1) it provides the opportunity for the team to take note of the small ideas that they had during the process but did not have time to focus on in the heat of discussion. (2) The small concept sketches work as good reminders of the intensive process and earns a whole new level of respect for the small sketch that previously looked easy to achieve. Hence, the real outcome of the process is the whole template filled with content, which functions as a visual map of the envisioning process and the discussions initiated by the framework.

Reflections on Designing Storyply

We tested the Storyply Method in 15 workshops in Italy, Sweden, Turkey and the Netherlands with 150 participants (59 Professionals and 81Students/Trainees) from diverse backgrounds such as: designers (industrial, product, visual, interaction, service, strategy, software, hardware, UX.), researchers, engineers, managers, film makers, R&D specialists and CEO’s. Throughout these studies we focused our attention on the aspects that coincided with our expectations, identifying the general expectations that didn’t work out as expected and identifying unexpected observations. Each session provided feedback for the next iteration and the framework iteratively matured while we collected, analyzed and synthesized findings into the overall design.

Some significant aspects that coincide with our overall expectations were: (1) the guiding principles of storycraft extended the boundaries of explorative sketching towards story thinking. The framework allowed the participants – with no specialized knowledge in storycraft – to conceptualize applying principles of storycraft. Breaking down the conceptual design process into clearly visible, meaningful partitions where they can freely navigate and track their progress helped the participants to organize and share their thoughts clearly and confidently. (2) The narrative competence (Pink 2005) liberated creativity from the bondage of “must-have”. Story context provided a safe zone where the participants could take a vacation from the boundaries of technical rationality. The fewer participants worry about manufacturing and/or marketing, the more creative they get and started discussing experiences through stories rather than features and functions. (3) Non-designers and designers fancied and valued different qualities of the Storyply Method. Designers appreciated the framework where they can combine a competence they already have (conceptual design) with a competence they would like to have (storycraft) in a practical and visual style. Meanwhile, non-designers (engineers, managers, researchers, etc.) were more interested in the qualities that promote cross-disciplinary communication, which provide grounds to discuss values and helps the decision making process.

Some significant aspects where our general expectations didn’t work out as expected: (4) the intensive one day workshop format had certain shortcomings. Ideally, the participants are supposed to have sufficient time to process and digest the user research data before starting the session. This requires a longer time frame than a one-day workshop where the participants learn and apply the method simultaneously. On certain occasions, the workshop became an overwhelming experience and we observed that most of the participants performed less energetically in the afternoon sessions. In the light of this observation, we spread the workshop across two days when we can and observed significant improvement on participant’s energy levels and ideation performance. Ideally, the framework is designed to accompany the conceptual design process for as long as the project goes. (5) We also witnessed that the participation of an experienced facilitator who understands story-thinking and design-thinking principles to the process made a much bigger difference than we initially expected.

Some significant unexpected observations were the following: (6) it was surprising to see that the skepticism on non-designers wore off faster than their designer teammates when it came to think with stories. (7) the Storyply Method was appreciated eagerly by participants who are more business-minded and/or who are in a decision maker role. They were overly enthusiastic about being able to express what they mean and discuss values with ‘creatives’ on equal grounds.

Conclusion

In this chapter, we laid out the groundwork for an approach where user experience design is guided by storycraft. We started by pointing at the change of focus from objects to experiences in the design domain, and explained the background and implications of this shift on how designers operate. We placed the conceptual design phase at the center of our attention and provided an overview of how designers currently cope with the conceptual design process. We introduced storycraft, as a means to incorporate experience into the designer’s creative thinking and briefly introduced the practical outcome of our evidencing process as a framework to support our claims. The first goal of this chapter is to provide readers with the motivational background behind introducing storycraft into conceptual design and introduce relevant literature regarding our approach to the subject matter. The second goal is to back our claims with evidence gathered through extensive testing in the field with real users and projects.

Good design thrives where creativity can be channeled through skilled practice. Our studies show that the real-time visual mapping of the thinking process under the guidance of story crafting principles has several benefits. First, embedding narrative competence into visual thinking drives the discussion towards experiences. Consequently, the ideas that spin out of such discussions are more likely to serve the purpose of designing for user experiences. Second, the mystical creative process is opened up to the contribution of users and non-designer project stakeholders whilst the concepts are still under consideration. Third, the document, which gradually appears in front of the design team, provides a blueprint of the ideation process which can be iterated back and forth on different occasions with various participants who were not present at the time of the generation process. Above all, the design team can discuss and iterate new concepts in a platform that offers a structure which allows sketching experiences true to their temporal, emotive and contextual nature.