SlideShare a Scribd company logo
1 of 42
Pure Digital Since 1983




                  UX for a Mobile-Age Audience

                                         Krysta Stone
                                          @krystastone

                                       Marti Gukeisen
                                            @UXmarti
Intro | We Have Entered the “Mobile Age”

• Over 95% of the US population owns a mobile phone
• Nearly 25% of the US population currently owns a
  smartphone.
   – It’s projected that by 2014, over 40% of all mobile phones
     will be smartphones
• Nearly 10% of the US population currently owns a tablet
   – The number of tablet users is projected to more than
     double in 2011, and then double again in 2012



                                                                  2
Outline

• Intro
• Influence of iPad in UX
• The Mobile vs. Desktop War is Over
• Omniscient Innovation
• It Shouldn’t Feel Like Homework
• What Does it All Mean?



                                       3
Pure Digital Since 1983




            Influence of iPad in UX
Influence of iPad in UX | What are they?

• Ease of Use
• Metaphor
• Discoverability
• Entertainment
• Touch Screen




                                           5
Ease of Use | What is it?
Apple emphasizes a simple, clean interface




                                             6
Ease of Use | In comparison
PC emphasizes multitasking & feature explosion.




                                                  this slide




                                                          7
Ease of Use | Influence

• More focused on one task at a time
• Reduce feature assault
• Reduce competition for attention on the screen




                                                   8
Metaphor | What is it?

Using something to represent something it is not.
        what it is       what it means on a screen




                                                     9
Metaphor | Astronomical Example
• Music player that uses
  images & concepts from
  astronomy to visualize
  music collections.
   Sun = Artist
   Planet = Album
   Moon = Song




                                  10
Metaphor | Old lessons for new design
    This is too far 




Party like it’s…




                                            11
Metaphor | This spectrum is a metaphor
 Given the context of a project, what is appropriate?


                                                  Goal Completion
                                                          Efficiency
                                     Less Time & Effort to Interpret

Literal                                                      Abstracted
Used More
                            Metaphor                          Used Less

   More Time & Effort to Interpret
   Entertainment
   Play
                                                                       12
Metaphor | So why was this okay?
• iPad sets ‘playful’ as an
  expectation
• Object is entertainment, not
  goal completion
• Basics are still presented in a
  conventional way




                                    13
Discoverability | It’s evolving
“Discoverability: the ability for a user of a design to locate something that they need, in order to complete a certain task.”


• Discoverability is shifting – it’s becoming
  part of the entertainment of the experience
  and that’s ok!
• Conventions and standards for iPad don’t
  exist yet, but they’re emerging
• Is it (finally) time to let go of the ‘traditional’
  web nav design? (so 1996!)

Don’t forget:
• Users still need to be able to accomplish
   tasks
• Leverage mental models!
• Make functions discoverable by users “just
in
   time.”                                                                                                                        14
Entertainment | But what does it DO?
• Purpose and functionality aren’t always the
  primary objective

• Explore the capabilities of the medium to create a
  delightful experience

• Right place at the right time: Don’t abandon your
  common sense.

• What is the core purpose of the
  experience? Is there a way to
  make it more entertaining?




                                                       15
Touchscreen | Tips
• Be ready for multiple orientations
• Be ready to start…and to stop
• Keep the focus on the primary task
• Use simplified hierarchies
• Think gestures, not clicks
• Make targets at least 44x44 points
• Move beyond the linear
• Create opportunities to collaborate
                                        16
Example | Designing for Touchscreens




           The Fantastic Flying Books of Mr. Morris Lessmore

                                                               17
Example | Designing for Touchscreens




           The Fantastic Flying Books of Mr. Morris Lessmore

                                                               18
Pure Digital Since 1983




The Mobile vs. Desktop War is Over
It was a tie | Cross-platform is IN

• It’s time to catch up to mobile user expectations.
• Stop thinking about a separate sites for “fixed
  Internet” (i.e. desktop), mobile and tablet
  experiences (unless there’s a specific need).
• Think about how a single user experience design
  can meet the needs of many devices.
• Consumers want consistent, or even
  better, contextually relevant experiences.
• “Make it work on my device, make it cool &
  delightful and give me what I want, when I need
  it.”

                                                       20
Responsive Design | What is it?

• One way to keep up with all of the devices/resolutions on the market

• Applies an architectural philosophy to digital design, that structures
  should respond to the environment and people in them

• Designs should respond to a user’s behavior and environment based on
  screen size (resolution), platform and orientation

• Fluid grids, flexible images and media queries

• Eliminates the need for a different design and development phase for
  each new gadget on the market




                                                                           21
Responsive Design | Examples

Sweet Hat Club http://sweethatclub.org/




                                          22
Responsive Design | Examples

Food Sense     http://foodsense.is/




Many more examples at http://mediaqueri.es/



                                              23
Pure Digital Since 1983




           Omniscient Innovation
Contextual Awareness | what is it?

Contextual awareness is the
idea that things that
are “aware” of the context
around them and behave
differently if their environment
changes.




                                     25
