SlideShare uma empresa Scribd logo
1 de 45
Baixar para ler offline
Copyright ©2012 Moneytree KK
CREATING A GREAT
MOBILE EXPERIENCE
          Paul Chapman
   iOS Meetup Tokyo, August 2012




                                   www.moneytree.jp
       MONEYTREE
ABOUT ME




                                     Copyright ©2012 Moneytree KK
    20 years dreaming software
    Mobile software coder/designer
    Lectured in mobile development
    Founder of Moneytree KK




                                     www.moneytree.jp
TODAY'S ROADMAP




                                      Copyright ©2012 Moneytree KK
1.    What Do You Want to Make?
2.    Why is UX Difficult?
3.    Understand Mobile Constraints
4.    Mobile UX-UI Toolbox
5.    Our UX Development Process




                                      www.moneytree.jp
JARGON




                   User vs. Guest




www.moneytree.jp                    Copyright ©2012 Moneytree KK
What Do You
                   Want to Make?




www.moneytree.jp                   Copyright ©2012 Moneytree KK
WHAT'S YOUR APP-JECTIVE?




                               Copyright ©2012 Moneytree KK
       CREATION
   CONSUMPTION
  COMMUNICATION
    ROLE PLAYING




                               www.moneytree.jp
    Inspiration: Bret Victor
HOW YOU SEE YOUR APP




                                                             Copyright ©2012 Moneytree KK
                                                             www.moneytree.jp
http://yvonnelao.com/2011/04/28/mobile-app-user-flow-chart/
IS THIS HOW OTHERS SEE YOUR APP?




                                              Copyright ©2012 Moneytree KK
                                              www.moneytree.jp
 http://www.inkblotmazes.com/top-mazes.html
Why is UX Difficult?




www.moneytree.jp                        Copyright ©2012 Moneytree KK
WIKIPEDIA DEFINITION




                                                 Copyright ©2012 Moneytree KK
User experience (UX) is the way a person
feels about using a product, system or service
http://en.wikipedia.org/wiki/User_experience




                                                 www.moneytree.jp
WHAT PEOPLE KNOW ABOUT UX




                            Copyright ©2012 Moneytree KK
     EASE OF USE
       USABILITY
      ENJOYMENT




                            www.moneytree.jp
WHAT PEOPLE KNOW ABOUT UX




                   Not Objective!




www.moneytree.jp              Copyright ©2012 Moneytree KK
GREAT UX




                         Copyright ©2012 Moneytree KK
IS LIKE GREAT SEX
     Everyone
     Wants It

    Not Everyone
       Gets It


      Everyone's
     Definition is




                         www.moneytree.jp
   A Little Dif ferent
UX IS Not An Activity




                            Copyright ©2012 Moneytree KK
You Cannot "Make"
    Great UX




                            www.moneytree.jp
UX IS Not An Activity




                             Copyright ©2012 Moneytree KK
Great UX is a Goal,
  a Destination




                             www.moneytree.jp
GREAT UX RESULTS FROM




                                    Copyright ©2012 Moneytree KK
WELL EXECUTED & TESTED INTERFACES
  RELIABLE & RESPONSIVE SYSTEMS
    HELPFUL & TIMELY SUPPORT
  ONGOING PRODUCT IMPROVEMENT




                                    www.moneytree.jp
A BASIS FOR UNDERSTANDING UX




                                    Copyright ©2012 Moneytree KK
Objective or Subjective?




                                    www.moneytree.jp
OBJECTIVE




                                             Copyright ©2012 Moneytree KK
                                             www.moneytree.jp
http://www.youtube.com/watch?v=Ahg6qcgoay4
SUBJECTIVE

                                 Japanese UI




  Y U So Dense?


www.moneytree.jp   Copyright ©2012 Moneytree KK
WHO IS REALLY GOOD AT UX?




                                 Copyright ©2012 Moneytree KK
Design + Development
Development + Design




                                 www.moneytree.jp
WHAT'D HE SAY?




                                  Copyright ©2012 Moneytree KK
    UX Not Well Understood
    It's Not an Activity
    Objective or Subjective?
    Who is Really Good at UX?




                                  www.moneytree.jp
Understanding
                   Mobile Constraints




www.moneytree.jp                        Copyright ©2012 Moneytree KK
DEVICE CONSTRAINTS




                     Copyright ©2012 Moneytree KK
   FORM FACTOR
     BATTERY
    CPU & RAM
NETWORK QUALITY
     SENSORS
  INPUT METHOD




                     www.moneytree.jp
PARADIGM CONSTRAINTS




                        Copyright ©2012 Moneytree KK
   SHORT SESSIONS
SNACKING NOT FEASTING
 INTERRUPTED USAGE
   PHONE CAN RING




                        www.moneytree.jp
CONTEXTUAL CONSTRAINTS




                         Copyright ©2012 Moneytree KK
MOVING VS Stationary
 INDOOR VS OUTDOOR
  LIGHTING & NOISE
    DISTRACTIONS




                         www.moneytree.jp
