UXHK 2014 notes: Storytelling – Interaction Design as the Language of Story

Workshop by: Dave Malouf, @daveixd

If your story doesn’t engage, then you are probably failing at design.


  •  people = personas
  • location = context
  • props = interfaces
  • activities = tasks
  • dialog = flow/sequence
  • experience – how we FEEL how to get things done
  • engage emotional connection with voice/tone
  • Tales with: purpose, meaning, value
  • design to create change

Why Stories?

  • Experiencing
  • What it is like to be there
  • bring story to 3D space –> experience surrounds us
  • Stories frame; they’re intentional –> conveying the future with intention
  • Suggested reading: “Understanding Comics” – deconstruction of comics/stories
  • Suggested notebook: Muji Manga Notebook
  • Games, stories, jokes: culturally embedded

Stories create Landmarks

  • What it is
  • why they’re doing something
  • “Where were you when…?” 
  • If they don’t engage emotionally, they probably won’t engage
  • Design things for the kind of emotion in a specific context when the product/interface is being used

Escape > Reflect

  • Create a story that will allow me to understand myself

How do you create a story from scratch?

  1. Experience
  2. Hard Work
  3. Find your Voice
  4. Research

Actual experience is better: engage in the research!


  • cluster of users -> similar behavioral patterns
  • behaviors, attitudes, motivations are similar regardless of age, etc.
  • Observe as much as you can
  • Primary: direct target
  • Secondary: will impact the primary persona
  • Tertiary: not going to use it but are impacted by the system
  • example of facets: lifestyle, relationships, entertainment, technology uses, goals, motivations
  • be specific – humanize them
  1. Get writing – words for your process
  2. Get moving – improv: influence from the audience
    suggested reading: Game Storming
  3. Build it
    interactions, especially in mobile, are embodied (physicality + digital experience)
    for example: figuring out the right gestures (i.e. inserting a card or swiping – systems might not translate exactly the same way around the world)

Suggested reading: “See What I Mean” by Kevin Ching

Know Other Disciplines

  • Realism
  • Resonance – I can believe in your story and I can connect it with my life
  • interest – the way you tell your story
  • drama – key in on their motivations
  • tell it in a way that engages them
  • design serves that create feedback (empowering people)

Everything has a story

  • stories help us become preventive instead of responsive


From Story to Design


Externalize and reflect culture

  • find commonalities
  • navigate
  • cross-cultures

Stories frame Principles (how you describe your product/service)

  • not guidelines or patterns
  • qualities to make you different

Introduction to Parti Sandwich

Parti – central idea or concepts of a building

  1. Tech Opportunity
  2. Human Factor
  3. Marketing Trend
  4. Target group’s activities
  5. Scenario

Some guide questions: 

  • Did your persona stand up? or does the story map against the persona?
  • Are the activities complete enough?
  • Does the end of your story have a realistic happy ending?

Your Character

  • Backstory
  • Motivation
  • End Goal
  • Personality
  • Interests
  • Relationships


  • enough explanation
  • problem framed to engage
  • problem well described
  • resolved realistically
  • clear vision of the future


  • artifacts
  • space
  • roles
  • expectations
  • culture


From Words to User Interface


Encode your UI

  • chunk into scenes
  • add nouns and  verbs into place: objects, methods, parameters
  • adjust screens based on appropriate density



creating a vision together

  • Collaborate – include people in the research
  • Come up with personas from data


UXHK 2014 notes: From Customer Insight to Great Products

Root Cause Analysis

  • the first answer might not be the right answer –> DIG DEEPER
  • WHY is that our problem?
  • 5 Why’s: Problem – Why – Why – Why – Why – Why – Solution
  • one branch at a time, like a mind map
  • Rethink how you’re facing the problem
  • We are often NOT the average consumer
  • to find it: go out and talk to people –> Thinking tool –> VALIDATE!
  • Research: explore problems
  • BUT! It’s not going to be perfect
  • Hypotheses: test
  • If a solution has a minor cost and relatively high success, then why not try that out?


Innovation Clover


  • User Needs: unmet needs, improved experience
  • Money/profit: high revenue, low costs
  • Business: brand and strategy alignment, skill sets/expertise, resources (human and financial); cost of doing something: what product can we NOT do to invest in ONE thing
  • Technology: new capabilities, technical debt (every time we cut a corner, we can hinder design or meeting customer needs; keeping up with technology)


  • find the partner you need to be successful
  • you don’t have to do everything
  • WHAT do I have?
  • WHAT am I missing?
  • Partnerships –> Re-evaluate –> What do we need to do next?