Contextual Awareness | Using these…

•   GPS                 • Twitter, et al
•   Accelerometer       • Facebook, Google+ et al
•   Camera              • Foursquare, et al
•   Bluetooth
•   RFID
•   Infrared

• API’s
• Google maps
• Google Street view


                                                    26
Contextual Awareness | we might know…

• Location                •   What places are nearby
• Time of Day             •   What devices are nearby
• Temperature             •   What objects are nearby
                          •   What can be seen nearby
•   Device Orientation
•   Device Movement
•   Device Acceleration
•   Device Speed




                                                        27
Contextual Awareness | we might know…

• Who is using the device        •   User data
• User Mega Meta                 •   Aggregate data
   – gender, status, likes,      •   Data over time / trending
      employer, birthday, etc.   •   Everything about everyone
• Searches
• Tweets
• Friends
• Financial information




                                                                 28
Contextual Awareness | Location + Orientation




                                                29
Contextual Awareness | Street View + Location + Camera




                                                     30
Contextual Awareness | why this matters

• New opportunities to leverage creatively
• Bring mobile-magic ideas to your clients
• Consider influence of mobile-mania on the immobile web
  experience and expectations




                                                           31
Pure Digital Since 1983




It Shouldn’t Feel Like Homework
Gamification | What is it?

You can apply the basic elements that make games fun and
engaging to things that typically aren't considered a game.
                                                 -Gamification.org




                                                                33
Gamification | Game Mechanics

• The processes by which games work
• Gamification applies game mechanics to situations other than
  games
• Game mechanics used well can help encourage engagement,
  active learning, and loyalty
• Gamification and mobile work well together




                                                             34
Gamification | Checking In

  Gowalla       scvngr       Foursquare   We & Co




                                                    35
Gamification | Fitbit




                        36
Gamification | Bartle’s Personality Types

Richard Bartle’s gamer personality types are a way of thinking about how
different people approach games. They can be helpful to think about when
developing other user experiences as well.
         Achievers – collect markers of accomplishment, such as points

        Explorers – enjoy the world of the game more than game objectives

        Socializers – prefer to play with others—games are about the social
        experience

        Killers – focus on competition




                                                                           37
Gamification | Applying to UX

How do gamification and gaming personality types influence the UX process?

• Consider how gamification might apply to your context
   – Can you make your application more game-like?
   – Consider how to make tasks appeal to the various gaming
      personalities
• Incorporate personality types into personas




                                                                         38
Pure Digital Since 1983




          What Does It All Mean?
Considerations | For your mind to munch on

• Moderation in all things

    – Find the right balance given the context
      [ play / metaphor / discovery / gamification / simplicity / efficiency /
      familiarity / ease of use ]

• Conventions don’t really exist yet for mobile/touch

• This stuff SCREAMS interdisciplinary




                                                                                 40
Remember | How people really use technology




                                              41
DISCUSS

Krysta Stone           Marti Gukeisen            Enlighten.com/blog
@krystastone           @Uxmarti                  @EnlightenAgency
kstone@enlighten.com   mgukeisen@enlighten.com   info@enlighten.com


                                                                  42

More Related Content

What's hot

A bit more emotion, a little less emotional - future perspectives for emotion...
A bit more emotion, a little less emotional - future perspectives for emotion...A bit more emotion, a little less emotional - future perspectives for emotion...
A bit more emotion, a little less emotional - future perspectives for emotion...Marco van Hout
 
The Language of Interaction
The Language of InteractionThe Language of Interaction
The Language of Interactionfrog
 
Principles of user interface design
Principles of user interface designPrinciples of user interface design
Principles of user interface designvivekvelvan
 
SxSW 2012: Applying Behavior Design
SxSW 2012: Applying Behavior DesignSxSW 2012: Applying Behavior Design
SxSW 2012: Applying Behavior DesignChris Risdon
 
Mobile Prototyping Essentials Workshop - Part One
Mobile Prototyping Essentials Workshop - Part OneMobile Prototyping Essentials Workshop - Part One
Mobile Prototyping Essentials Workshop - Part OneRachel Hinman
 
Mobile Prototyping Essentials Workshop: Part 1
Mobile Prototyping Essentials Workshop: Part 1Mobile Prototyping Essentials Workshop: Part 1
Mobile Prototyping Essentials Workshop: Part 1Rachel Hinman
 
Anant National University - Interaction design - lesson 1
Anant National University - Interaction design - lesson 1Anant National University - Interaction design - lesson 1
Anant National University - Interaction design - lesson 1Ekta Rohra Jafri
 
Mobile Prototyping Essentials - Part II
Mobile Prototyping Essentials - Part IIMobile Prototyping Essentials - Part II
Mobile Prototyping Essentials - Part IIRachel Hinman
 
Framing Behavior Design
Framing Behavior DesignFraming Behavior Design
Framing Behavior DesignChris Risdon
 
