SlideShare ist ein Scribd-Unternehmen logo
1 von 69
Downloaden Sie, um offline zu lesen
Josh Clark
       @globalmoxie
www.globalmoxie.com


    Webcast hashtag:
        #tapworthy
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
“Is It Worth It?”
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
What Makes Your App
     Mobile?
I’m micro-tasking.
    I’m local.
   I’m bored.
I’m Micro-Tasking
             photo: envisionpublicidad at ickr
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
I’m Local
            photo: quasimondo at ickr
O'Reilly Webcast: Tapworthy iPhone App Design
Shopper


Babelshot


SoundCurtain
I’m Bored
            photo: thomashawk at ickr
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
Think Big, Build Small
O'Reilly Webcast: Tapworthy iPhone App Design
Tapworthy apps...
• Focus on mobile context
• Optimize for micro-tasking
• Use sensors to enhance local context
• Create opportunities for exploration
• Complex ≠ complicated
• Do one thing and do it well
O'Reilly Webcast: Tapworthy iPhone App Design
You’re Designing a
 Physical Device
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
44
44
44
44

44

44
88
88
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
Be a Scroll Skeptic
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
Edit, Edit, Edit
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
Text
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
Finger-Friendly Design
• Use the thumb’s hot zone.
• Design to a 44-point rhythm.
• Be generous with space.
• Content at top, controls at bottom.
• Avoid scrolling where practical.
• Put secondary controls behind hidden
  doors.
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
O'Reilly Webcast: Tapworthy iPhone App Design
Thanks!
  @globalmoxie
www.globalmoxie.com
O’Reilly online course
Tapworthy iPhone Design


                Starts October 20, 2010
                Eight-week online course

                http://training.oreilly.com
40% off
(50% off ebook)



            Discount code

            4CAST
            www.oreilly.com

Weitere ähnliche Inhalte

Was ist angesagt?

BMPR | May 2011
BMPR | May 2011BMPR | May 2011
BMPR | May 2011BMPR
 
Apple Router.Ppt
Apple Router.PptApple Router.Ppt
Apple Router.Pptnicao617
 
Technology is the future
Technology is the futureTechnology is the future
Technology is the futureWesleyDRoberson
 
Do you know where you are
Do you know where you areDo you know where you are
Do you know where you aresythe64
 
ICISTS KAIST Keynote Speech
ICISTS KAIST Keynote SpeechICISTS KAIST Keynote Speech
ICISTS KAIST Keynote SpeechAmber Case
 
Lifestyle Technology
Lifestyle TechnologyLifestyle Technology
Lifestyle Technologybgrier
 
Looking to the Future of Educational Technology
Looking to the Future of Educational TechnologyLooking to the Future of Educational Technology
Looking to the Future of Educational TechnologyKelgator
 
NCrafts.IO 2015 - Future of User eXperiences
NCrafts.IO 2015 - Future of User eXperiencesNCrafts.IO 2015 - Future of User eXperiences
NCrafts.IO 2015 - Future of User eXperiencesVincent Guigui
 
CES 2017 Assistive Tech Related Product Overview
CES 2017 Assistive Tech Related Product OverviewCES 2017 Assistive Tech Related Product Overview
CES 2017 Assistive Tech Related Product OverviewBen Salatin
 
Assignment #3(updated)
Assignment #3(updated)Assignment #3(updated)
Assignment #3(updated)Corey Powell
 
Wearable Accessibility - Accessing Higher Ground 2014
Wearable Accessibility - Accessing Higher Ground 2014Wearable Accessibility - Accessing Higher Ground 2014
Wearable Accessibility - Accessing Higher Ground 2014Ted Drake
 

Was ist angesagt? (18)

BMPR | May 2011
BMPR | May 2011BMPR | May 2011
BMPR | May 2011
 
App builders 2020, UI Mode Pitch Black
App builders 2020, UI Mode Pitch BlackApp builders 2020, UI Mode Pitch Black
App builders 2020, UI Mode Pitch Black
 
Menno Huisman - Meta Architecture
Menno Huisman - Meta ArchitectureMenno Huisman - Meta Architecture
Menno Huisman - Meta Architecture
 
Apple Router.Ppt
Apple Router.PptApple Router.Ppt
Apple Router.Ppt
 
Technology is the future
Technology is the futureTechnology is the future
Technology is the future
 
Do you know where you are
Do you know where you areDo you know where you are
Do you know where you are
 
ICISTS KAIST Keynote Speech
ICISTS KAIST Keynote SpeechICISTS KAIST Keynote Speech
ICISTS KAIST Keynote Speech
 
Web 2.wh0a!
Web 2.wh0a!Web 2.wh0a!
Web 2.wh0a!
 
Three Things First
Three Things FirstThree Things First
Three Things First
 
Lifestyle Technology
Lifestyle TechnologyLifestyle Technology
Lifestyle Technology
 
Jlg Powerpoint
Jlg PowerpointJlg Powerpoint
Jlg Powerpoint
 
Mobile
MobileMobile
Mobile
 
Mobile Apps
Mobile AppsMobile Apps
Mobile Apps
 
Looking to the Future of Educational Technology
Looking to the Future of Educational TechnologyLooking to the Future of Educational Technology
Looking to the Future of Educational Technology
 
NCrafts.IO 2015 - Future of User eXperiences
NCrafts.IO 2015 - Future of User eXperiencesNCrafts.IO 2015 - Future of User eXperiences
NCrafts.IO 2015 - Future of User eXperiences
 
