Visualising design




         Darren Menachemson
the problem



                 Humans’ ability to make a rational
This is not      decision is inversely proportional
                 to the complexity of the
your audience.   information upon which the
                 decision is based.
the problem



               “You can’t eat an elephant in one
So why do we   bite”

do this?        - Some Guy




               “We need a smaller elephant.”
                - Me




               “That’s like 200 pages of high-
               level design. Um, do you know
               what high-level actually means?”
                - Anon
Defining the “design” bit




      Strategic design
      Business architecture
      Interaction design
      Information architecture
      Aesthetic
the solution




What is a visualisation?
 Shows the future solution in operation

 Scope is as big as it needs to be

 Narrative is led by an experience set

 Uses visual language
the solution




What is a visualisation
 Shows the future solution in operation

              Construction
              complete

                               Deployment
                               complete


                                                  System
                                                  in use

   Jan        Jul            Jan            Jul
                                                      Time

 Scope is as big as it needs to be

 Narrative is led by an experience set

 Uses visual language
the solution




What is a visualisation
 Shows the future solution in operation

 Scope is as big as it needs to be



  people   things   channels   process   location    Time &    messaging   Systems &
                                                    sequence                  tech


 Narrative is led by an experience set

 Uses visual language
the solution




What is a visualisation
 Shows the future solution in operation

 Scope is as big as it needs to be

 Narrative is led by an experience set




 Uses visual language
the solution




What is a visualisation
 Shows the future solution in operation

 Scope is as big as it needs to be

 Narrative is led by an experience set

 Uses visual language




         From http://www.kwikpoint.com
Reuse
                                       factor

Who are they for?
                                                Bridesmaid
 Execs – decision making                        dress


 Stakeholders – consultations

 Users – design walkthroughs

 Other project teams – shared vision

 Comms, training, etc, etc




                                                Jeans
Some examples…
                 Simple one-pager…tells a story in a
                 single page, describing key people,
                 systems, processes, UI features,
                 business outcomes.

                 Don’t just tell the design decision
                 makers – show them, warts and all.
                 Get beyond the hype and the
                 confusion!
Some examples…
                 Simple one-pager…tells a story in a
                 single page, describing key people,
                 systems, processes, UI features,
                 business outcomes.

                 Don’t just tell the design decision
                 makers – show them, warts and all.
                 Get beyond the hype and the
                 confusion!
Some examples…
                 Full scenario spelling out
                 the design, including:
                 • High-level overview
                 • Persona
                 • Stepped process
                 • User impact lenses
Some examples…
                                             Comic book, focussing
                                             on a user experience.




        From http://www.boxesandarrows.com
Some examples…
                                 Hand drawn systems,
                                 post-it messages and
                                 play-actor actors…
          nager   Service user
 Client ma
                                 Lo-fi works too!
   CRM


    Register            Inbox
How much detail
   is enough?
        A. As much as is
           needed (sorry)




    Simple,                 Somewhat complex,             Very complex, highly detailed.
    unambiguous.            detailed, informative. Some   Specialist analysis required.
                            understanding and analysis
                            required

Very simple                                                                     Very complex
Principles for getting the right pitch…
• Show what you need ‘em to know
• Generate the right discussion
• Let them walk away with clarity

            Discuss
            business
            outcome                                       Abstract an             Demonstrate a
                                                          interaction             strategic risk
                                                          set                     eventuating



                                           Show a
                                           service desk
                                           interaction
                                                                              Examine the
                                                                              user’s outcome
                            Show a
                            message flow




                                                                Highlight
                                                                a bit of UI
The process of visualising
    Understand the context
    Learn about the context, systems, users, and the desired
    business outcomes


    Find the senior sponsor
    Understand the issues and solve them, review regularly,
    escalate, add value


    Pick the right brains
    Facilitated workshops, interviews, project meetings,
    documentation, user discovery


    Partner with the team
    Build strong relationships, share the work, build a sense
    of contribution and ownership


                                                                Have a deadline
    Get something out EARLY,                                    and an event
                                                                Senior stakeholder commitment
    review, iterate, repeat                                     v. important
Visual ideas
Know your “style”
Branding, recognition, consistency


Gather your resources
(photos, icons, abstract people etc)


Have techniques for dealing with issues
(breakouts, post-its, zooms, relationships/groupings)
A visualisation workbench
Source images          Edit images              Layout visualisation
 www.istockphoto.com    Photoshop/Illustrator    PowerPoint




                                                        Others:
                                                        • Adobe Flash
                                                        • Plasq Comic Life
                                                        • Etc
A visualiser
                          ! ! The offspring of a talented BA, a passionate user
                          experience architect and a mad information designer
                          (process mapping + design)

                          ! ! Very strong communicator (including storytelling,
                          facilitation)

                          ! ! Able to facilitate and build relationships with senior
                          people

                          ! An understanding of IT concepts and business
Hard to find, sometimes
hard to hold onto.
                          architecture

                          ! Preferably people and project management
                          experience

                          ! Ability to help lead and shape solutions, championing
                          the user and the business outcome
The “maybe we
                                                                                     should visualise
                                                                                     it” phase




The “Oh, hai,   The “I’ve got to   The “I’ve got real   The “All these hard          The “At last! The
nice to meet    do a WHAT?”        work to do and       questions and nasty          right conversation”
you” phase      phase              we’re drawing        issues. I wish it were all   phase
                                   piccies?” phase      still ambiguous!” phase
Drawbacks

        Time-intensive
    Specialist skills
Sounds “funky” until you see it
     The fun doesn’t end after the event
What it avoids/provides