CWC Social Story Business & You Web 2.0
CWC Social Story Business & You Web 2.0CWC Social Story Business & You Web 2.0
CWC Social Story Business & You Web 2.0Siobhan O'Flynn
 
Can we design organizations for beauty?
Can we design organizations for beauty?Can we design organizations for beauty?
Can we design organizations for beauty?Joyce Hostyn
 
Predictable Irrationality If You Build What They Ask For, They Will Not Come
Predictable Irrationality If You Build What They Ask For, They Will Not ComePredictable Irrationality If You Build What They Ask For, They Will Not Come
Predictable Irrationality If You Build What They Ask For, They Will Not ComeJoyce Hostyn
 
Getting2Alpha: Turbo-charge your product with Game Thinking by Amy Jo Kim
Getting2Alpha: Turbo-charge your product with Game Thinking by Amy Jo KimGetting2Alpha: Turbo-charge your product with Game Thinking by Amy Jo Kim
Getting2Alpha: Turbo-charge your product with Game Thinking by Amy Jo KimNaresh Jain
 
SXSW Interactive 2013 Recap
SXSW Interactive 2013 RecapSXSW Interactive 2013 Recap
SXSW Interactive 2013 RecapShawn Cheng
 
Concept product-story
Concept product-storyConcept product-story
Concept product-storyErfgoed 2.0
 
AUTHENTIC IN ALL CAPS Case Study & Interview with Christy Dena
AUTHENTIC IN ALL CAPS Case Study & Interview with Christy Dena AUTHENTIC IN ALL CAPS Case Study & Interview with Christy Dena
AUTHENTIC IN ALL CAPS Case Study & Interview with Christy Dena TMC Resource Kit
 
More Than Points: Architecting Engagement Through Game Design Thinking
More Than Points: Architecting Engagement Through Game Design ThinkingMore Than Points: Architecting Engagement Through Game Design Thinking
More Than Points: Architecting Engagement Through Game Design ThinkingDustin DiTommaso
 
Asians are virtual, what about us
Asians are virtual, what about usAsians are virtual, what about us
Asians are virtual, what about usBenjamin Joffe
 

What's hot (20)

A bit more emotion, a little less emotional - future perspectives for emotion...
A bit more emotion, a little less emotional - future perspectives for emotion...A bit more emotion, a little less emotional - future perspectives for emotion...
A bit more emotion, a little less emotional - future perspectives for emotion...
 
What the F*** is UX?
What the F*** is UX?What the F*** is UX?
What the F*** is UX?
 
The Language of Interaction
The Language of InteractionThe Language of Interaction
The Language of Interaction
 
Principles of user interface design
Principles of user interface designPrinciples of user interface design
Principles of user interface design
 
SxSW 2012: Applying Behavior Design
SxSW 2012: Applying Behavior DesignSxSW 2012: Applying Behavior Design
SxSW 2012: Applying Behavior Design
 
Mobile Prototyping Essentials Workshop - Part One
Mobile Prototyping Essentials Workshop - Part OneMobile Prototyping Essentials Workshop - Part One
Mobile Prototyping Essentials Workshop - Part One
 
Mobile Prototyping Essentials Workshop: Part 1
Mobile Prototyping Essentials Workshop: Part 1Mobile Prototyping Essentials Workshop: Part 1
Mobile Prototyping Essentials Workshop: Part 1
 
Anant National University - Interaction design - lesson 1
Anant National University - Interaction design - lesson 1Anant National University - Interaction design - lesson 1
Anant National University - Interaction design - lesson 1
 
Mobile Prototyping Essentials - Part II
Mobile Prototyping Essentials - Part IIMobile Prototyping Essentials - Part II
Mobile Prototyping Essentials - Part II
 
Framing Behavior Design
Framing Behavior DesignFraming Behavior Design
Framing Behavior Design
 
CWC Social Story Business & You Web 2.0
CWC Social Story Business & You Web 2.0CWC Social Story Business & You Web 2.0
CWC Social Story Business & You Web 2.0
 
Can we design organizations for beauty?
Can we design organizations for beauty?Can we design organizations for beauty?
Can we design organizations for beauty?
 
Predictable Irrationality If You Build What They Ask For, They Will Not Come
Predictable Irrationality If You Build What They Ask For, They Will Not ComePredictable Irrationality If You Build What They Ask For, They Will Not Come
Predictable Irrationality If You Build What They Ask For, They Will Not Come
 
Getting2Alpha: Turbo-charge your product with Game Thinking by Amy Jo Kim
Getting2Alpha: Turbo-charge your product with Game Thinking by Amy Jo KimGetting2Alpha: Turbo-charge your product with Game Thinking by Amy Jo Kim
Getting2Alpha: Turbo-charge your product with Game Thinking by Amy Jo Kim
 
SXSW Interactive 2013 Recap
SXSW Interactive 2013 RecapSXSW Interactive 2013 Recap
SXSW Interactive 2013 Recap
 
Concept product-story
Concept product-storyConcept product-story
Concept product-story
 