CES 2017 Assistive Tech Related Product Overview
CES 2017 Assistive Tech Related Product OverviewCES 2017 Assistive Tech Related Product Overview
CES 2017 Assistive Tech Related Product Overview
 
Assignment #3(updated)
Assignment #3(updated)Assignment #3(updated)
Assignment #3(updated)
 
Wearable Accessibility - Accessing Higher Ground 2014
Wearable Accessibility - Accessing Higher Ground 2014Wearable Accessibility - Accessing Higher Ground 2014
Wearable Accessibility - Accessing Higher Ground 2014
 

Andere mochten auch

8 Tips for Scaling Mobile Users in China by Edith Yeung
8 Tips for Scaling Mobile Users in China by Edith Yeung8 Tips for Scaling Mobile Users in China by Edith Yeung
8 Tips for Scaling Mobile Users in China by Edith YeungEdith Yeung
 
Climbing Cannes
Climbing CannesClimbing Cannes
Climbing Cannespsambrakos
 
Beyond the Gig Economy
Beyond the Gig EconomyBeyond the Gig Economy
Beyond the Gig EconomyJon Lieber
 
Future of Mobile Web Application and Web App Store
Future of Mobile Web Application and Web App StoreFuture of Mobile Web Application and Web App Store
Future of Mobile Web Application and Web App StoreJonathan Jeon
 
[Infographic] How will Internet of Things (IoT) change the world as we know it?
[Infographic] How will Internet of Things (IoT) change the world as we know it?[Infographic] How will Internet of Things (IoT) change the world as we know it?
[Infographic] How will Internet of Things (IoT) change the world as we know it?InterQuest Group
 
Network Effects
Network EffectsNetwork Effects
Network Effectsa16z
 
Lacta - Love in the end - MIPTV
Lacta - Love in the end -  MIPTVLacta - Love in the end -  MIPTV
Lacta - Love in the end - MIPTVpsambrakos
 
How to make users talk about your brand, by talking about themselves!
How to make users talk about your brand, by talking about themselves!How to make users talk about your brand, by talking about themselves!
How to make users talk about your brand, by talking about themselves!psambrakos
 
How to Transform Your Career by Petra Nemcova
How to Transform Your Career by Petra NemcovaHow to Transform Your Career by Petra Nemcova
How to Transform Your Career by Petra NemcovaLinkedIn
 
Prospects for DOD’s Budget Over the Next Decade
Prospects for DOD’s Budget Over the Next DecadeProspects for DOD’s Budget Over the Next Decade
Prospects for DOD’s Budget Over the Next DecadeCongressional Budget Office
 
Public Opinion Landscape - Election 2016
Public Opinion Landscape - Election 2016Public Opinion Landscape - Election 2016
Public Opinion Landscape - Election 2016GloverParkGroup
 
A Beginners Guide to noSQL
A Beginners Guide to noSQLA Beginners Guide to noSQL
A Beginners Guide to noSQLMike Crabb
 
Designing the Future: When Fact Meets Fiction
Designing the Future: When Fact Meets FictionDesigning the Future: When Fact Meets Fiction
Designing the Future: When Fact Meets FictionDean Johnson
 
Getting Information through HTML Forms
Getting Information through HTML FormsGetting Information through HTML Forms
Getting Information through HTML FormsMike Crabb
 
SXSW 2016: The Need To Knows
SXSW 2016: The Need To KnowsSXSW 2016: The Need To Knows
SXSW 2016: The Need To KnowsOgilvy Consulting
 
Creative Traction Methodology - For Early Stage Startups
Creative Traction Methodology - For Early Stage StartupsCreative Traction Methodology - For Early Stage Startups
Creative Traction Methodology - For Early Stage StartupsTommaso Di Bartolo
 
IT in Healthcare
IT in HealthcareIT in Healthcare
IT in HealthcareNetApp
 

Andere mochten auch (20)

8 Tips for Scaling Mobile Users in China by Edith Yeung
8 Tips for Scaling Mobile Users in China by Edith Yeung8 Tips for Scaling Mobile Users in China by Edith Yeung
8 Tips for Scaling Mobile Users in China by Edith Yeung
 
Climbing Cannes
Climbing CannesClimbing Cannes
Climbing Cannes
 
Beyond the Gig Economy
Beyond the Gig EconomyBeyond the Gig Economy
Beyond the Gig Economy
 
Future of Mobile Web Application and Web App Store
Future of Mobile Web Application and Web App StoreFuture of Mobile Web Application and Web App Store
Future of Mobile Web Application and Web App Store
 
[Infographic] How will Internet of Things (IoT) change the world as we know it?
[Infographic] How will Internet of Things (IoT) change the world as we know it?[Infographic] How will Internet of Things (IoT) change the world as we know it?
[Infographic] How will Internet of Things (IoT) change the world as we know it?
 
Network Effects
Network EffectsNetwork Effects
Network Effects
 
15 Millennial Mobile Statistics
15 Millennial Mobile Statistics 15 Millennial Mobile Statistics
15 Millennial Mobile Statistics
 
IoT Growth: A Forecast
IoT Growth: A ForecastIoT Growth: A Forecast
IoT Growth: A Forecast
 
Lacta - Love in the end - MIPTV
Lacta - Love in the end -  MIPTVLacta - Love in the end -  MIPTV
Lacta - Love in the end - MIPTV
 