HUMAN CONSTRAINTS




                                                                                 Copyright ©2012 Moneytree KK
                          LIMITED MEMORY
                        CHANGE BLINDNESS
                         CAN'T MULTI-TASK
                               IMPATIENT
                        CRAVE STIMULATION




                                                                                 www.moneytree.jp
http://www.businessinsider.com/100-things-you-should-know-about-people-2010-11
WHAT'D HE SAY?




                                 Copyright ©2012 Moneytree KK
    Device Constraints
    Paradigm Constraints
    Contextual Constraints
    Human Constraints




                                 www.moneytree.jp
Mobile UX-UI Toolbox




www.moneytree.jp                          Copyright ©2012 Moneytree KK
CONCEPT SKETCHES




                                                                 Copyright ©2012 Moneytree KK
                                                                 www.moneytree.jp
http://www.behance.net/gallery/Mobile-media-app-concept/795914
CONCEPT SKETCHES




                                                                                    Copyright ©2012 Moneytree KK
                                                                                    www.moneytree.jp
http://designreviver.com/inspiration/a-selection-of-mobile-ui-wireframe-sketches/
PAPER MOCKUPS




                                                                             Copyright ©2012 Moneytree KK
                                                                             www.moneytree.jp
http://www.lifehacker.com.au/2012/07/how-twitter-still-found-paper-useful/
Moneytree
                                                  TOUCHABLE PROTOTYPES




www.moneytree.jp   Copyright ©2012 Moneytree KK
WIREFRAMES - LAYOUT




                                                                                    Copyright ©2012 Moneytree KK
                                                                                    www.moneytree.jp
http://designreviver.com/inspiration/a-selection-of-mobile-ui-wireframe-sketches/
WIREFRAMES - BEHAVIOUR




                             Copyright ©2012 Moneytree KK
                             www.moneytree.jp
  Moneytree / Hands Memory
WIREFRAMES - FLOWS




                                                                                    Copyright ©2012 Moneytree KK
                                                                                    www.moneytree.jp
http://designreviver.com/inspiration/a-selection-of-mobile-ui-wireframe-sketches/
DIGITAL WIREFRAMES




                                                                  Copyright ©2012 Moneytree KK
                                                                  www.moneytree.jp
http://mcrubioux.wordpress.com/2011/03/09/mobile-app-ux-design/
WHAT IS YOUR INTENT?




                           Copyright ©2012 Moneytree KK
 HOW SHOULD THEY FEEL?
WHERE SHOULD THEY LOOK?
  WHAT IS IMPORTANT?
  WHAT IS USED OFTEN?
 HOW DO I FEEL USING IT?
WHAT MADE ME FEEL GOOD?




                           www.moneytree.jp
USABILITY TACTICS




                            Copyright ©2012 Moneytree KK
MINIMIZE NAVIGATION DEPTH
  COUNT NUMBER OF TAPS
     THUMB FRIENDLY
    INSTANT FEEDBACK
   FEWER OPTIONS (3-4)
DO ONE THING REALLY WELL
Re-USE LEARNT BEHAVIOURS




                            www.moneytree.jp
WHAT'D HE SAY?




                                  Copyright ©2012 Moneytree KK
    Concept Sketches
    Paper Mockups
    Touchable Prototypes
    Wireframes
    Digital Wireframes
    What Is Your Intent?




                                  www.moneytree.jp
    Usability Tactics
Our UX
                   Development Process




www.moneytree.jp                         Copyright ©2012 Moneytree KK
UX PROCESS FLOW - PLANNING




                                                          Copyright ©2012 Moneytree KK
PROCESS STEP                        STAGE
Brainstorm / Research / Discuss     IDEATION

Concept Sketches

Develop Persona (2-3)               CONCEPT DEVELOPMENT

Focus Problems/Questions (1-3)

Define Your MVP

Paper Mocks / Touchable Prototype

Paper Wireframes (Formal)




                                                          www.moneytree.jp
Review / Discuss
UX PROCESS FLOW - EXECUTION




                                                           Copyright ©2012 Moneytree KK
PROCESS STEP                            STAGE
Digital Wireframes                      ASSET CREATION

    w Screen Design

    w Behaviour Design

UI Implementation                       PROGRAMMING

    w Animations

    w Controls

Internal UI Testing




                                                           www.moneytree.jp
Production Asset Creation               DESIGN FEEDBACK

Beta Testing                            END OF ITERATION
TODAY'S ROADMAP




                                      Copyright ©2012 Moneytree KK
1.    What Do You Want to Make?
2.    Why is UX Difficult?
3.    Understand Mobile Constraints
4.    Mobile UX-UI Toolbox
5.    Our UX Development Process




                                      www.moneytree.jp
MY PARTING THOUGHT




                             Copyright ©2012 Moneytree KK
 You Can't "Make" Great UX
You Can Only Make UX Great




                             www.moneytree.jp