AUTHENTIC IN ALL CAPS Case Study & Interview with Christy Dena
AUTHENTIC IN ALL CAPS Case Study & Interview with Christy Dena AUTHENTIC IN ALL CAPS Case Study & Interview with Christy Dena
AUTHENTIC IN ALL CAPS Case Study & Interview with Christy Dena
 
Psfk trends 2015
Psfk trends 2015Psfk trends 2015
Psfk trends 2015
 
More Than Points: Architecting Engagement Through Game Design Thinking
More Than Points: Architecting Engagement Through Game Design ThinkingMore Than Points: Architecting Engagement Through Game Design Thinking
More Than Points: Architecting Engagement Through Game Design Thinking
 
Asians are virtual, what about us
Asians are virtual, what about usAsians are virtual, what about us
Asians are virtual, what about us
 

Viewers also liked

Increasing Social Visibility, an Ann Arbor SPARK Presentation
Increasing Social Visibility, an Ann Arbor SPARK PresentationIncreasing Social Visibility, an Ann Arbor SPARK Presentation
Increasing Social Visibility, an Ann Arbor SPARK PresentationEnlighten
 
Giving the right amount of shits (1)
Giving the right amount of shits (1)Giving the right amount of shits (1)
Giving the right amount of shits (1)Marti Gukeisen
 
Lifelong Learning in UX
Lifelong Learning in UXLifelong Learning in UX
Lifelong Learning in UXMegan Schwarz
 
Information as the Atomic Level of Storytelling
Information as the Atomic Level of StorytellingInformation as the Atomic Level of Storytelling
Information as the Atomic Level of StorytellingKrysta Stone
 
2015 Upload Campaigns Calendar - SlideShare
2015 Upload Campaigns Calendar - SlideShare2015 Upload Campaigns Calendar - SlideShare
2015 Upload Campaigns Calendar - SlideShareSlideShare
 
What to Upload to SlideShare
What to Upload to SlideShareWhat to Upload to SlideShare
What to Upload to SlideShareSlideShare
 
Getting Started With SlideShare
Getting Started With SlideShareGetting Started With SlideShare
Getting Started With SlideShareSlideShare
 

Viewers also liked (7)

Increasing Social Visibility, an Ann Arbor SPARK Presentation
Increasing Social Visibility, an Ann Arbor SPARK PresentationIncreasing Social Visibility, an Ann Arbor SPARK Presentation
Increasing Social Visibility, an Ann Arbor SPARK Presentation
 
Giving the right amount of shits (1)
Giving the right amount of shits (1)Giving the right amount of shits (1)
Giving the right amount of shits (1)
 
Lifelong Learning in UX
Lifelong Learning in UXLifelong Learning in UX
Lifelong Learning in UX
 
Information as the Atomic Level of Storytelling
Information as the Atomic Level of StorytellingInformation as the Atomic Level of Storytelling
Information as the Atomic Level of Storytelling
 
2015 Upload Campaigns Calendar - SlideShare
2015 Upload Campaigns Calendar - SlideShare2015 Upload Campaigns Calendar - SlideShare
2015 Upload Campaigns Calendar - SlideShare
 
What to Upload to SlideShare
What to Upload to SlideShareWhat to Upload to SlideShare
What to Upload to SlideShare
 
Getting Started With SlideShare
Getting Started With SlideShareGetting Started With SlideShare
Getting Started With SlideShare
 

Similar to UX for a Mobile Age Audience

Film's Cool presentation Digital Strategy
Film's Cool presentation Digital StrategyFilm's Cool presentation Digital Strategy
Film's Cool presentation Digital Strategystoliros
 
GHAMAS Design Principles
GHAMAS Design PrinciplesGHAMAS Design Principles
GHAMAS Design PrinciplesMichael Rawlins
 
Usability and User Experience Training Seminar
Usability and User Experience Training SeminarUsability and User Experience Training Seminar
Usability and User Experience Training Seminarlabecvar
 
A Developer’s Guide to Interaction and Interface Design
A Developer’s Guide to Interaction and Interface DesignA Developer’s Guide to Interaction and Interface Design
A Developer’s Guide to Interaction and Interface DesignHoltstrom
 
How design decisions affect user performance
How design decisions affect user performanceHow design decisions affect user performance
How design decisions affect user performanceRachna Mittal
 
Human Computer Interaction: Lecture 2: Interaction Design
Human Computer Interaction: Lecture 2: Interaction DesignHuman Computer Interaction: Lecture 2: Interaction Design
Human Computer Interaction: Lecture 2: Interaction DesignSazzadHossain764310
 
Implementing Modernization by Trevor Perry
Implementing Modernization by Trevor PerryImplementing Modernization by Trevor Perry
Implementing Modernization by Trevor PerryFresche Solutions
 
Ux Meets Code Concepting
Ux Meets Code ConceptingUx Meets Code Concepting
Ux Meets Code ConceptingArabella David
 
