beautiful+usable
                                                                                              experience design




                        User Experience 101
                                                    The Basics




BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com                     1
Agenda
What is GOOD, intuitive, easy, simple UX and how is it created, tested, and
sold?

•     Introductions
•     What is User Experience?
      – Past
      – Present
      – Future
•     Why it matters
•     How it is delivered to clients
•     How to sell it
•     Q&A



BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com   2
Introductions
• Name & role
• Lunch date
• Pleasant / unpleasant websites




BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com   3
What is User Experience?
Also known as
• UX
• IA (Information Architecture)
• UI (User Interface) Design
• ED / XD (Experience Design)
• HCI (Human Computer Interaction)
• Human Factors Engineering
• User-Centered Design
• Interaction Design
• Usability




BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com   4
What is User Experience?
                                                                         • Distinct pieces form overall brand
                                                                           impression
                                                                         • “User Interface” typically at widget,
                                                                           app, or page level
                                                                                – Checkout flows
                                                                                – Product pages
                                                                                – Home pages
                                                                                – Calendars
                                                                                – Transactions
                                                                                – Social Media features
                                                                                – Banner interactions




BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com                       5
What is User Experience?
• Front-end design focus
      – Designing it
• Research focus
      – Measuring it to learn how to best iterate on the design
      – Ethnographic or anthropological in nature
• Both explore not just nuts-and-bolts, but meaning and psychology behind
    experience/design
      – Motivations, wants, needs, attitudes




BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com   6
How It All Started




BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com   7
T-Shaped Professionals
    • Vertical + horizontal knowledge
    • Can talk the talk with any other discipline
    • Mix of analytical, conceptual/creative, visual design, communication skills




http://blog.broadeep.com/2009/01/rise-of-service-industry-and-need-of-t.html     http://www.fastcompany.com/magazine/95/design-strategy.html
http://www.enterpriseinnovation.net/content/building-t-shape-leaders             http://community.infragistics.com/pixel8/media/p/95683.aspx

    BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com                                            8
Today s User Experience Field
• Still a baby, as interactive field grows
• If Advertising is 100 years old, Web is 50, UX only half of that
      – Will take time to catch up and get fully socialized
      – Especially true now that anyone can build a website




BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com   9
Today s User Experience Field




Note: Inspired by Mad*Pow s description of Research-Inspired Design www.madpow.com

BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com   10
Today s User Experience Field




BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com   11
The Future
                                                                             • UX will continue to grow and
                                                                               flourish
                                                                                  - As a discipline and a client
                                                                                    need
                                                                                  - As more and more traditional
                                                                                     media moves online
                                                                                  - As long as companies care
                                                                                    about customer experience,
                                                                                    the psychology and
                                                                                    motivations behind it, and how
                                                                                    it affects their bottom line
                                                                             • Roles will continue to overlap

                   Brand Experience

BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com                            12
The Future
• In the meantime, we ll continue to create more and more beautiful + usable
  experiences and explore new technologies




www.thewildernessdowntown.com                                        www.snapshotsofprovence.com




BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com            13
Why Does UX Matter?
1. How an experience feels seriously affects someone s likelihood to use it
   again
      –      Important to study or consider emotional response to technology
2. Especially in transactional and ecommerce experiences, ROI is clear-cut *
3. For process and maintenance, much more expensive to design and develop
   without initial UX planning or insight




                                                                                 $
* See http://www.useit.com/alertbox/roi-first-study.html (2003); http://www.useit.com/alertbox/roi.html (2008);
 http://www.nngroup.com/reports/roi/


BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com                          14
Why Does UX Matter?
Account management
•     Knowing business goals upfront
•     Help scoping projects
•     Brainstorm on initial ideas


Creative
•     Multi-disciplinary brainstorming
•     Voice of the user (based on past experiences and ongoing research)
•     Starting point for concepts




BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com   15
Why Does UX Matter?
Brand planning
•     Collaboration on methodology
•     Facilitating crossover of online and offline insights


Development / Technology
•     Knowing how and when to get Tech involved early on
•     Lessens on-the-spot and frequent changes from designers, account
      managers, clients


Analytics
•     Partnership to get holistic picture of experience



BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com   16
UX Process and Deliverables




BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com   17
Selling UX
• Impact on bottom line
• Brand impression; the gut feel of using the site, banner, interface, ad, or other
  brand interaction point
• Add digital twist to same reasons we sell brand planning and research into
    consumer behaviors and attitudes