Business Capabilities

  • Creating capabilities
  • creating something customers love
  • Starting points can be uncomfortable
  • users may not know how to articulate what they need –> they don’t know what the solutions are
  • Design: foresee


Reaching Your Stakeholders

  • articulate what’s going on
  • Recommended Reading: “Crucial Conversations” 
  • Reframe the conversation: find the path that’s right / towards what will drive the results


Avoiding the “Me Too” Products

  • Experience Continuum




Identifying Markets for Global Research

Where should we do research? 

  • country differences are not useful
  • (a) Is the design fundamentally different?
  • (b) Data entry: is the paradigm fundamentally different?
  • (c) Are consumer behaviors fundamentally different?
  • (d) Are the countries fundamentally different in any relevant way?
  • BIGGEST DIFFERENCES, not biggest markets


Attending UXHK on a Budget

I recently attended UXHK as an independent designer (i.e. not sponsored by a company). It’s not as easy to plan and budget conferences if you’re doing freelance, but that doesn’t mean it’s impossible. Granted, most of the people I’ve met were from companies who are investing in UX, but some of them have come independently (or started off that way, until they managed to convince their bosses that investing in UX is worth it).

Hong Kong is expensive. Lodgings are quite pricey compared to other Asian countries I’ve been to, but it doesn’t mean there aren’t more affordable options. Sure, I can’t afford hotels charging USD $100++ per night, and PhP 16k for round-trip tickets is no joke, but if you can plan ahead and book sales and promos, it wouldn’t be so bad.

Planning ahead is best, so check out the conferences you plan on attending and subscribe to the mailing lists to know as soon as early bird tickets are up. Don’t worry about the flight and lodgings yet, because early bird discounts are great and you will need it if you want to save some money. Buy the event/conference tickets first, and then hound one of the budget airlines or check every time they have a sale. I’m subscribed to Cebu Pacific’s mailing list and it’s enough to book some discounted tickets even if they’re not always from Piso Sales (any discount is great help).

Hostels are a good start for cheaper lodgings. When you’re a female traveling solo though, things can get a bit trickier. I wasn’t that comfortable taking the dorms, but it’s a cheaper option. Instead, I had a single room from a hostel and for 5 days, the price isn’t bad. It’s easier if you’re traveling with a group of friends, but sometimes your friends aren’t available to accompany you abroad just because you want to go to a conference. I checked Airbnb, but when I did my computations, as a solo traveler the hostel still gave me more savings.

Here’s a quick list of how much I needed (prices rounded up):

  • UXHK Early Bird Tickets – HKD 2950 or PhP 17,000 (3 days)
  • Cebu Pacific Tickets (round-trip), promo – PhP 6,400
  • Dragon Hostel Hong Kong – PhP 7,320 (5 days)


  • Travel tax (Manila) and Airport Fee (NAIA) – around PhP 2,500 (can’t remember exact price)
  • Transportation around HK (mostly by train) – PhP 2,600 or around HKD 450 (5 days)
  • Food budget (HKD 50/meal) – PhP 3,000 or around HKD 500

I didn’t add in shopping money in there, but for the important stuff for the trip I spent PhP 40,000 / USD 900 / HKD 7,000 (conference tickets, plane, lodgings, transportation, food). Cheaper if you want to book only for exactly the conference dates, but I didn’t want to be rushing so I included a day before and after making it a grand total of 5 days. You can spend less if you don’t take the Airport Express train (around HKD 100), but you have to make sure you have enough time going to and from the airport if you want to take the bus (around HKD 33). You can also check for promos on the Airport Express train if you’re traveling with other people (tickets for a group of 2 would only cost HKD 80, for example).

There were snacks served during the three conference+workshop days so I didn’t have to spend much on my meals (I definitely spent less than the budget I listed for food above). HKD 50/meal is already a mid-range budget (includes drinks), so you can also spend less if you prefer.

My hostel was at Argyle Street in Mong Kok, two blocks away from the station so it’s very near. I added more to that budget for some shopping, but it’s totally unnecessary to make the trip :) There are definitely a couple of areas you can visit for free, and I had little adventures on my own even as I was having money troubles during the trip so it was still a memorable experience.

Was it worth that much money? 

I really feel that what makes the conference worth it are the people you meet. Sure, some of the workshops or speakers’ topics can be found online (and if you looked at the right places, you could just take online courses or get subscriptions, listen to podcasts, etc), but it doesn’t have the insights that those giving workshops would share. Or the stories that come from various backgrounds and different contexts that attendees share with each other. Or the new friends that you may make, along with possible professional opportunities from networking with professionals in the field.

Would I attend the next UXHK? 

I would like to check the list of speakers, but I’m already 80% affirmative.