24 Hours of UX - Agile + UX: Good, Bad, Ugly
24 Hours of UX - Agile + UX: Good, Bad, Ugly24 Hours of UX - Agile + UX: Good, Bad, Ugly
24 Hours of UX - Agile + UX: Good, Bad, UglyJoshua Randall
 
Mobile ux and usability measurement webinar-ppt-xbo soft
Mobile ux and usability measurement webinar-ppt-xbo softMobile ux and usability measurement webinar-ppt-xbo soft
Mobile ux and usability measurement webinar-ppt-xbo softXBOSoft
 
Understanding Information Architecture
Understanding Information ArchitectureUnderstanding Information Architecture
Understanding Information ArchitectureAbby Covert
 
CIS375 Interaction Designs Chapter2
CIS375 Interaction Designs Chapter2CIS375 Interaction Designs Chapter2
CIS375 Interaction Designs Chapter2Dr. Ahmed Al Zaidy
 
Design Research (is not Market Research)
Design Research (is not Market Research)Design Research (is not Market Research)
Design Research (is not Market Research)Joyce Chou
 
Executing for Every Screen: Build, launch and sustain products for your custo...
Executing for Every Screen: Build, launch and sustain products for your custo...Executing for Every Screen: Build, launch and sustain products for your custo...
Executing for Every Screen: Build, launch and sustain products for your custo...Steven Hoober
 
What I learned at Cooper U about Design Research
What I learned at Cooper U about Design ResearchWhat I learned at Cooper U about Design Research
What I learned at Cooper U about Design ResearchSolutionStream
 
Wanted: Mobile Dev with 40 Years Experience
Wanted: Mobile Dev with 40 Years ExperienceWanted: Mobile Dev with 40 Years Experience
Wanted: Mobile Dev with 40 Years Experiencemattmayatadobe
 
UofC Digital Marketing Lecture 3
UofC Digital Marketing Lecture 3UofC Digital Marketing Lecture 3
UofC Digital Marketing Lecture 3John Hutchings
 

Similar to UX for a Mobile Age Audience (20)

Film's Cool presentation Digital Strategy
Film's Cool presentation Digital StrategyFilm's Cool presentation Digital Strategy
Film's Cool presentation Digital Strategy
 
GHAMAS Design Principles
GHAMAS Design PrinciplesGHAMAS Design Principles
GHAMAS Design Principles
 
Usability and User Experience Training Seminar
Usability and User Experience Training SeminarUsability and User Experience Training Seminar
Usability and User Experience Training Seminar
 
Responsive Design is Dead
Responsive Design is DeadResponsive Design is Dead
Responsive Design is Dead
 
A Developer’s Guide to Interaction and Interface Design
A Developer’s Guide to Interaction and Interface DesignA Developer’s Guide to Interaction and Interface Design
A Developer’s Guide to Interaction and Interface Design
 
How design decisions affect user performance
How design decisions affect user performanceHow design decisions affect user performance
How design decisions affect user performance
 
Human Computer Interaction: Lecture 2: Interaction Design
Human Computer Interaction: Lecture 2: Interaction DesignHuman Computer Interaction: Lecture 2: Interaction Design
Human Computer Interaction: Lecture 2: Interaction Design
 
Implementing Modernization by Trevor Perry
Implementing Modernization by Trevor PerryImplementing Modernization by Trevor Perry
Implementing Modernization by Trevor Perry
 
Ux Meets Code Concepting
Ux Meets Code ConceptingUx Meets Code Concepting
Ux Meets Code Concepting
 
體驗劇場_1050503_W11_原型設計_楊政達
體驗劇場_1050503_W11_原型設計_楊政達體驗劇場_1050503_W11_原型設計_楊政達
體驗劇場_1050503_W11_原型設計_楊政達
 
24 Hours of UX - Agile + UX: Good, Bad, Ugly
24 Hours of UX - Agile + UX: Good, Bad, Ugly24 Hours of UX - Agile + UX: Good, Bad, Ugly
24 Hours of UX - Agile + UX: Good, Bad, Ugly
 
Mobile ux and usability measurement webinar-ppt-xbo soft
Mobile ux and usability measurement webinar-ppt-xbo softMobile ux and usability measurement webinar-ppt-xbo soft
Mobile ux and usability measurement webinar-ppt-xbo soft
 
Understanding Information Architecture
Understanding Information ArchitectureUnderstanding Information Architecture
Understanding Information Architecture
 
CIS375 Interaction Designs Chapter2
CIS375 Interaction Designs Chapter2CIS375 Interaction Designs Chapter2
CIS375 Interaction Designs Chapter2
 
Intro Design Principles
Intro Design PrinciplesIntro Design Principles
Intro Design Principles
 
Design Research (is not Market Research)
Design Research (is not Market Research)Design Research (is not Market Research)
Design Research (is not Market Research)
 
Executing for Every Screen: Build, launch and sustain products for your custo...
Executing for Every Screen: Build, launch and sustain products for your custo...Executing for Every Screen: Build, launch and sustain products for your custo...
Executing for Every Screen: Build, launch and sustain products for your custo...
 