How to make users talk about your brand, by talking about themselves!
How to make users talk about your brand, by talking about themselves!How to make users talk about your brand, by talking about themselves!
How to make users talk about your brand, by talking about themselves!
 
How to Transform Your Career by Petra Nemcova
How to Transform Your Career by Petra NemcovaHow to Transform Your Career by Petra Nemcova
How to Transform Your Career by Petra Nemcova
 
Prospects for DOD’s Budget Over the Next Decade
Prospects for DOD’s Budget Over the Next DecadeProspects for DOD’s Budget Over the Next Decade
Prospects for DOD’s Budget Over the Next Decade
 
Public Opinion Landscape - Election 2016
Public Opinion Landscape - Election 2016Public Opinion Landscape - Election 2016
Public Opinion Landscape - Election 2016
 
Enabling Autonomy
Enabling AutonomyEnabling Autonomy
Enabling Autonomy
 
A Beginners Guide to noSQL
A Beginners Guide to noSQLA Beginners Guide to noSQL
A Beginners Guide to noSQL
 
Designing the Future: When Fact Meets Fiction
Designing the Future: When Fact Meets FictionDesigning the Future: When Fact Meets Fiction
Designing the Future: When Fact Meets Fiction
 
Getting Information through HTML Forms
Getting Information through HTML FormsGetting Information through HTML Forms
Getting Information through HTML Forms
 
SXSW 2016: The Need To Knows
SXSW 2016: The Need To KnowsSXSW 2016: The Need To Knows
SXSW 2016: The Need To Knows
 
Creative Traction Methodology - For Early Stage Startups
Creative Traction Methodology - For Early Stage StartupsCreative Traction Methodology - For Early Stage Startups
Creative Traction Methodology - For Early Stage Startups
 
IT in Healthcare
IT in HealthcareIT in Healthcare
IT in Healthcare
 

Ähnlich wie O'Reilly Webcast: Tapworthy iPhone App Design

Tech Tools To Boost Your Business
Tech Tools To Boost Your BusinessTech Tools To Boost Your Business
Tech Tools To Boost Your BusinessMaura Neill
 
Nov. 8, 2011 webcast desiging mobile interfaces by steven hoober
Nov. 8, 2011 webcast   desiging mobile interfaces by steven hooberNov. 8, 2011 webcast   desiging mobile interfaces by steven hoober
Nov. 8, 2011 webcast desiging mobile interfaces by steven hooberO'Reilly Media
 
Designing for User Experience (UX) with Atlassian Tools
Designing for User Experience (UX) with Atlassian ToolsDesigning for User Experience (UX) with Atlassian Tools
Designing for User Experience (UX) with Atlassian ToolsAtlassian
 
Design concepts for Mobile Learnng
Design concepts for Mobile LearnngDesign concepts for Mobile Learnng
Design concepts for Mobile LearnngChad Udell
 
Teaching with technology v2.0
Teaching with technology v2.0Teaching with technology v2.0
Teaching with technology v2.0hcolunga
 
Mobile learning hv 11613
Mobile learning hv 11613Mobile learning hv 11613
Mobile learning hv 11613Nell Eckersley
 
It Takes 2 to Make a Thing Go Right: Jessica L'Esperance and Erin Scime Talk ...
It Takes 2 to Make a Thing Go Right: Jessica L'Esperance and Erin Scime Talk ...It Takes 2 to Make a Thing Go Right: Jessica L'Esperance and Erin Scime Talk ...
It Takes 2 to Make a Thing Go Right: Jessica L'Esperance and Erin Scime Talk ...Erin Scime
 
REALTOR on the Go: Taking Your Real Estate Business Mobile
REALTOR on the Go: Taking Your Real Estate Business MobileREALTOR on the Go: Taking Your Real Estate Business Mobile
REALTOR on the Go: Taking Your Real Estate Business MobileMaura Neill
 
iPad Workshop
iPad WorkshopiPad Workshop
iPad WorkshopVic Ward
 
It Takes 2 to Make a Thing Go Right: A Content Strategist and Designer Talk M...
It Takes 2 to Make a Thing Go Right: A Content Strategist and Designer Talk M...It Takes 2 to Make a Thing Go Right: A Content Strategist and Designer Talk M...
It Takes 2 to Make a Thing Go Right: A Content Strategist and Designer Talk M...Duo Consulting
 
Getting started in iPhone Development
Getting started in iPhone DevelopmentGetting started in iPhone Development
Getting started in iPhone DevelopmentManesh Lad
 
Robotics in Libraries - Education and Automation
Robotics in Libraries - Education and AutomationRobotics in Libraries - Education and Automation
Robotics in Libraries - Education and AutomationBrian Pichman
 
XR Training Best Practices - Jeff Meador, COO, Portico
XR Training Best Practices - Jeff Meador, COO, PorticoXR Training Best Practices - Jeff Meador, COO, Portico
XR Training Best Practices - Jeff Meador, COO, PorticoSeriousGamesAssoc
 
50 Mobile Hacks for Career Counselors
50 Mobile Hacks for Career Counselors50 Mobile Hacks for Career Counselors
50 Mobile Hacks for Career CounselorsMelissa A. Venable
 
Using i pads with students
Using i pads with studentsUsing i pads with students
Using i pads with studentsNell Eckersley
 

Ähnlich wie O'Reilly Webcast: Tapworthy iPhone App Design (20)