CONTACT ME




                                      Copyright ©2012 Moneytree KK
    Paul Chapman
    pchapman<at> moneytree <dot> jp
    @pchap10k




                                      www.moneytree.jp

Mais conteúdo relacionado

Destaque

Internationaliser son app pour réussir: l'exemple de 94 Secondes
Internationaliser son app pour réussir: l'exemple de 94 SecondesInternationaliser son app pour réussir: l'exemple de 94 Secondes
Internationaliser son app pour réussir: l'exemple de 94 SecondesBenjamin Faure
 
Smart contents in multi screen
Smart contents in multi screenSmart contents in multi screen
Smart contents in multi screenSeungyul Kim
 
Classement de la fréquentation des applications mobile OJD - Avril 2013
Classement de la fréquentation des applications mobile OJD - Avril 2013Classement de la fréquentation des applications mobile OJD - Avril 2013
Classement de la fréquentation des applications mobile OJD - Avril 2013Romain Fonnier
 
[refreshaustin] Adaptive Images in Responsive Web Design
[refreshaustin] Adaptive Images in Responsive Web Design[refreshaustin] Adaptive Images in Responsive Web Design
[refreshaustin] Adaptive Images in Responsive Web DesignChristopher Schmitt
 
Mobile Marketing Association - Mobile et tablettes 2nd écran de la TV
Mobile Marketing Association - Mobile et tablettes 2nd écran de la TVMobile Marketing Association - Mobile et tablettes 2nd écran de la TV
Mobile Marketing Association - Mobile et tablettes 2nd écran de la TVPascal Dasseux
 
What is-Mobile-Marketing-mehmettanlak.com
What is-Mobile-Marketing-mehmettanlak.comWhat is-Mobile-Marketing-mehmettanlak.com
What is-Mobile-Marketing-mehmettanlak.comUniversity
 
Spéciale Paiement La French Mobile Juin 2012
Spéciale Paiement La French Mobile Juin 2012Spéciale Paiement La French Mobile Juin 2012
Spéciale Paiement La French Mobile Juin 2012servicesmobiles.fr
 
Device Fragmentation 2011 / Metrics of the Mobile Web
Device Fragmentation 2011 / Metrics of the Mobile WebDevice Fragmentation 2011 / Metrics of the Mobile Web
Device Fragmentation 2011 / Metrics of the Mobile WebAvenga Germany GmbH
 
Référencement Mobile - Anji Ismail - SEO Campus 2010
Référencement Mobile - Anji Ismail - SEO Campus 2010Référencement Mobile - Anji Ismail - SEO Campus 2010
Référencement Mobile - Anji Ismail - SEO Campus 2010SEO CAMP
 
L’iPad à l’école : usages, avantages et défis
L’iPad à l’école : usages,  avantages et défisL’iPad à l’école : usages,  avantages et défis
L’iPad à l’école : usages, avantages et défisnawras.univers
 
SEO for Mobile Apps
SEO for Mobile AppsSEO for Mobile Apps
SEO for Mobile AppsAbdul Malick
 
The web you were used to is gone. Architecture and strategy for your content.
The web you were used to is gone. Architecture and strategy for your content.The web you were used to is gone. Architecture and strategy for your content.
The web you were used to is gone. Architecture and strategy for your content.Alberta Soranzo
 

Destaque (14)

Internationaliser son app pour réussir: l'exemple de 94 Secondes
Internationaliser son app pour réussir: l'exemple de 94 SecondesInternationaliser son app pour réussir: l'exemple de 94 Secondes
Internationaliser son app pour réussir: l'exemple de 94 Secondes
 
Smart contents in multi screen
Smart contents in multi screenSmart contents in multi screen
Smart contents in multi screen
 
Classement de la fréquentation des applications mobile OJD - Avril 2013
Classement de la fréquentation des applications mobile OJD - Avril 2013Classement de la fréquentation des applications mobile OJD - Avril 2013
Classement de la fréquentation des applications mobile OJD - Avril 2013
 
[refreshaustin] Adaptive Images in Responsive Web Design
[refreshaustin] Adaptive Images in Responsive Web Design[refreshaustin] Adaptive Images in Responsive Web Design
[refreshaustin] Adaptive Images in Responsive Web Design
 
Mobile Marketing Association - Mobile et tablettes 2nd écran de la TV
Mobile Marketing Association - Mobile et tablettes 2nd écran de la TVMobile Marketing Association - Mobile et tablettes 2nd écran de la TV
Mobile Marketing Association - Mobile et tablettes 2nd écran de la TV
 
What is-Mobile-Marketing-mehmettanlak.com
What is-Mobile-Marketing-mehmettanlak.comWhat is-Mobile-Marketing-mehmettanlak.com
What is-Mobile-Marketing-mehmettanlak.com
 
Spéciale Paiement La French Mobile Juin 2012
Spéciale Paiement La French Mobile Juin 2012Spéciale Paiement La French Mobile Juin 2012
Spéciale Paiement La French Mobile Juin 2012
 