What I learned at Cooper U about Design Research
What I learned at Cooper U about Design ResearchWhat I learned at Cooper U about Design Research
What I learned at Cooper U about Design Research
 
Wanted: Mobile Dev with 40 Years Experience
Wanted: Mobile Dev with 40 Years ExperienceWanted: Mobile Dev with 40 Years Experience
Wanted: Mobile Dev with 40 Years Experience
 
UofC Digital Marketing Lecture 3
UofC Digital Marketing Lecture 3UofC Digital Marketing Lecture 3
UofC Digital Marketing Lecture 3
 

Recently uploaded

办理学位证(SFU证书)西蒙弗雷泽大学毕业证成绩单原版一比一
办理学位证(SFU证书)西蒙弗雷泽大学毕业证成绩单原版一比一办理学位证(SFU证书)西蒙弗雷泽大学毕业证成绩单原版一比一
办理学位证(SFU证书)西蒙弗雷泽大学毕业证成绩单原版一比一F dds
 
Untitled presedddddddddddddddddntation (1).pptx
Untitled presedddddddddddddddddntation (1).pptxUntitled presedddddddddddddddddntation (1).pptx
Untitled presedddddddddddddddddntation (1).pptxmapanig881
 
group_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdfgroup_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdfneelspinoy
 
cda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis pptcda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis pptMaryamAfzal41
 
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,Aginakm1
 
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10uasjlagroup
 
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCRdollysharma2066
 
General Knowledge Quiz Game C++ CODE.pptx
General Knowledge Quiz Game C++ CODE.pptxGeneral Knowledge Quiz Game C++ CODE.pptx
General Knowledge Quiz Game C++ CODE.pptxmarckustrevion
 
Dubai Calls Girl Tapes O525547819 Real Tapes Escort Services Dubai
Dubai Calls Girl Tapes O525547819 Real Tapes Escort Services DubaiDubai Calls Girl Tapes O525547819 Real Tapes Escort Services Dubai
Dubai Calls Girl Tapes O525547819 Real Tapes Escort Services Dubaikojalkojal131
 
FiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdfFiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdfShivakumar Viswanathan
 
306MTAMount UCLA University Bachelor's Diploma in Social Media
306MTAMount UCLA University Bachelor's Diploma in Social Media306MTAMount UCLA University Bachelor's Diploma in Social Media
306MTAMount UCLA University Bachelor's Diploma in Social MediaD SSS
 
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degreeyuu sss
 
毕业文凭制作#回国入职#diploma#degree美国威斯康星大学欧克莱尔分校毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#...
毕业文凭制作#回国入职#diploma#degree美国威斯康星大学欧克莱尔分校毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#...毕业文凭制作#回国入职#diploma#degree美国威斯康星大学欧克莱尔分校毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#...
毕业文凭制作#回国入职#diploma#degree美国威斯康星大学欧克莱尔分校毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#...ttt fff
 
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一Fi sss
 
1比1办理美国北卡罗莱纳州立大学毕业证成绩单pdf电子版制作修改
1比1办理美国北卡罗莱纳州立大学毕业证成绩单pdf电子版制作修改1比1办理美国北卡罗莱纳州立大学毕业证成绩单pdf电子版制作修改
1比1办理美国北卡罗莱纳州立大学毕业证成绩单pdf电子版制作修改yuu sss
 
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degreeyuu sss
 
Passbook project document_april_21__.pdf
Passbook project document_april_21__.pdfPassbook project document_april_21__.pdf
Passbook project document_april_21__.pdfvaibhavkanaujia
 
办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一
办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一
办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一Fi L
 
办理澳大利亚国立大学毕业证ANU毕业证留信学历认证
办理澳大利亚国立大学毕业证ANU毕业证留信学历认证办理澳大利亚国立大学毕业证ANU毕业证留信学历认证
办理澳大利亚国立大学毕业证ANU毕业证留信学历认证jdkhjh
 

Recently uploaded (20)

办理学位证(SFU证书)西蒙弗雷泽大学毕业证成绩单原版一比一
办理学位证(SFU证书)西蒙弗雷泽大学毕业证成绩单原版一比一办理学位证(SFU证书)西蒙弗雷泽大学毕业证成绩单原版一比一
办理学位证(SFU证书)西蒙弗雷泽大学毕业证成绩单原版一比一
 
Untitled presedddddddddddddddddntation (1).pptx
Untitled presedddddddddddddddddntation (1).pptxUntitled presedddddddddddddddddntation (1).pptx
Untitled presedddddddddddddddddntation (1).pptx
 
group_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdfgroup_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdf
 
cda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis pptcda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis ppt
 
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
 
Call Girls in Pratap Nagar, 9953056974 Escort Service
Call Girls in Pratap Nagar,  9953056974 Escort ServiceCall Girls in Pratap Nagar,  9953056974 Escort Service
Call Girls in Pratap Nagar, 9953056974 Escort Service
 
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10
 
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR
8377877756 Full Enjoy @24/7 Call Girls in Nirman Vihar Delhi NCR
 