Roadshow cb
Roadshow cbRoadshow cb
Roadshow cb
 
iPad App-Citement!
iPad App-Citement!iPad App-Citement!
iPad App-Citement!
 
Tech Tools To Boost Your Business
Tech Tools To Boost Your BusinessTech Tools To Boost Your Business
Tech Tools To Boost Your Business
 
Nov. 8, 2011 webcast desiging mobile interfaces by steven hoober
Nov. 8, 2011 webcast   desiging mobile interfaces by steven hooberNov. 8, 2011 webcast   desiging mobile interfaces by steven hoober
Nov. 8, 2011 webcast desiging mobile interfaces by steven hoober
 
Designing for User Experience (UX) with Atlassian Tools
Designing for User Experience (UX) with Atlassian ToolsDesigning for User Experience (UX) with Atlassian Tools
Designing for User Experience (UX) with Atlassian Tools
 
skype flyer
skype flyerskype flyer
skype flyer
 
Apple case study
Apple case studyApple case study
Apple case study
 
Design concepts for Mobile Learnng
Design concepts for Mobile LearnngDesign concepts for Mobile Learnng
Design concepts for Mobile Learnng
 
Teaching with technology v2.0
Teaching with technology v2.0Teaching with technology v2.0
Teaching with technology v2.0
 
Mobile learning hv 11613
Mobile learning hv 11613Mobile learning hv 11613
Mobile learning hv 11613
 
It Takes 2 to Make a Thing Go Right: Jessica L'Esperance and Erin Scime Talk ...
It Takes 2 to Make a Thing Go Right: Jessica L'Esperance and Erin Scime Talk ...It Takes 2 to Make a Thing Go Right: Jessica L'Esperance and Erin Scime Talk ...
It Takes 2 to Make a Thing Go Right: Jessica L'Esperance and Erin Scime Talk ...
 
REALTOR on the Go: Taking Your Real Estate Business Mobile
REALTOR on the Go: Taking Your Real Estate Business MobileREALTOR on the Go: Taking Your Real Estate Business Mobile
REALTOR on the Go: Taking Your Real Estate Business Mobile
 
iPad Workshop
iPad WorkshopiPad Workshop
iPad Workshop
 
Byod tesol 2013
Byod tesol 2013Byod tesol 2013
Byod tesol 2013
 
It Takes 2 to Make a Thing Go Right: A Content Strategist and Designer Talk M...
It Takes 2 to Make a Thing Go Right: A Content Strategist and Designer Talk M...It Takes 2 to Make a Thing Go Right: A Content Strategist and Designer Talk M...
It Takes 2 to Make a Thing Go Right: A Content Strategist and Designer Talk M...
 
Getting started in iPhone Development
Getting started in iPhone DevelopmentGetting started in iPhone Development
Getting started in iPhone Development
 
Robotics in Libraries - Education and Automation
Robotics in Libraries - Education and AutomationRobotics in Libraries - Education and Automation
Robotics in Libraries - Education and Automation
 
XR Training Best Practices - Jeff Meador, COO, Portico
XR Training Best Practices - Jeff Meador, COO, PorticoXR Training Best Practices - Jeff Meador, COO, Portico
XR Training Best Practices - Jeff Meador, COO, Portico
 
50 Mobile Hacks for Career Counselors
50 Mobile Hacks for Career Counselors50 Mobile Hacks for Career Counselors
50 Mobile Hacks for Career Counselors
 
Using i pads with students
Using i pads with studentsUsing i pads with students
Using i pads with students
 

Mehr von Josh Clark

Multidevice Mambo
Multidevice MamboMultidevice Mambo
Multidevice MamboJosh Clark
 
Significant Glances: Meaningful Interaction on the Wrist
Significant Glances: Meaningful Interaction on the WristSignificant Glances: Meaningful Interaction on the Wrist
Significant Glances: Meaningful Interaction on the WristJosh Clark
 
Magical UX and the Internet of Things
Magical UX and the Internet of ThingsMagical UX and the Internet of Things
Magical UX and the Internet of ThingsJosh Clark
 
Mind the Gap: Designing the Space Between Devices
Mind the Gap: Designing the Space Between DevicesMind the Gap: Designing the Space Between Devices
Mind the Gap: Designing the Space Between DevicesJosh Clark
 
SXSW: iPad Design Headaches (Take Two Tablets and Call Me in the Morning)
SXSW: iPad Design Headaches (Take Two Tablets and Call Me in the Morning)SXSW: iPad Design Headaches (Take Two Tablets and Call Me in the Morning)
SXSW: iPad Design Headaches (Take Two Tablets and Call Me in the Morning)Josh Clark
 
Up with Complexity!
Up with Complexity!Up with Complexity!
Up with Complexity!Josh Clark
 
iPad Design Headaches: Take Two Tablets and Call Me in the Morning - 360iDev
iPad Design Headaches: Take Two Tablets and Call Me in the Morning - 360iDeviPad Design Headaches: Take Two Tablets and Call Me in the Morning - 360iDev
iPad Design Headaches: Take Two Tablets and Call Me in the Morning - 360iDevJosh Clark
 
Designing for Touch: Mobile Design is Industrial Design
Designing for Touch: Mobile Design is Industrial DesignDesigning for Touch: Mobile Design is Industrial Design
Designing for Touch: Mobile Design is Industrial DesignJosh Clark
 