Device Fragmentation 2011 / Metrics of the Mobile Web
Device Fragmentation 2011 / Metrics of the Mobile WebDevice Fragmentation 2011 / Metrics of the Mobile Web
Device Fragmentation 2011 / Metrics of the Mobile Web
 
60 apps in 60 mins
60 apps in 60 mins60 apps in 60 mins
60 apps in 60 mins
 
Référencement Mobile - Anji Ismail - SEO Campus 2010
Référencement Mobile - Anji Ismail - SEO Campus 2010Référencement Mobile - Anji Ismail - SEO Campus 2010
Référencement Mobile - Anji Ismail - SEO Campus 2010
 
L’iPad à l’école : usages, avantages et défis
L’iPad à l’école : usages,  avantages et défisL’iPad à l’école : usages,  avantages et défis
L’iPad à l’école : usages, avantages et défis
 
SEO for Mobile Apps
SEO for Mobile AppsSEO for Mobile Apps
SEO for Mobile Apps
 
You can't beat the experience November 2014
You can't beat the experience November 2014You can't beat the experience November 2014
You can't beat the experience November 2014
 
The web you were used to is gone. Architecture and strategy for your content.
The web you were used to is gone. Architecture and strategy for your content.The web you were used to is gone. Architecture and strategy for your content.
The web you were used to is gone. Architecture and strategy for your content.
 

Semelhante a Creating a Great Mobile Experience = iOS Meetup Tokyo Aug 2012

InKnowVision June 2012 HNW Marketing Webinar
InKnowVision June 2012 HNW Marketing WebinarInKnowVision June 2012 HNW Marketing Webinar
InKnowVision June 2012 HNW Marketing WebinarInKnowVision
 
Incubator and startup 2
Incubator and startup 2Incubator and startup 2
Incubator and startup 2Kurio
 
Assimilate or Die - a Real life Transformation Story
Assimilate or Die - a Real life Transformation StoryAssimilate or Die - a Real life Transformation Story
Assimilate or Die - a Real life Transformation StoryCustomXM
 
David Alan Grier - Macotarefas, Microtarefas e Inovação
David Alan Grier - Macotarefas, Microtarefas e InovaçãoDavid Alan Grier - Macotarefas, Microtarefas e Inovação
David Alan Grier - Macotarefas, Microtarefas e InovaçãoMarina Miranda
 
Undaunted: How Credit Unions Can Thrive in the New Financial Services Environ...
Undaunted: How Credit Unions Can Thrive in the New Financial Services Environ...Undaunted: How Credit Unions Can Thrive in the New Financial Services Environ...
Undaunted: How Credit Unions Can Thrive in the New Financial Services Environ...NAFCU Services Corporation
 
HowToManageYourProject
HowToManageYourProjectHowToManageYourProject
HowToManageYourProjectTakahisa Ogawa
 
Share point 2013 webinar november 2012
Share point 2013 webinar november 2012Share point 2013 webinar november 2012
Share point 2013 webinar november 2012Sentri
 
SharePoint 2013 Unveiled webinar 1.24.13
SharePoint 2013 Unveiled webinar 1.24.13SharePoint 2013 Unveiled webinar 1.24.13
SharePoint 2013 Unveiled webinar 1.24.13Sentri
 
Webinar Demand Creation for Content Marketers: From Start to Finish
Webinar Demand Creation for Content Marketers: From Start to FinishWebinar Demand Creation for Content Marketers: From Start to Finish
Webinar Demand Creation for Content Marketers: From Start to FinishContent Marketing World
 
InSequent Overview January 2013 no financials
InSequent Overview January 2013 no financialsInSequent Overview January 2013 no financials
InSequent Overview January 2013 no financialsInSequent
 
EBriks Web Design and Development Approach - EBriks Infotech
EBriks Web Design and Development Approach - EBriks InfotechEBriks Web Design and Development Approach - EBriks Infotech
EBriks Web Design and Development Approach - EBriks Infotechebriksinfotech
 
The Team Workshop Method
The Team Workshop MethodThe Team Workshop Method
The Team Workshop MethodJD Graffam
 
Inspire 1012 - Living in a Material World
Inspire 1012 - Living in a Material WorldInspire 1012 - Living in a Material World
Inspire 1012 - Living in a Material WorldDean Donaldson
 
Inspire 1012- Dean Donaldson-Living in a material world
Inspire 1012- Dean Donaldson-Living in a material world Inspire 1012- Dean Donaldson-Living in a material world
Inspire 1012- Dean Donaldson-Living in a material world MediaMindGlobal
 
SharePoint Logging and Debugging for SP Tech Con
SharePoint Logging and Debugging for SP Tech ConSharePoint Logging and Debugging for SP Tech Con
SharePoint Logging and Debugging for SP Tech ConSentri
 
MasterCard's Jennifer Stalzer presents The Evolution of the Corporate Newsroo...
MasterCard's Jennifer Stalzer presents The Evolution of the Corporate Newsroo...MasterCard's Jennifer Stalzer presents The Evolution of the Corporate Newsroo...
MasterCard's Jennifer Stalzer presents The Evolution of the Corporate Newsroo...Percolate
 
