Interaction Design as the Language of Story

  • 507 views
Uploaded on

Talk I have for UX Hong Kong 2014.

Talk I have for UX Hong Kong 2014.

More in: Design
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
507
On Slideshare
0
From Embeds
0
Number of Embeds
2

Actions

Shares
Downloads
0
Comments
0
Likes
12

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide
  • Create among all stakeholders a shared sense of meaning and purpose (aka value) around the solutions within any given set of problem spaces.
    By doing this they facilitate among those stakeholders the comprehensive vision by which they all can engage in executing on that vision. A shared intent is crafted, that they all co-create, and co-execute towards achieving value and meaning.
  • Before there was ever design. Before there was the written word. At the dawn of language itself, with tools like fire and stone, there was story.
  • Stories have been used to engage us, yes, but also to guide us. Let’s follow an oldie but goodie … Exodus.
  • Pain doesn’t have to be deadly … just an annoyance.
  • Leaders, heroes, magic come to our rescue
  • Without a sense of justice we cannot move forward. We must be redeemed in some way. Doesn’t require death.
  • We need not struggle, to be free.
    Our hero is magic. Design is the incantation in the cauldron of technology & culture.
    Having a staff, helps.
  • They demonstrate a new world order, where without the magic, or its cause, we would be irresponsible without.
  • A story by itself is not so much in the telling.
    The Hagaddah. The book that Jews use to guide them through their annual telling of Exodus is a tremendous tool for story telling.
  • How to even tell the story to different audiences in this case.
  • The frames get re-used throughout. With the rest of the system stories reinforce relationships, and create a cultural memory system. In the Seder (the “Ordered” telling) there are 4 cups of wine surrounding which are the rituals and parts of the story and why they exist. They are markers on our path.
  • The Afikomen is an invention in later versions of the the story telling ritual that adds a game to the evening. It creates an annual anticipation of possible reward.
    The frames get re-used throughout. With the rest of the system stories reinforce relationships, and create a cultural memory system.
  • What’s wrong w/ this plate?
    The orange … It has it’s own story. It communicates a cultures changing value systems that require a new type of engagement.
  • The story is an anchor of a shared experience that all who hear it can share.
  • Frames create structure for memory, and for retelling. It creates pathways similar to landmarks.
  • It even gives us the means for framing how we even craft the story in the first place.
    Gives us a place to start.
  • Stories have also evolved specific tools over time.
  • But memory in a photo is not enough. We have other techniques to help us remember and those are by creating personal stories.
  • We create structure so we can remember. The question is an invitation to create a story and once created it lives on it’s.
  • But there are always new stories for a new generation, that keep getting created and enhanced.
  • But because stories are human (or anthropomorphized) we connect deeply at an emotional level when done correctly.
  • But stories are an externalization. Once externalized they are a mirror that allow us to reflect.
    No genre of storytelling reflects this better than Science Fiction. Whether the utopia of Star Trek or the distopia of classic Japanese anime or the billions of questions from the shortest of short Phillip K. Dyck stories, we are asked to reflect on ourselves and the society in which we live.
  • As noted above, great stories have lessons for us.
  • If they don’t engage the different intended audiences, we have failed and so every aspect of a story’s details needs to use the tools of psychological engagement: humor, fear, anticipation, suspense, climatic resolution, exposition, etc. to hold our attention, and create relevance.
    The multiple-levels of humor so prevalent in early Warner Bros. cartoons and now in Pixar movies (and Dreamworks and the like) allow both parent and child to share an experience and allowing children to mature and find new meanings in these modern stories.
  • So a long time ago, some famous Greek dude, decided to espouse on what makes a narrative. He was a simple man though and came up with …
  • He said, there is a definite beginning, and since there is invariably more than one word there is definitely an END, but the exciting part is that he said there is … wait for it … a MIDDLE!!!
  • Fast forward a few millennia and this Prussian guy said this is a good start, but is not enough to make a narrative.
  • So, he came up w/ 5 pieces to the story.
  • This has hence been expanded on further.
    And for the designer, it is the last part that closes the loop between acts of a story, or between stories themselves that is most important to consider: transformation.
    If there is no transformation (positive transformation hopefully) there is no real basis of either measuring success, let alone having a reason for starting the design in the first place.
  • This is not meant to be comprehensive and often these have different names such as character, setting and plot.
  • But when you look at their structure in this way you see a direct correlation to what is we do as designers and why story is such a wonderful map for interaction design.
  • Script writing differs from just writing a story.
    It has structure and form that offers guidance for how direct key elements like actors and cameras through a given part of a story (a scene).
  • A tool that helps this process even deeper is Adobe Story. I highly recommend people who are interested in the language/narrative side of design to take a look at it.
  • You can pair script writing w/ storyboarding and tools like Comic Life take the hard part of comics out of the way. You don’t have to think about the framing of your work, or the drawing of simple elements. By using photos instead of drawing (or finding photos online) you can build out comics to tell a story fairly quickly.
  • Here is a video prototype that my students created 2 years ago to envision a future with a hybrid material library for the industrial design department at SCAD.

Transcript

  • 1. Interaction Design as the Language of Story Dave Malouf @daveixd UX Hong Kong March 2014
  • 2. What is the core problem of the designer?
  • 3. Empathy
  • 4. Story Rock Painting, Tassili n Ajjer, Algeria (Neolithic Agricultural
  • 5. Fill our culture
  • 6. Create shared pain
  • 7. Create heroes
  • 8. Punish our enemies
  • 9. Free us
  • 10. Show us the way forward
  • 11. In the telling
  • 12. Embed Instructions
  • 13. Create future frameworks
  • 14. Engages the correct audience
  • 15. And the story evolves
  • 16. What do stories do?
  • 17. Share Experience
  • 18. Frames
  • 19. Muji Manga Notebook muji.co.hk muji.com.cn muji.com.sg muji.net (Japan) mujikorea.net muji.tw muji.com/th/ muji.com/ph/ muji.com/my/ muji.us
  • 20. The Pope that spawned a million tweets Memory
  • 21. Where were you when?
  • 22. Or is this better?
  • 23. Emotion > Empathy
  • 24. Escape > Reflect
  • 25. Instruct
  • 26. Engage
  • 27. Aristotle A dead Greek dude What is a story
  • 28. Beginnin g Middl e En d
  • 29. Gustav Freytag Less Old Dead Prussian Guy
  • 30. Elements of a Story • People • Locations • Props • Activities • Dialog
  • 31. A lot like what we do • People • Locations • Props • Activities • Dialog • Personas • Contexts • Interfaces • Tasks • Flow/Sequence
  • 32. Tools of The Craft The Craft Script writers have had this down for a long time!
  • 33. Tools exist Adobe Story CC Plus
  • 34. Comics are Easy Too Comic Life or Comic Touch
  • 35. https://vimeo.com/42723890 An Example Student work (SCAD) - credits in movie.
  • 36. Thank you! Questions? Questions? Dave Malouf @daveixd dave.ixd@gmail.com