Going Native: The Anthropology of Mobile Apps
Going Native: The Anthropology of Mobile AppsGoing Native: The Anthropology of Mobile Apps
Going Native: The Anthropology of Mobile AppsJosh Clark
 
Going Native: The Anthropology of Mobile Apps
Going Native: The Anthropology of Mobile AppsGoing Native: The Anthropology of Mobile Apps
Going Native: The Anthropology of Mobile AppsJosh Clark
 
iPad Design Headaches: Take Two Tablets and Call Me in the Morning
iPad Design Headaches: Take Two Tablets and Call Me in the MorningiPad Design Headaches: Take Two Tablets and Call Me in the Morning
iPad Design Headaches: Take Two Tablets and Call Me in the MorningJosh Clark
 
Tapworthy: Designing iPhone Interfaces for Delight and Usability
Tapworthy: Designing iPhone Interfaces for Delight and UsabilityTapworthy: Designing iPhone Interfaces for Delight and Usability
Tapworthy: Designing iPhone Interfaces for Delight and UsabilityJosh Clark
 

Mehr von Josh Clark (12)

Multidevice Mambo
Multidevice MamboMultidevice Mambo
Multidevice Mambo
 
Significant Glances: Meaningful Interaction on the Wrist
Significant Glances: Meaningful Interaction on the WristSignificant Glances: Meaningful Interaction on the Wrist
Significant Glances: Meaningful Interaction on the Wrist
 
Magical UX and the Internet of Things
Magical UX and the Internet of ThingsMagical UX and the Internet of Things
Magical UX and the Internet of Things
 
Mind the Gap: Designing the Space Between Devices
Mind the Gap: Designing the Space Between DevicesMind the Gap: Designing the Space Between Devices
Mind the Gap: Designing the Space Between Devices
 
SXSW: iPad Design Headaches (Take Two Tablets and Call Me in the Morning)
SXSW: iPad Design Headaches (Take Two Tablets and Call Me in the Morning)SXSW: iPad Design Headaches (Take Two Tablets and Call Me in the Morning)
SXSW: iPad Design Headaches (Take Two Tablets and Call Me in the Morning)
 
Up with Complexity!
Up with Complexity!Up with Complexity!
Up with Complexity!
 
iPad Design Headaches: Take Two Tablets and Call Me in the Morning - 360iDev
iPad Design Headaches: Take Two Tablets and Call Me in the Morning - 360iDeviPad Design Headaches: Take Two Tablets and Call Me in the Morning - 360iDev
iPad Design Headaches: Take Two Tablets and Call Me in the Morning - 360iDev
 
Designing for Touch: Mobile Design is Industrial Design
Designing for Touch: Mobile Design is Industrial DesignDesigning for Touch: Mobile Design is Industrial Design
Designing for Touch: Mobile Design is Industrial Design
 
Going Native: The Anthropology of Mobile Apps
Going Native: The Anthropology of Mobile AppsGoing Native: The Anthropology of Mobile Apps
Going Native: The Anthropology of Mobile Apps
 
Going Native: The Anthropology of Mobile Apps
Going Native: The Anthropology of Mobile AppsGoing Native: The Anthropology of Mobile Apps
Going Native: The Anthropology of Mobile Apps
 
iPad Design Headaches: Take Two Tablets and Call Me in the Morning
iPad Design Headaches: Take Two Tablets and Call Me in the MorningiPad Design Headaches: Take Two Tablets and Call Me in the Morning
iPad Design Headaches: Take Two Tablets and Call Me in the Morning
 
Tapworthy: Designing iPhone Interfaces for Delight and Usability
Tapworthy: Designing iPhone Interfaces for Delight and UsabilityTapworthy: Designing iPhone Interfaces for Delight and Usability
Tapworthy: Designing iPhone Interfaces for Delight and Usability
 

Kürzlich hochgeladen

ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDEADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDELiveplex
 
Bird eye's view on Camunda open source ecosystem
Bird eye's view on Camunda open source ecosystemBird eye's view on Camunda open source ecosystem
Bird eye's view on Camunda open source ecosystemAsko Soukka
 
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
 
Building AI-Driven Apps Using Semantic Kernel.pptx
Building AI-Driven Apps Using Semantic Kernel.pptxBuilding AI-Driven Apps Using Semantic Kernel.pptx
Building AI-Driven Apps Using Semantic Kernel.pptxUdaiappa Ramachandran
 
COMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online CollaborationCOMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online Collaborationbruanjhuli
 
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
 
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
 
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
 
Linked Data in Production: Moving Beyond Ontologies
Linked Data in Production: Moving Beyond OntologiesLinked Data in Production: Moving Beyond Ontologies
Linked Data in Production: Moving Beyond OntologiesDavid Newbury
 
20230202 - Introduction to tis-py
20230202 - Introduction to tis-py20230202 - Introduction to tis-py
20230202 - Introduction to tis-pyJamie (Taka) Wang
 
Machine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfMachine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfAijun Zhang
 
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
 
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
 
Comparing Sidecar-less Service Mesh from Cilium and Istio
Comparing Sidecar-less Service Mesh from Cilium and IstioComparing Sidecar-less Service Mesh from Cilium and Istio
Comparing Sidecar-less Service Mesh from Cilium and IstioChristian Posta
 
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
 
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
 
Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )Brian Pichman
 
UiPath Studio Web workshop series - Day 6
UiPath Studio Web workshop series - Day 6UiPath Studio Web workshop series - Day 6
UiPath Studio Web workshop series - Day 6DianaGray10
 
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
 
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
 