• Knowledge is power: informed decisions vs. best-guess from biased
  stakeholders




BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com   18
Q&A
 Thank you!




BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com   19
beautiful+usable
                                                                                              experience design




                                                    Appendix
                                             • UX Deliverable Samples
                                            • More on Beautiful+Usable




BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com                    20
Deliverable Examples
 Competitive Reviews and Other Research Findings


Aggregate Personality Scores
                       Principled

               Fun                   Passionate




  Surprising                                Real




     Honest                                     Tough




      Approachable                   Reliable

                        Youthful




 BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com   21
Deliverable Examples
Personas




BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com   22
Deliverable Examples
Brand Experience Flows and User Flows




BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com   23
Deliverable Examples
Wireframes and Sketches




BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com   24
Deliverable Examples
Site Maps




BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com   25
Deliverable Examples
Comps and Websites




BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com   26
Who is Beautiful+Usable?
Beautiful+Usable is Becky Burd, a seasoned digital agency professional with
over 15 years experience studying the human side of technology and how
consumers interact with brands. She is passionate about usability, digital brand
research, and ecommerce, and works with agencies and corporations to help
them navigate the challenge of creating stunning, intuitive, and profitable
experiences.




BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com   27
Services
•      User experience (UX) design, including wireframes, site maps, user flows, personas,
       communication architectures, brand experience flows, and storyboards
•      Brand and consumer research studies, including focus groups, usability testing,
       brand attitudinal studies, listening labs, competitive reviews, ethnographic studies,
       online surveys, interviewing, and more
•      Creative direction
•      Digital marketing strategy
•      Usability evaluation
•      Web site analytics
•      eCommerce merchandising
•      Business requirements analysis
•      Functional specifications
•      iPhone and iPad application design
•      Social media marketing strategy
•      Educational workshops




BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com   28
Brand Experience
•      Donna Karan and DKNY                          •      Rue La La                     •   Verizon
•      Marc Jacobs                                   •      David Yurman                  •   Nokia
•      Juicy Couture                                 •      Bvlgari                       •   MTV
•      St. John                                      •      Vichy                         •   ESPN
•      Stride Rite                                   •      Timberland                    •   NBC
•      Sunglass Hut                                  •      Adidas                        •   CBS
•      PZI Jeans                                     •      Nowness                       •   Variety
•      Saks Fifth Avenue                             •      Eversave                      •   Century21
•      Neiman Marcus                                 •      Dress For Success




BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com                   29