General Knowledge Quiz Game C++ CODE.pptx
General Knowledge Quiz Game C++ CODE.pptxGeneral Knowledge Quiz Game C++ CODE.pptx
General Knowledge Quiz Game C++ CODE.pptx
 
Dubai Calls Girl Tapes O525547819 Real Tapes Escort Services Dubai
Dubai Calls Girl Tapes O525547819 Real Tapes Escort Services DubaiDubai Calls Girl Tapes O525547819 Real Tapes Escort Services Dubai
Dubai Calls Girl Tapes O525547819 Real Tapes Escort Services Dubai
 
FiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdfFiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdf
 
306MTAMount UCLA University Bachelor's Diploma in Social Media
306MTAMount UCLA University Bachelor's Diploma in Social Media306MTAMount UCLA University Bachelor's Diploma in Social Media
306MTAMount UCLA University Bachelor's Diploma in Social Media
 
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
 
毕业文凭制作#回国入职#diploma#degree美国威斯康星大学欧克莱尔分校毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#...
毕业文凭制作#回国入职#diploma#degree美国威斯康星大学欧克莱尔分校毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#...毕业文凭制作#回国入职#diploma#degree美国威斯康星大学欧克莱尔分校毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#...
毕业文凭制作#回国入职#diploma#degree美国威斯康星大学欧克莱尔分校毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#...
 
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
 
1比1办理美国北卡罗莱纳州立大学毕业证成绩单pdf电子版制作修改
1比1办理美国北卡罗莱纳州立大学毕业证成绩单pdf电子版制作修改1比1办理美国北卡罗莱纳州立大学毕业证成绩单pdf电子版制作修改
1比1办理美国北卡罗莱纳州立大学毕业证成绩单pdf电子版制作修改
 
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
原版美国亚利桑那州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
 
Passbook project document_april_21__.pdf
Passbook project document_april_21__.pdfPassbook project document_april_21__.pdf
Passbook project document_april_21__.pdf
 
办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一
办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一
办理学位证(TheAuckland证书)新西兰奥克兰大学毕业证成绩单原版一比一
 
办理澳大利亚国立大学毕业证ANU毕业证留信学历认证
办理澳大利亚国立大学毕业证ANU毕业证留信学历认证办理澳大利亚国立大学毕业证ANU毕业证留信学历认证
办理澳大利亚国立大学毕业证ANU毕业证留信学历认证
 