Kürzlich hochgeladen (20)

ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDEADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
 
Bird eye's view on Camunda open source ecosystem
Bird eye's view on Camunda open source ecosystemBird eye's view on Camunda open source ecosystem
Bird eye's view on Camunda open source ecosystem
 
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
 
Building AI-Driven Apps Using Semantic Kernel.pptx
Building AI-Driven Apps Using Semantic Kernel.pptxBuilding AI-Driven Apps Using Semantic Kernel.pptx
Building AI-Driven Apps Using Semantic Kernel.pptx
 
COMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online CollaborationCOMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online Collaboration
 
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
 
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
 
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...
 
Linked Data in Production: Moving Beyond Ontologies
Linked Data in Production: Moving Beyond OntologiesLinked Data in Production: Moving Beyond Ontologies
Linked Data in Production: Moving Beyond Ontologies
 
20230202 - Introduction to tis-py
20230202 - Introduction to tis-py20230202 - Introduction to tis-py
20230202 - Introduction to tis-py
 
Machine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfMachine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdf
 
Artificial Intelligence & SEO Trends for 2024
Artificial Intelligence & SEO Trends for 2024Artificial Intelligence & SEO Trends for 2024
Artificial Intelligence & SEO Trends for 2024
 
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
 
Comparing Sidecar-less Service Mesh from Cilium and Istio
Comparing Sidecar-less Service Mesh from Cilium and IstioComparing Sidecar-less Service Mesh from Cilium and Istio
Comparing Sidecar-less Service Mesh from Cilium and Istio
 
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
 
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
 
Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )
 
UiPath Studio Web workshop series - Day 6
UiPath Studio Web workshop series - Day 6UiPath Studio Web workshop series - Day 6
UiPath Studio Web workshop series - Day 6
 
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.
 
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
 

O'Reilly Webcast: Tapworthy iPhone App Design