Sentri deck share point logging and debugging
Sentri deck share point logging and debuggingSentri deck share point logging and debugging
Sentri deck share point logging and debuggingSentri
 
Seminar Part Two: Integration or isolation?
Seminar Part Two: Integration or isolation?Seminar Part Two: Integration or isolation?
Seminar Part Two: Integration or isolation?Precedent
 

Semelhante a Creating a Great Mobile Experience = iOS Meetup Tokyo Aug 2012 (20)

InKnowVision June 2012 HNW Marketing Webinar
InKnowVision June 2012 HNW Marketing WebinarInKnowVision June 2012 HNW Marketing Webinar
InKnowVision June 2012 HNW Marketing Webinar
 
Incubator and startup 2
Incubator and startup 2Incubator and startup 2
Incubator and startup 2
 
Assimilate or Die - a Real life Transformation Story
Assimilate or Die - a Real life Transformation StoryAssimilate or Die - a Real life Transformation Story
Assimilate or Die - a Real life Transformation Story
 
David Alan Grier - Macotarefas, Microtarefas e Inovação
David Alan Grier - Macotarefas, Microtarefas e InovaçãoDavid Alan Grier - Macotarefas, Microtarefas e Inovação
David Alan Grier - Macotarefas, Microtarefas e Inovação
 
Undaunted: How Credit Unions Can Thrive in the New Financial Services Environ...
Undaunted: How Credit Unions Can Thrive in the New Financial Services Environ...Undaunted: How Credit Unions Can Thrive in the New Financial Services Environ...
Undaunted: How Credit Unions Can Thrive in the New Financial Services Environ...
 
HowToManageYourProject
HowToManageYourProjectHowToManageYourProject
HowToManageYourProject
 
Share point 2013 webinar november 2012
Share point 2013 webinar november 2012Share point 2013 webinar november 2012
Share point 2013 webinar november 2012
 
SharePoint 2013 Unveiled webinar 1.24.13
SharePoint 2013 Unveiled webinar 1.24.13SharePoint 2013 Unveiled webinar 1.24.13
SharePoint 2013 Unveiled webinar 1.24.13
 
Webinar Demand Creation for Content Marketers: From Start to Finish
Webinar Demand Creation for Content Marketers: From Start to FinishWebinar Demand Creation for Content Marketers: From Start to Finish
Webinar Demand Creation for Content Marketers: From Start to Finish
 
InSequent Overview January 2013 no financials
InSequent Overview January 2013 no financialsInSequent Overview January 2013 no financials
InSequent Overview January 2013 no financials
 
EBriks Web Design and Development Approach - EBriks Infotech
EBriks Web Design and Development Approach - EBriks InfotechEBriks Web Design and Development Approach - EBriks Infotech
EBriks Web Design and Development Approach - EBriks Infotech
 
Cloud Webinar
Cloud WebinarCloud Webinar
Cloud Webinar
 
The Team Workshop Method
The Team Workshop MethodThe Team Workshop Method
The Team Workshop Method
 
Inspire 1012 - Living in a Material World
Inspire 1012 - Living in a Material WorldInspire 1012 - Living in a Material World
Inspire 1012 - Living in a Material World
 
Inspire 1012- Dean Donaldson-Living in a material world
Inspire 1012- Dean Donaldson-Living in a material world Inspire 1012- Dean Donaldson-Living in a material world
Inspire 1012- Dean Donaldson-Living in a material world
 
SharePoint Logging and Debugging for SP Tech Con
SharePoint Logging and Debugging for SP Tech ConSharePoint Logging and Debugging for SP Tech Con
SharePoint Logging and Debugging for SP Tech Con
 
[Nux]05 ux
[Nux]05 ux[Nux]05 ux
[Nux]05 ux
 
MasterCard's Jennifer Stalzer presents The Evolution of the Corporate Newsroo...
MasterCard's Jennifer Stalzer presents The Evolution of the Corporate Newsroo...MasterCard's Jennifer Stalzer presents The Evolution of the Corporate Newsroo...
MasterCard's Jennifer Stalzer presents The Evolution of the Corporate Newsroo...
 
Sentri deck share point logging and debugging
Sentri deck share point logging and debuggingSentri deck share point logging and debugging
Sentri deck share point logging and debugging
 
Seminar Part Two: Integration or isolation?
Seminar Part Two: Integration or isolation?Seminar Part Two: Integration or isolation?
Seminar Part Two: Integration or isolation?
 

Último

UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...UbiTrack UK
 
Artificial Intelligence & SEO Trends for 2024
Artificial Intelligence & SEO Trends for 2024Artificial Intelligence & SEO Trends for 2024
Artificial Intelligence & SEO Trends for 2024D Cloud Solutions
 