• Cultural/semantic misunderstanding
• “I didn’t think that’s what I agreed to”
• Early review at concept stage
• Contextualising issues
• Shaping the right solution
Try it…
Choose one of these
• Last meal you cooked…
• How you booked your last flight…
• Your last big shop at a supermarket…

Sketch up a rich visualisation showing the user experience,
process, channels, technology, data etc – either in-line or
layered (60 seconds)

Walk the person next to you through it (60 seconds)
Stories can bind complexity,
because stories are
fundamental to our
humanity.

Visualising the user experience

  • 1.
    Visualising design Darren Menachemson
  • 2.
    the problem Humans’ ability to make a rational This is not decision is inversely proportional to the complexity of the your audience. information upon which the decision is based.
  • 3.
    the problem “You can’t eat an elephant in one So why do we bite” do this? - Some Guy “We need a smaller elephant.” - Me “That’s like 200 pages of high- level design. Um, do you know what high-level actually means?” - Anon
  • 4.
    Defining the “design”bit Strategic design Business architecture Interaction design Information architecture Aesthetic
  • 5.
    the solution What isa visualisation? Shows the future solution in operation Scope is as big as it needs to be Narrative is led by an experience set Uses visual language
  • 6.
    the solution What isa visualisation Shows the future solution in operation Construction complete Deployment complete System in use Jan Jul Jan Jul Time Scope is as big as it needs to be Narrative is led by an experience set Uses visual language
  • 7.
    the solution What isa visualisation Shows the future solution in operation Scope is as big as it needs to be people things channels process location Time & messaging Systems & sequence tech Narrative is led by an experience set Uses visual language
  • 8.
    the solution What isa visualisation Shows the future solution in operation Scope is as big as it needs to be Narrative is led by an experience set Uses visual language
  • 9.
    the solution What isa visualisation Shows the future solution in operation Scope is as big as it needs to be Narrative is led by an experience set Uses visual language From http://www.kwikpoint.com
  • 10.
    Reuse factor Who are they for? Bridesmaid Execs – decision making dress Stakeholders – consultations Users – design walkthroughs Other project teams – shared vision Comms, training, etc, etc Jeans
  • 11.
    Some examples… Simple one-pager…tells a story in a single page, describing key people, systems, processes, UI features, business outcomes. Don’t just tell the design decision makers – show them, warts and all. Get beyond the hype and the confusion!
  • 12.
    Some examples… Simple one-pager…tells a story in a single page, describing key people, systems, processes, UI features, business outcomes. Don’t just tell the design decision makers – show them, warts and all. Get beyond the hype and the confusion!
  • 13.
    Some examples… Full scenario spelling out the design, including: • High-level overview • Persona • Stepped process • User impact lenses
  • 14.
    Some examples… Comic book, focussing on a user experience. From http://www.boxesandarrows.com
  • 15.
    Some examples… Hand drawn systems, post-it messages and play-actor actors… nager Service user Client ma Lo-fi works too! CRM Register Inbox
  • 16.
    How much detail is enough? A. As much as is needed (sorry) Simple, Somewhat complex, Very complex, highly detailed. unambiguous. detailed, informative. Some Specialist analysis required. understanding and analysis required Very simple Very complex
  • 17.
    Principles for gettingthe right pitch… • Show what you need ‘em to know • Generate the right discussion • Let them walk away with clarity Discuss business outcome Abstract an Demonstrate a interaction strategic risk set eventuating Show a service desk interaction Examine the user’s outcome Show a message flow Highlight a bit of UI
  • 18.
    The process ofvisualising Understand the context Learn about the context, systems, users, and the desired business outcomes Find the senior sponsor Understand the issues and solve them, review regularly, escalate, add value Pick the right brains Facilitated workshops, interviews, project meetings, documentation, user discovery Partner with the team Build strong relationships, share the work, build a sense of contribution and ownership Have a deadline Get something out EARLY, and an event Senior stakeholder commitment review, iterate, repeat v. important
  • 19.
    Visual ideas Know your“style” Branding, recognition, consistency Gather your resources (photos, icons, abstract people etc) Have techniques for dealing with issues (breakouts, post-its, zooms, relationships/groupings)
  • 20.
    A visualisation workbench Sourceimages Edit images Layout visualisation www.istockphoto.com Photoshop/Illustrator PowerPoint Others: • Adobe Flash • Plasq Comic Life • Etc
  • 21.
    A visualiser ! ! The offspring of a talented BA, a passionate user experience architect and a mad information designer (process mapping + design) ! ! Very strong communicator (including storytelling, facilitation) ! ! Able to facilitate and build relationships with senior people ! An understanding of IT concepts and business Hard to find, sometimes hard to hold onto. architecture ! Preferably people and project management experience ! Ability to help lead and shape solutions, championing the user and the business outcome
  • 22.
    The “maybe we should visualise it” phase The “Oh, hai, The “I’ve got to The “I’ve got real The “All these hard The “At last! The nice to meet do a WHAT?” work to do and questions and nasty right conversation” you” phase phase we’re drawing issues. I wish it were all phase piccies?” phase still ambiguous!” phase
  • 23.
    Drawbacks Time-intensive Specialist skills Sounds “funky” until you see it The fun doesn’t end after the event
  • 24.
    What it avoids/provides •Cultural/semantic misunderstanding • “I didn’t think that’s what I agreed to” • Early review at concept stage • Contextualising issues • Shaping the right solution
  • 25.
    Try it… Choose oneof these • Last meal you cooked… • How you booked your last flight… • Your last big shop at a supermarket… Sketch up a rich visualisation showing the user experience, process, channels, technology, data etc – either in-line or layered (60 seconds) Walk the person next to you through it (60 seconds)
  • 26.
    Stories can bindcomplexity, because stories are fundamental to our humanity.