Hinweis der Redaktion

  1. Design and user experience; what makes a great iPhone app. Not about code or marketing. How to “think iPhone” Best apps account for whole range of non-technical considerations Psychology, ergonomics, culture, aesthetics, efficiency. Form/context of iPhone puts special demands Focus on iPhone, handheld, not iPad iPad’s form / context → different animal. Designing for handheld touchscreen very different than desktop. Next hour, look at those considerations from big picture then zoom down into nitty-gritty pixel-perfect details But first, want to talk about an AWESOME Swiss Army Knife.
  2. Wenger Giant: Holds Guinness world record for most multifunctional pen knife. Made for company’s 100th anniversary to include every gadget ever included in a Swiss Army knife. 87 tools, 141 functions. Cigar cutter, laser pointer, golf reamer. Bit of humor and whimsy, but as a knife, it’s a failure. Heavy physical load, heavy cognitive load Mobile interface: Clarity should trump density, less is more
  3. Simple and elegant in contrast, but lots of similarities with Swiss Army Knife: Mobile devices, small, pocket-sized, meant to be worked by hands and fingers. One gadget at a time, one app at a time. Simple, specialized tools, right for job, focused. Switch quickly between apps Big toolbox: Yours doesn’t have to do everything, just a small focused slice. Overwhelm if try to do too much. Successful iPhone apps depend on design restraint. Focus is important.
  4. Launching app uses scarce resources: time, attention, thought Use mobile apps when mobile: grocery, tv, conversation Share attention in distracted, rushed settings. People have better things to do. If app doesn’t compete, we’ll move on. Chew through apps: We download 10 apps/mo, few launched even 20 times. Not worth even tiny effort they require. When people look at icon on home screen: Worth it? Worth attention? Worth time? Worth tapping? Or put another way: Is it tapworthy?
  5. Little detour to mention importance of style and charm. Convertbot. Dreary task handled with toylike style. Most of this talk is going to focus on simplicity & efficiency, but it’s not all about reducing tap quantity. Improving tap quality. Convertbot isn’t the most efficient conversion utility. But people return to it because it’s fun. Emotional attachment to software? Deeply personal nature of iPhone. One way to create attachment is create sense of luxury. Wood, metal, glass.
  6. Similarly, Bebot. Example of thinking about charm. Really capable sound synthesizer with theramine effects, whole range of tools for adjusting music. Obvious thing would have been to make a keyboard or soundboard. Instead, robot crooner. Important to keep things familiar, efficient (Is this as simple as it might be) But at same time, ask: Am I going far enough?
  7. Don’t get distracted by razzle dazzle. As extraordinary as your app might be, only tapworthy if useful in mobile context. Mobile not just on the go: on the couch, in kitchen Features, use cases for nontraditional computing environ. Easy to lose sight of mobile context. Tempting to think of regular computer. True technically, but not in context. Just because the device can do sophisticated computing, doesn’t mean *I* want to. Does it do something people will want on the go?
  8. By and large our brains are in one of 3 modes when using iPhone app.
  9. Micro-tasking: Quick dashes of short tasks, get in and get out. Device of convenience and context. Wedge its use in between other activities. Captures lost time. Grocery store lines, subway commutes. Anticipate dashes and short sprint. Identify recurring tasks, optimize for those tasks, then: polish, polish, polish
  10. Things To-Do List Optimized for adding to-dos and checking them off. Add a to-do list by tapping that plus sign in lower left. Every screen has it. No matter where you are, one tap away from adding task Mail app: new message button on every screen Identify primary tasks and optimize the hell out of em. Constant presence of these controls important but so is a call to action…
  11. Gowalla: location-sharing service for announcing whereabouts All about the check-in, doing it quickly. Big chunky button is a call to action Not only optimizes for checking in quickly, but Makes it obvious what to do Identify primary recurring task, optimize for it, make it drop-dead easy. Something’s wrong if people can’t immediately figure out how to do the primary task of your app.
  12. First personal computer: knows so much about you Sensors -- Sight, hearing, touch Use sensors to give personal context to tasks and info
  13. A Bike Now and Trees Near You. Use location information to connect with niche audiences. Proliferation of geotagging → Information ghosts Great apps: goggles see only the ghosts that interest us. Feed personal passion with hyperlocal info Maps are the obvious use. Again, useful to think: am I going far enough? How can I take this further? Not just what’s around you but what’s in front of you.
  14. Not just what’s near me What’s right in front of me? Use sensors: Add highly personal context to tasks/info
  15. Nothing more tapworthy than helping someone survive dull-as-paste moment Games most popular in app store. iPhone great for this for same reason it’s great for micro-tasking: Always there Video game, high literature, low humor
  16. Make me laugh. Boredom floats industry of moron tests & fart-sound apps Full-fledged software genre Software not just for work now: Want entertainment, distraction That’s new for mainstream: software is content, not a tool.
  17. Workaday apps can meet this need, too. Here RunKeeper (running/exercise journal) and Lose It (calorie counter) Personal stats as video game Novelty apps, games, books, news, youtube, twitter. All story. Common thread: exploration. Productivity apps great at providing exploration, especially apps that collect personal data. Where you’ve been, where going Explore our own personal history, video game for narcissists. Not just micro-tasking... Create opportunities for leisurely crawl Optimize for quick sprints but provide something to explore Boredom buster
  18. Be expansive in planning. Still inventing this. Something amazing invented for iPhone every day, keep at it. Come up with all the ideas you can, then kill all but a special few. Figure out the minimum you need to do what you want to do, and polish. Do one thing, do it well. Find your primary use cases Identify recurring tasks Optimize
  19. “Do I need an umbrella today?” Don’t need to have tons of features to be best Less almost always more in mobile But have to fulfill primary task. Some apps do require more features: Facebook Features don’t have to be stripped out, but has to remain simple. Complexity is good, as long as it’s not complicated.
  20. Last point especially important. Tapworthy apps consist only of tapworthy features. Put every feature through that filter: Is it worth effort? Does it make user more awesome?
  21. If don’t edit, here’s the risk. More features you have, more controls you need. Too much in small space Both knife and iPhone have physical constraints (which Giant flaunts) Small screen, but more important, it’s handheld, works by touch That means you’re doing more than pushing pixels
  22. Not literally. Virtual, flickering liquid crystals. But an interface explored by human hands, unlike desktop Not just graphic design: industrial design Your app’s design determines how hands physically interact with the iPhone
  23. Until you open one of its gadgets, a Swiss Army knife isn’t a knife at all. It’s just a handle. A blank.
  24. Blank slate. Impose any interface. Requires touch, which defines device in very physical way. Real ergonomics: How does it feel in your hand? Specifically, one hand. Optimize for one-handed use
  25. Thumb has its limits. And this is it. Hot zone for right-handed user. Right thumb is most comfortable tapping this region when phone held in right hand.
  26. Primary controls at bottom. Standard toolbar and tab bar Opposite of desktop. Frequently used buttons at bottom left. Edit: Lesser used controls at top right.
  27. These principles are reflected in everyday physical objects. Fingers (or feet) obscure view. Have to clear the way. Content at top. Controls at bottom.
  28. Content at top. Controls at bottom.
  29. Content at top. Controls at bottom.
  30. Organize left to right. Conveniently, that’s also how we read.
  31. Here, you see that common functions placed in hot zone, and delete in toughest place to tap. But what about lefties? 10%-15% Optimizing for righties actively hurts those guys.
  32. Some apps, including Twitterrific, offer option to flip controls for lefties. A good option for especially tap-intensive apps. The problem is that now you’re organizing importance of controls from right to left, which is not how we’re accustomed to reading. So again, lefties are inconvenienced. Have to gauge importance of tap convenience vs ease of scanning.
  33. PCalc calculator on Mac for 20 years. Always used mouse and keyboard, not hands. Used that desktop design in 1.0 as-is. But with numbers on left instead of right, people found it uncomfortable, asked are you left-handed? Swapped it in later versions Kept original layout as an option, though, for lefties.
  34. Swapped the layout in subsequent versions. Kept original layout as an option, though, for lefties.
  35. Layout important but also button size How big is finger tip? Apple has very precise opinion on that: 44 points — about ¼” Spread of fingertip as contact point on screen. Size of target that finger can reliably hit iOS 4 introduced points to account for different screen resolutions. One point is one pixel on older phones 2 pixels on iPhone 4, since it has twice the screen resolution. When designing native apps, think in points, not pixels. 44x44 minimum ideal 44 shows up all over standard controls....
  36. Compromise necessary sometimes. Have to get all the letters of the keyboard on the screen. Squeeze to 29 width. As long as one dimension is at least 44, can squeeze other to 29. Practical minimum for buttons: 29x44 points
  37. Again, though, 44 appears everywhere. Nav bar, height of rows in standard list view, tool bar. Every element in proportion, not only to one another but to the finger itself. Not only for the hand, but of the hand Design to a 44-point rhythm Don’t think 44 just for buttons but for overall layout
  38. Don’t have to be super literal Home screen grid organized in 88, multiple of 44 Looks right, but literally feels right
  39. Not only small buttons but too close. Not just button size but spacing Closer tap areas are, larger they should be
  40. Call Global and Skype. Very close together but by making the buttons large and chunky, still easy to hit without error. The exception is the buttons on the bottom of Call Global. Trouble w/proximity when you get close to bottom tab bar. User testing: Mistaps occur most frequently occur at bottom of screen, where you have collisions with main navigation tab. Call Global: Small buttons jammed against tab bar. Skype easier because the buttons are bigger. Still, zone above tab bar should be avoided where possible.
  41. Compromise sometimes necessary: USA Today When developing app, USA Today team considered all kinds of locations for the “i” info icon and refresh button. This is what they wound up with. But they discovered it was nearly impossible to hit those targets. Too small.
  42. Decided to make the tap area bigger than the icon itself. Even though physical footprint of button was small, the tap area would be large enough to hit without error.
  43. Trouble is, Apple got there first, tab bar extended into canvas, making their problem even worse. Had to design custom tab bar to work around the problem. Point is, if you’re going to take tap risks, you have to do everything you can to minimize the impact.
  44. Things checkbox Might seem counter-intuitive but: Success of small interfaces relies on big elements Chunky buttons, generous spacing. Not just ergonomics, but cognitive Less there, easier to take in at once
  45. When can fit everything on one screen, do it Out of sight, out of mind <- particularly true in distracted mobile context Matter of brain and strain: Fire up brain cells to think what’s missing Scrolling requires extra thought, extra swipes. Your job as designer is to reduce both. Reinforces illusion of physical device Fixed screen gives sense of solidity
  46. Approach works best for utility apps. Weather app is the prototypical utility app. Take it in all at once Border makes it clear entire screen. Sense of solidity.
  47. Surf Report. This class of apps: Graphically rich, telegraph quickly. Glance test. Apps pass glance test when: hold at arm’s length, can still soak up the info quickly.
  48. Tea Round: Popular in UK where it tells you whose turn it is to brew the tea. Most apps need more than a big teacup. Can’t just strip out all controls or information. Sometimes scrolling is necessary, but shouldn’t necessarily be your default.
  49. Accuweather.com Not prettiest app but does a nice job of handling dense info. Weather: Dense info, dew point at 11am This no scroll view provides rich weather info. Uses content as controls, revealing more info about specific content when you tap it. More taps, but each screen more digestible. Improves tap quality even though increases quantity. Tap quality more important than tap quantity.
  50. USA Today Experimented a lot with no-scroll screens, often with good success. Here, accordion control to manage their pictures screen. Lots of chrome but with a purpose. Animation hint to show people how to use the accordion control.
  51. Tried to do it with news, but obviously didn’t work. Went back to a standard list view. Sometimes you just need to scroll, that’s okay. Animation hint at top of screen. Be scroll skeptic, but no need to be dogmatic. Scrolling/flicking part of the fun.
  52. Less successful when they tried it with headlines. This early mockup shows the approach only showed one headline at a time on the headlines page. Unacceptable. Went back to list view
  53. Scrolling necessary sometimes Long lists: email, news feeds, to-do lists But have to keep main controls in view Here the Wall/Info/Photos tabs scroll out of view
  54. In Facebook v3, changes in overall navigation provided room to anchor those controls to the bottom instead, so they don’t scroll. If you’re going to have scrolling content, be sure the primary controls remain within view.
  55. Whether or not you decide to go with no-scroll screens, useful exercise to ask: can this be one screen? Scroll skepticism often leads to simpler layouts, and that’s the point. It’s a useful filter to help you: Eliminate controls, turn content into controls Do you really need all those features? What’s the minimum you need to offer?
  56. If you’re building an app to fly an airplane, you might build this...
  57. ...when your customers really want this. What’s their goal? Help them get there as fast as they can.
  58. Momento: Great micro-journal, record moments of the day. Can attach things to your moment with icons on screen, but doesn’t leave much room for the main event, the content. Common problem for Twitter apps
  59. Tweetie solved it elegantly. The standard view shows no secondary tools. Focused entirely on primary task: Tapping out a tweet.
  60. Instead, hides tools behind a secret panel. Secondary tools are shifted to a secondary view. Trouble with secret panels is that they have to be discoverable. Latch hidden in plain sight. In recent releases, added animation hint. Optimize each screen for the primary task. Secondary tools and controls behind hidden doors and secret panels.
  61. All of this takes a lot of thought and planning. Simple is hard, and effortless takes lots of work. You have to think ahead.
  62. My friends’ six-year old hatched a scheme to trap her grandmother in a cage. Complex plans are best worked out on paper. Involve stakeholders at this stage, even getting them to participate in the sketches. Changing paper is cheap, but changing pixels is often expensive.
  63. Things did a complete paper prototype before starting to build.
  64. Get to screen as soon as possible after you’ve got your paper flow planned. Early PCalc prototypes let developer James Thomson get a feel for the device. Make sure it feels right, buttons well sized, in comfortable position.
  65. On left: Early prototype for Twitterrific, final screen on right. Lets you test before investing in the expensive, pixel-perfect work of aesthetic design. It’s the bones of the app, the features and controls and layout, that will determine whether it’s tapworthy.