Igniting Next Level Productivity with AI-Infused Data Integration Workflows
Igniting Next Level Productivity with AI-Infused Data Integration WorkflowsIgniting Next Level Productivity with AI-Infused Data Integration Workflows
Igniting Next Level Productivity with AI-Infused Data Integration WorkflowsSafe Software
 
COMPUTER 10 Lesson 8 - Building a Website
COMPUTER 10 Lesson 8 - Building a WebsiteCOMPUTER 10 Lesson 8 - Building a Website
COMPUTER 10 Lesson 8 - Building a Websitedgelyza
 
Introduction to Matsuo Laboratory (ENG).pptx
Introduction to Matsuo Laboratory (ENG).pptxIntroduction to Matsuo Laboratory (ENG).pptx
Introduction to Matsuo Laboratory (ENG).pptxMatsuo Lab
 
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...DianaGray10
 
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPA
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPAAnypoint Code Builder , Google Pub sub connector and MuleSoft RPA
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPAshyamraj55
 
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve Decarbonization
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve DecarbonizationUsing IESVE for Loads, Sizing and Heat Pump Modeling to Achieve Decarbonization
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve DecarbonizationIES VE
 
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdfUiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdfDianaGray10
 
Salesforce Miami User Group Event - 1st Quarter 2024
Salesforce Miami User Group Event - 1st Quarter 2024Salesforce Miami User Group Event - 1st Quarter 2024
Salesforce Miami User Group Event - 1st Quarter 2024SkyPlanner
 
AI You Can Trust - Ensuring Success with Data Integrity Webinar
AI You Can Trust - Ensuring Success with Data Integrity WebinarAI You Can Trust - Ensuring Success with Data Integrity Webinar
AI You Can Trust - Ensuring Success with Data Integrity WebinarPrecisely
 
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...Aggregage
 
Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.YounusS2
 
OpenShift Commons Paris - Choose Your Own Observability Adventure
OpenShift Commons Paris - Choose Your Own Observability AdventureOpenShift Commons Paris - Choose Your Own Observability Adventure
OpenShift Commons Paris - Choose Your Own Observability AdventureEric D. Schabell
 
UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1DianaGray10
 
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019IES VE
 
VoIP Service and Marketing using Odoo and Asterisk PBX
VoIP Service and Marketing using Odoo and Asterisk PBXVoIP Service and Marketing using Odoo and Asterisk PBX
VoIP Service and Marketing using Odoo and Asterisk PBXTarek Kalaji
 
AI Fame Rush Review – Virtual Influencer Creation In Just Minutes
AI Fame Rush Review – Virtual Influencer Creation In Just MinutesAI Fame Rush Review – Virtual Influencer Creation In Just Minutes
AI Fame Rush Review – Virtual Influencer Creation In Just MinutesMd Hossain Ali
 
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfJamie (Taka) Wang
 

Último (20)

UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
 
20230104 - machine vision
20230104 - machine vision20230104 - machine vision
20230104 - machine vision
 
Artificial Intelligence & SEO Trends for 2024
Artificial Intelligence & SEO Trends for 2024Artificial Intelligence & SEO Trends for 2024
Artificial Intelligence & SEO Trends for 2024
 
Igniting Next Level Productivity with AI-Infused Data Integration Workflows
Igniting Next Level Productivity with AI-Infused Data Integration WorkflowsIgniting Next Level Productivity with AI-Infused Data Integration Workflows
Igniting Next Level Productivity with AI-Infused Data Integration Workflows
 
COMPUTER 10 Lesson 8 - Building a Website
COMPUTER 10 Lesson 8 - Building a WebsiteCOMPUTER 10 Lesson 8 - Building a Website
COMPUTER 10 Lesson 8 - Building a Website
 
Introduction to Matsuo Laboratory (ENG).pptx
Introduction to Matsuo Laboratory (ENG).pptxIntroduction to Matsuo Laboratory (ENG).pptx
Introduction to Matsuo Laboratory (ENG).pptx
 
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
 
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPA
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPAAnypoint Code Builder , Google Pub sub connector and MuleSoft RPA
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPA
 
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve Decarbonization
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve DecarbonizationUsing IESVE for Loads, Sizing and Heat Pump Modeling to Achieve Decarbonization
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve Decarbonization
 
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdfUiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
 
Salesforce Miami User Group Event - 1st Quarter 2024
Salesforce Miami User Group Event - 1st Quarter 2024Salesforce Miami User Group Event - 1st Quarter 2024
Salesforce Miami User Group Event - 1st Quarter 2024
 
AI You Can Trust - Ensuring Success with Data Integrity Webinar
AI You Can Trust - Ensuring Success with Data Integrity WebinarAI You Can Trust - Ensuring Success with Data Integrity Webinar
AI You Can Trust - Ensuring Success with Data Integrity Webinar
 
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
 
Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.
 
OpenShift Commons Paris - Choose Your Own Observability Adventure
OpenShift Commons Paris - Choose Your Own Observability AdventureOpenShift Commons Paris - Choose Your Own Observability Adventure
OpenShift Commons Paris - Choose Your Own Observability Adventure
 
UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1
 
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019
 
VoIP Service and Marketing using Odoo and Asterisk PBX
VoIP Service and Marketing using Odoo and Asterisk PBXVoIP Service and Marketing using Odoo and Asterisk PBX
VoIP Service and Marketing using Odoo and Asterisk PBX
 
AI Fame Rush Review – Virtual Influencer Creation In Just Minutes
AI Fame Rush Review – Virtual Influencer Creation In Just MinutesAI Fame Rush Review – Virtual Influencer Creation In Just Minutes
AI Fame Rush Review – Virtual Influencer Creation In Just Minutes
 
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
 

Creating a Great Mobile Experience = iOS Meetup Tokyo Aug 2012

  • 1. Copyright ©2012 Moneytree KK CREATING A GREAT MOBILE EXPERIENCE Paul Chapman iOS Meetup Tokyo, August 2012 www.moneytree.jp MONEYTREE
  • 2. ABOUT ME Copyright ©2012 Moneytree KK   20 years dreaming software   Mobile software coder/designer   Lectured in mobile development   Founder of Moneytree KK www.moneytree.jp
  • 3. TODAY'S ROADMAP Copyright ©2012 Moneytree KK 1.  What Do You Want to Make? 2.  Why is UX Difficult? 3.  Understand Mobile Constraints 4.  Mobile UX-UI Toolbox 5.  Our UX Development Process www.moneytree.jp
  • 4. JARGON User vs. Guest www.moneytree.jp Copyright ©2012 Moneytree KK
  • 5. What Do You Want to Make? www.moneytree.jp Copyright ©2012 Moneytree KK
  • 6. WHAT'S YOUR APP-JECTIVE? Copyright ©2012 Moneytree KK CREATION CONSUMPTION COMMUNICATION ROLE PLAYING www.moneytree.jp Inspiration: Bret Victor
  • 7. HOW YOU SEE YOUR APP Copyright ©2012 Moneytree KK www.moneytree.jp http://yvonnelao.com/2011/04/28/mobile-app-user-flow-chart/
  • 8. IS THIS HOW OTHERS SEE YOUR APP? Copyright ©2012 Moneytree KK www.moneytree.jp http://www.inkblotmazes.com/top-mazes.html
  • 9. Why is UX Difficult? www.moneytree.jp Copyright ©2012 Moneytree KK
  • 10. WIKIPEDIA DEFINITION Copyright ©2012 Moneytree KK User experience (UX) is the way a person feels about using a product, system or service http://en.wikipedia.org/wiki/User_experience www.moneytree.jp
  • 11. WHAT PEOPLE KNOW ABOUT UX Copyright ©2012 Moneytree KK EASE OF USE USABILITY ENJOYMENT www.moneytree.jp
  • 12. WHAT PEOPLE KNOW ABOUT UX Not Objective! www.moneytree.jp Copyright ©2012 Moneytree KK
  • 13. GREAT UX Copyright ©2012 Moneytree KK IS LIKE GREAT SEX Everyone Wants It Not Everyone Gets It Everyone's Definition is www.moneytree.jp A Little Dif ferent
  • 14. UX IS Not An Activity Copyright ©2012 Moneytree KK You Cannot "Make" Great UX www.moneytree.jp
  • 15. UX IS Not An Activity Copyright ©2012 Moneytree KK Great UX is a Goal, a Destination www.moneytree.jp
  • 16. GREAT UX RESULTS FROM Copyright ©2012 Moneytree KK WELL EXECUTED & TESTED INTERFACES RELIABLE & RESPONSIVE SYSTEMS HELPFUL & TIMELY SUPPORT ONGOING PRODUCT IMPROVEMENT www.moneytree.jp
  • 17. A BASIS FOR UNDERSTANDING UX Copyright ©2012 Moneytree KK Objective or Subjective? www.moneytree.jp
  • 18. OBJECTIVE Copyright ©2012 Moneytree KK www.moneytree.jp http://www.youtube.com/watch?v=Ahg6qcgoay4
  • 19. SUBJECTIVE Japanese UI Y U So Dense? www.moneytree.jp Copyright ©2012 Moneytree KK
  • 20. WHO IS REALLY GOOD AT UX? Copyright ©2012 Moneytree KK Design + Development Development + Design www.moneytree.jp
  • 21. WHAT'D HE SAY? Copyright ©2012 Moneytree KK   UX Not Well Understood   It's Not an Activity   Objective or Subjective?   Who is Really Good at UX? www.moneytree.jp
  • 22. Understanding Mobile Constraints www.moneytree.jp Copyright ©2012 Moneytree KK
  • 23. DEVICE CONSTRAINTS Copyright ©2012 Moneytree KK FORM FACTOR BATTERY CPU & RAM NETWORK QUALITY SENSORS INPUT METHOD www.moneytree.jp
  • 24. PARADIGM CONSTRAINTS Copyright ©2012 Moneytree KK SHORT SESSIONS SNACKING NOT FEASTING INTERRUPTED USAGE PHONE CAN RING www.moneytree.jp
  • 25. CONTEXTUAL CONSTRAINTS Copyright ©2012 Moneytree KK MOVING VS Stationary INDOOR VS OUTDOOR LIGHTING & NOISE DISTRACTIONS www.moneytree.jp
  • 26. HUMAN CONSTRAINTS Copyright ©2012 Moneytree KK LIMITED MEMORY CHANGE BLINDNESS CAN'T MULTI-TASK IMPATIENT CRAVE STIMULATION www.moneytree.jp http://www.businessinsider.com/100-things-you-should-know-about-people-2010-11
  • 27. WHAT'D HE SAY? Copyright ©2012 Moneytree KK   Device Constraints   Paradigm Constraints   Contextual Constraints   Human Constraints www.moneytree.jp
  • 28. Mobile UX-UI Toolbox www.moneytree.jp Copyright ©2012 Moneytree KK
  • 29. CONCEPT SKETCHES Copyright ©2012 Moneytree KK www.moneytree.jp http://www.behance.net/gallery/Mobile-media-app-concept/795914
  • 30. CONCEPT SKETCHES Copyright ©2012 Moneytree KK www.moneytree.jp http://designreviver.com/inspiration/a-selection-of-mobile-ui-wireframe-sketches/
  • 31. PAPER MOCKUPS Copyright ©2012 Moneytree KK www.moneytree.jp http://www.lifehacker.com.au/2012/07/how-twitter-still-found-paper-useful/
  • 32. Moneytree TOUCHABLE PROTOTYPES www.moneytree.jp Copyright ©2012 Moneytree KK
  • 33. WIREFRAMES - LAYOUT Copyright ©2012 Moneytree KK www.moneytree.jp http://designreviver.com/inspiration/a-selection-of-mobile-ui-wireframe-sketches/
  • 34. WIREFRAMES - BEHAVIOUR Copyright ©2012 Moneytree KK www.moneytree.jp Moneytree / Hands Memory
  • 35. WIREFRAMES - FLOWS Copyright ©2012 Moneytree KK www.moneytree.jp http://designreviver.com/inspiration/a-selection-of-mobile-ui-wireframe-sketches/
  • 36. DIGITAL WIREFRAMES Copyright ©2012 Moneytree KK www.moneytree.jp http://mcrubioux.wordpress.com/2011/03/09/mobile-app-ux-design/
  • 37. WHAT IS YOUR INTENT? Copyright ©2012 Moneytree KK HOW SHOULD THEY FEEL? WHERE SHOULD THEY LOOK? WHAT IS IMPORTANT? WHAT IS USED OFTEN? HOW DO I FEEL USING IT? WHAT MADE ME FEEL GOOD? www.moneytree.jp
  • 38. USABILITY TACTICS Copyright ©2012 Moneytree KK MINIMIZE NAVIGATION DEPTH COUNT NUMBER OF TAPS THUMB FRIENDLY INSTANT FEEDBACK FEWER OPTIONS (3-4) DO ONE THING REALLY WELL Re-USE LEARNT BEHAVIOURS www.moneytree.jp
  • 39. WHAT'D HE SAY? Copyright ©2012 Moneytree KK   Concept Sketches   Paper Mockups   Touchable Prototypes   Wireframes   Digital Wireframes   What Is Your Intent? www.moneytree.jp   Usability Tactics
  • 40. Our UX Development Process www.moneytree.jp Copyright ©2012 Moneytree KK
  • 41. UX PROCESS FLOW - PLANNING Copyright ©2012 Moneytree KK PROCESS STEP STAGE Brainstorm / Research / Discuss IDEATION Concept Sketches Develop Persona (2-3) CONCEPT DEVELOPMENT Focus Problems/Questions (1-3) Define Your MVP Paper Mocks / Touchable Prototype Paper Wireframes (Formal) www.moneytree.jp Review / Discuss
  • 42. UX PROCESS FLOW - EXECUTION Copyright ©2012 Moneytree KK PROCESS STEP STAGE Digital Wireframes ASSET CREATION w Screen Design w Behaviour Design UI Implementation PROGRAMMING w Animations w Controls Internal UI Testing www.moneytree.jp Production Asset Creation DESIGN FEEDBACK Beta Testing END OF ITERATION
  • 43. TODAY'S ROADMAP Copyright ©2012 Moneytree KK 1.  What Do You Want to Make? 2.  Why is UX Difficult? 3.  Understand Mobile Constraints 4.  Mobile UX-UI Toolbox 5.  Our UX Development Process www.moneytree.jp
  • 44. MY PARTING THOUGHT Copyright ©2012 Moneytree KK You Can't "Make" Great UX You Can Only Make UX Great www.moneytree.jp
  • 45. CONTACT ME Copyright ©2012 Moneytree KK   Paul Chapman pchapman<at> moneytree <dot> jp @pchap10k www.moneytree.jp