UX for a Mobile Age Audience

  • 1. Pure Digital Since 1983 UX for a Mobile-Age Audience Krysta Stone @krystastone Marti Gukeisen @UXmarti
  • 2. Intro | We Have Entered the “Mobile Age” • Over 95% of the US population owns a mobile phone • Nearly 25% of the US population currently owns a smartphone. – It’s projected that by 2014, over 40% of all mobile phones will be smartphones • Nearly 10% of the US population currently owns a tablet – The number of tablet users is projected to more than double in 2011, and then double again in 2012 2
  • 3. Outline • Intro • Influence of iPad in UX • The Mobile vs. Desktop War is Over • Omniscient Innovation • It Shouldn’t Feel Like Homework • What Does it All Mean? 3
  • 4. Pure Digital Since 1983 Influence of iPad in UX
  • 5. Influence of iPad in UX | What are they? • Ease of Use • Metaphor • Discoverability • Entertainment • Touch Screen 5
  • 6. Ease of Use | What is it? Apple emphasizes a simple, clean interface 6
  • 7. Ease of Use | In comparison PC emphasizes multitasking & feature explosion. this slide 7
  • 8. Ease of Use | Influence • More focused on one task at a time • Reduce feature assault • Reduce competition for attention on the screen 8
  • 9. Metaphor | What is it? Using something to represent something it is not. what it is what it means on a screen 9
  • 10. Metaphor | Astronomical Example • Music player that uses images & concepts from astronomy to visualize music collections. Sun = Artist Planet = Album Moon = Song 10
  • 11. Metaphor | Old lessons for new design This is too far  Party like it’s… 11
  • 12. Metaphor | This spectrum is a metaphor Given the context of a project, what is appropriate? Goal Completion Efficiency Less Time & Effort to Interpret Literal Abstracted Used More Metaphor Used Less More Time & Effort to Interpret Entertainment Play 12
  • 13. Metaphor | So why was this okay? • iPad sets ‘playful’ as an expectation • Object is entertainment, not goal completion • Basics are still presented in a conventional way 13
  • 14. Discoverability | It’s evolving “Discoverability: the ability for a user of a design to locate something that they need, in order to complete a certain task.” • Discoverability is shifting – it’s becoming part of the entertainment of the experience and that’s ok! • Conventions and standards for iPad don’t exist yet, but they’re emerging • Is it (finally) time to let go of the ‘traditional’ web nav design? (so 1996!) Don’t forget: • Users still need to be able to accomplish tasks • Leverage mental models! • Make functions discoverable by users “just in time.” 14
  • 15. Entertainment | But what does it DO? • Purpose and functionality aren’t always the primary objective • Explore the capabilities of the medium to create a delightful experience • Right place at the right time: Don’t abandon your common sense. • What is the core purpose of the experience? Is there a way to make it more entertaining? 15
  • 16. Touchscreen | Tips • Be ready for multiple orientations • Be ready to start…and to stop • Keep the focus on the primary task • Use simplified hierarchies • Think gestures, not clicks • Make targets at least 44x44 points • Move beyond the linear • Create opportunities to collaborate 16
  • 17. Example | Designing for Touchscreens The Fantastic Flying Books of Mr. Morris Lessmore 17
  • 18. Example | Designing for Touchscreens The Fantastic Flying Books of Mr. Morris Lessmore 18
  • 19. Pure Digital Since 1983 The Mobile vs. Desktop War is Over
  • 20. It was a tie | Cross-platform is IN • It’s time to catch up to mobile user expectations. • Stop thinking about a separate sites for “fixed Internet” (i.e. desktop), mobile and tablet experiences (unless there’s a specific need). • Think about how a single user experience design can meet the needs of many devices. • Consumers want consistent, or even better, contextually relevant experiences. • “Make it work on my device, make it cool & delightful and give me what I want, when I need it.” 20
  • 21. Responsive Design | What is it? • One way to keep up with all of the devices/resolutions on the market • Applies an architectural philosophy to digital design, that structures should respond to the environment and people in them • Designs should respond to a user’s behavior and environment based on screen size (resolution), platform and orientation • Fluid grids, flexible images and media queries • Eliminates the need for a different design and development phase for each new gadget on the market 21
  • 22. Responsive Design | Examples Sweet Hat Club http://sweethatclub.org/ 22
  • 23. Responsive Design | Examples Food Sense http://foodsense.is/ Many more examples at http://mediaqueri.es/ 23
  • 24. Pure Digital Since 1983 Omniscient Innovation
  • 25. Contextual Awareness | what is it? Contextual awareness is the idea that things that are “aware” of the context around them and behave differently if their environment changes. 25
  • 26. Contextual Awareness | Using these… • GPS • Twitter, et al • Accelerometer • Facebook, Google+ et al • Camera • Foursquare, et al • Bluetooth • RFID • Infrared • API’s • Google maps • Google Street view 26
  • 27. Contextual Awareness | we might know… • Location • What places are nearby • Time of Day • What devices are nearby • Temperature • What objects are nearby • What can be seen nearby • Device Orientation • Device Movement • Device Acceleration • Device Speed 27
  • 28. Contextual Awareness | we might know… • Who is using the device • User data • User Mega Meta • Aggregate data – gender, status, likes, • Data over time / trending employer, birthday, etc. • Everything about everyone • Searches • Tweets • Friends • Financial information 28
  • 29. Contextual Awareness | Location + Orientation 29
  • 30. Contextual Awareness | Street View + Location + Camera 30
  • 31. Contextual Awareness | why this matters • New opportunities to leverage creatively • Bring mobile-magic ideas to your clients • Consider influence of mobile-mania on the immobile web experience and expectations 31
  • 32. Pure Digital Since 1983 It Shouldn’t Feel Like Homework
  • 33. Gamification | What is it? You can apply the basic elements that make games fun and engaging to things that typically aren't considered a game. -Gamification.org 33
  • 34. Gamification | Game Mechanics • The processes by which games work • Gamification applies game mechanics to situations other than games • Game mechanics used well can help encourage engagement, active learning, and loyalty • Gamification and mobile work well together 34
  • 35. Gamification | Checking In Gowalla scvngr Foursquare We & Co 35
  • 37. Gamification | Bartle’s Personality Types Richard Bartle’s gamer personality types are a way of thinking about how different people approach games. They can be helpful to think about when developing other user experiences as well. Achievers – collect markers of accomplishment, such as points Explorers – enjoy the world of the game more than game objectives Socializers – prefer to play with others—games are about the social experience Killers – focus on competition 37
  • 38. Gamification | Applying to UX How do gamification and gaming personality types influence the UX process? • Consider how gamification might apply to your context – Can you make your application more game-like? – Consider how to make tasks appeal to the various gaming personalities • Incorporate personality types into personas 38
  • 39. Pure Digital Since 1983 What Does It All Mean?
  • 40. Considerations | For your mind to munch on • Moderation in all things – Find the right balance given the context [ play / metaphor / discovery / gamification / simplicity / efficiency / familiarity / ease of use ] • Conventions don’t really exist yet for mobile/touch • This stuff SCREAMS interdisciplinary 40
  • 41. Remember | How people really use technology 41
  • 42. DISCUSS Krysta Stone Marti Gukeisen Enlighten.com/blog @krystastone @Uxmarti @EnlightenAgency kstone@enlighten.com mgukeisen@enlighten.com info@enlighten.com 42

Editor's Notes

  1. Fitbit.com