User Experience 101 - The Basics

  • 1.
    beautiful+usable experience design User Experience 101 The Basics BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 1
  • 2.
    Agenda What is GOOD,intuitive, easy, simple UX and how is it created, tested, and sold? • Introductions • What is User Experience? – Past – Present – Future • Why it matters • How it is delivered to clients • How to sell it • Q&A BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 2
  • 3.
    Introductions • Name &role • Lunch date • Pleasant / unpleasant websites BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 3
  • 4.
    What is UserExperience? Also known as • UX • IA (Information Architecture) • UI (User Interface) Design • ED / XD (Experience Design) • HCI (Human Computer Interaction) • Human Factors Engineering • User-Centered Design • Interaction Design • Usability BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 4
  • 5.
    What is UserExperience? • Distinct pieces form overall brand impression • “User Interface” typically at widget, app, or page level – Checkout flows – Product pages – Home pages – Calendars – Transactions – Social Media features – Banner interactions BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 5
  • 6.
    What is UserExperience? • Front-end design focus – Designing it • Research focus – Measuring it to learn how to best iterate on the design – Ethnographic or anthropological in nature • Both explore not just nuts-and-bolts, but meaning and psychology behind experience/design – Motivations, wants, needs, attitudes BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 6
  • 7.
    How It AllStarted BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 7
  • 8.
    T-Shaped Professionals • Vertical + horizontal knowledge • Can talk the talk with any other discipline • Mix of analytical, conceptual/creative, visual design, communication skills http://blog.broadeep.com/2009/01/rise-of-service-industry-and-need-of-t.html http://www.fastcompany.com/magazine/95/design-strategy.html http://www.enterpriseinnovation.net/content/building-t-shape-leaders http://community.infragistics.com/pixel8/media/p/95683.aspx BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 8
  • 9.
    Today s UserExperience Field • Still a baby, as interactive field grows • If Advertising is 100 years old, Web is 50, UX only half of that – Will take time to catch up and get fully socialized – Especially true now that anyone can build a website BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 9
  • 10.
    Today s UserExperience Field Note: Inspired by Mad*Pow s description of Research-Inspired Design www.madpow.com BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 10
  • 11.
    Today s UserExperience Field BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 11
  • 12.
    The Future • UX will continue to grow and flourish - As a discipline and a client need - As more and more traditional media moves online - As long as companies care about customer experience, the psychology and motivations behind it, and how it affects their bottom line • Roles will continue to overlap Brand Experience BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 12
  • 13.
    The Future • Inthe meantime, we ll continue to create more and more beautiful + usable experiences and explore new technologies www.thewildernessdowntown.com www.snapshotsofprovence.com BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 13
  • 14.
    Why Does UXMatter? 1. How an experience feels seriously affects someone s likelihood to use it again – Important to study or consider emotional response to technology 2. Especially in transactional and ecommerce experiences, ROI is clear-cut * 3. For process and maintenance, much more expensive to design and develop without initial UX planning or insight $ * See http://www.useit.com/alertbox/roi-first-study.html (2003); http://www.useit.com/alertbox/roi.html (2008); http://www.nngroup.com/reports/roi/ BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 14
  • 15.
    Why Does UXMatter? Account management • Knowing business goals upfront • Help scoping projects • Brainstorm on initial ideas Creative • Multi-disciplinary brainstorming • Voice of the user (based on past experiences and ongoing research) • Starting point for concepts BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 15
  • 16.
    Why Does UXMatter? Brand planning • Collaboration on methodology • Facilitating crossover of online and offline insights Development / Technology • Knowing how and when to get Tech involved early on • Lessens on-the-spot and frequent changes from designers, account managers, clients Analytics • Partnership to get holistic picture of experience BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 16
  • 17.
    UX Process andDeliverables BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 17
  • 18.
    Selling UX • Impacton bottom line • Brand impression; the gut feel of using the site, banner, interface, ad, or other brand interaction point • Add digital twist to same reasons we sell brand planning and research into consumer behaviors and attitudes • Knowledge is power: informed decisions vs. best-guess from biased stakeholders BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 18
  • 19.
    Q&A Thank you! BEAUTIFUL+ USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 19
  • 20.
    beautiful+usable experience design Appendix • UX Deliverable Samples • More on Beautiful+Usable BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 20
  • 21.
    Deliverable Examples CompetitiveReviews and Other Research Findings Aggregate Personality Scores Principled Fun Passionate Surprising Real Honest Tough Approachable Reliable Youthful BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 21
  • 22.
    Deliverable Examples Personas BEAUTIFUL +USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 22
  • 23.
    Deliverable Examples Brand ExperienceFlows and User Flows BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 23
  • 24.
    Deliverable Examples Wireframes andSketches BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 24
  • 25.
    Deliverable Examples Site Maps BEAUTIFUL+ USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 25
  • 26.
    Deliverable Examples Comps andWebsites BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 26
  • 27.
    Who is Beautiful+Usable? Beautiful+Usableis Becky Burd, a seasoned digital agency professional with over 15 years experience studying the human side of technology and how consumers interact with brands. She is passionate about usability, digital brand research, and ecommerce, and works with agencies and corporations to help them navigate the challenge of creating stunning, intuitive, and profitable experiences. BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 27
  • 28.
    Services • User experience (UX) design, including wireframes, site maps, user flows, personas, communication architectures, brand experience flows, and storyboards • Brand and consumer research studies, including focus groups, usability testing, brand attitudinal studies, listening labs, competitive reviews, ethnographic studies, online surveys, interviewing, and more • Creative direction • Digital marketing strategy • Usability evaluation • Web site analytics • eCommerce merchandising • Business requirements analysis • Functional specifications • iPhone and iPad application design • Social media marketing strategy • Educational workshops BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 28
  • 29.
    Brand Experience • Donna Karan and DKNY • Rue La La • Verizon • Marc Jacobs • David Yurman • Nokia • Juicy Couture • Bvlgari • MTV • St. John • Vichy • ESPN • Stride Rite • Timberland • NBC • Sunglass Hut • Adidas • CBS • PZI Jeans • Nowness • Variety • Saks Fifth Avenue • Eversave • Century21 • Neiman Marcus • Dress For Success BEAUTIFUL + USABLE • 617.721.6166 • www.beautifulusable.com • becky@beautifulusable.com 29