SlideShare a Scribd company logo
SENSATIONAL IOS APP DESIGN:

                                  FIRST PRINCIPLES AND
                                  NEW TRENDS FOR 2012


                      CHIA HWU & EVAN KIRCHHOFF, QUBOP INC.
                      IOS DEVELOPER MEETUP, JANUARY 9, 2012



JANUARY 9, 2012 - WWW.QUBOP.COM
HELLO!

                                    CHIA HWU, CEO
                                    CHIA@QUBOP.COM
                                    TWITTER: @CHIAH


                                    EVAN KIRCHHOFF, CTO
                                    EVAN@QUBOP.COM
                                    TWITTER: @THEEVANK



                                  WWW.QUBOP.COM
JANUARY 9, 2012 - WWW.QUBOP.COM
CUMULATIVE USERBASE, LATE 2011
 250M                                              250M


 200M                                              200M


  150M                                             150M


  100M                                             100M


  50M                                              50M



     2005 2006 2007 2008 2009 2010          2011      2005   2006   2007    2008   2009   2010   2011


                IOS (ALL)         ANDROID                     PS3          XBOX 360        WII

                                   (WORLDWIDE USERS IN MILLIONS)
JANUARY 9, 2012 - WWW.QUBOP.COM
THE ICON GRID (EARLY 2011)




      FACEBOOK                    LINKEDIN   YELP       SCVNGR



JANUARY 9, 2012 - WWW.QUBOP.COM
DEATH OF THE ICON GRID (LATE 2011)




            FACEBOOK              LINKEDIN         YELP

JANUARY 9, 2012 - WWW.QUBOP.COM
THE MOBILE APP USER LIFE CYCLE


               -38%                                 1 DAY



            -50%                                   1 WEEK



      -90%                                         6 MONTHS


JANUARY 9, 2012 - WWW.QUBOP.COM   SOURCE: FLURRY
1. FIRST PRINCIPLES
         2. CURRENT ISSUES
         3. NEW TRENDS
JANUARY 9, 2012 - WWW.QUBOP.COM
FIRST PRINCIPLES:



                  PIXELS MATTER


JANUARY 9, 2012 - WWW.QUBOP.COM
From http://stam-design-
stam.blogspot.com/2011/10/
ios-5.html
From http://stam-design-
stam.blogspot.com/2011/10/
ios-5.html
From http://stam-design-
stam.blogspot.com/2011/10/
ios-5.html
SQUARE (IOS)




JANUARY 9, 2012 - WWW.QUBOP.COM
Sensational iOS App Design: First Principles and New Trends for 2012
THINK OF APPLE AS YOUR INITIAL AUDIENCE.
APPLE VALUES BEAUTY OVER HUMAN INTERFACE GUIDELINE COMPLIANCE




              PULSE               NESS       BAND OF THE DAY

JANUARY 9, 2012 - WWW.QUBOP.COM
(THE GUIDELINES ADVISE AGAINST SPLASH SCREENS,
                   BUT APPLE DESIGN AWARD WINNERS USE THEM)




              PULSE                  NESS             BAND OF THE DAY

JANUARY 9, 2012 - WWW.QUBOP.COM
FIRST PRINCIPLES:


               GREAT DESIGN IS
                  INVISIBLE

JANUARY 9, 2012 - WWW.QUBOP.COM
CUSTOM UI THAT NOBODY NOTICED




                              (NOT THE NATIVE CAMERA INTERFACE)
JANUARY 9, 2012 - WWW.QUBOP.COM
FIRST PRINCIPLES:


          NEVER APOLOGIZE,
           NEVER EXPLAIN

JANUARY 9, 2012 - WWW.QUBOP.COM
ASSUME NOBODY READS ANYTHING
JANUARY 9, 2012 - WWW.QUBOP.COM
ASSUME NOBODY READS ANYTHING
JANUARY 9, 2012 - WWW.QUBOP.COM
(EXCEPT IN JAPAN)
JANUARY 9, 2012 - WWW.QUBOP.COM
FIRST PRINCIPLES:


                    MAKE CHOICES
                     FOR USERS

JANUARY 9, 2012 - WWW.QUBOP.COM
DO THE RIGHT THING
MOBIMILEAGE:
                         THE BATTLE FOR ZERO CONFIGURATION
JANUARY 9, 2012 - WWW.QUBOP.COM
NOT THE RIGHT THING:

                                    SET ACCURACY
                   LOW                                    HIGH


                                  NOTE: HIGHER ACCURACY
                                   REDUCES BATTERY LIFE




JANUARY 9, 2012 - WWW.QUBOP.COM
ALSO THINK ABOUT WHEN TO
                         SAVE AND RESTORE STATE

            - (void)applicationWillResignActive:(UIApplication *)application

            - (void)applicationDidEnterBackground:(UIApplication *)application

            - (void)applicationWillEnterForeground:(UIApplication *)application

            - (void)applicationDidBecomeActive:(UIApplication *)application

            - (void)applicationWillTerminate:(UIApplication *)application




  (INCLUDING THE DIFFERENT SHUTDOWN SCENARIOS)

JANUARY 9, 2012 - WWW.QUBOP.COM
FIRST PRINCIPLES:


               TRUST IS
          A FINITE RESOURCE

JANUARY 9, 2012 - WWW.QUBOP.COM
PATH (IOS)
            VERSION 1
           EARLY 2011




JANUARY 9, 2012 - WWW.QUBOP.COM
SCOOPLE
JANUARY 9, 2012 - WWW.QUBOP.COM
CURRENT ISSUES:


                    DON’T LEARN
                   FROM THE WEB

JANUARY 9, 2012 - WWW.QUBOP.COM
Sensational iOS App Design: First Principles and New Trends for 2012
SOUTHWEST AIRLINES IPHONE APP
                                        (JANUARY 2012)
JANUARY 9, 2012 - WWW.QUBOP.COM
Sensational iOS App Design: First Principles and New Trends for 2012
EXPEDIA HOTELS IPHONE APP
                                       (JANUARY 2012)
JANUARY 9, 2012 - WWW.QUBOP.COM
Sensational iOS App Design: First Principles and New Trends for 2012
AMAZON IPHONE APP
                                    (JANUARY 2012)
JANUARY 9, 2012 - WWW.QUBOP.COM
CURRENT ISSUES:


       COUNT YOUR CLICKS


JANUARY 9, 2012 - WWW.QUBOP.COM
HOW MANY CLICKS?




JANUARY 9, 2012 - WWW.QUBOP.COM
1


JANUARY 9, 2012 - WWW.QUBOP.COM
2


JANUARY 9, 2012 - WWW.QUBOP.COM
3


JANUARY 9, 2012 - WWW.QUBOP.COM
4,5,
                                  6,7

JANUARY 9, 2012 - WWW.QUBOP.COM
8


JANUARY 9, 2012 - WWW.QUBOP.COM
DON’T FORCE WORKFLOW ON MOBILE




JANUARY 9, 2012 - WWW.QUBOP.COM
JANUARY 9, 2012 - WWW.QUBOP.COM
CURRENT ISSUES:


             CROSS-PLATFORM
               CONSISTENCY

JANUARY 9, 2012 - WWW.QUBOP.COM
FOURSQUARE (IOS)     FOURSQUARE (ANDROID)

JANUARY 9, 2012 - WWW.QUBOP.COM
SQUARE (IOS)   SQUARE (ANDROID)
JANUARY 9, 2012 - WWW.QUBOP.COM
FACEBOOK (IOS)   FACEBOOK (ANDROID)
JANUARY 9, 2012 - WWW.QUBOP.COM
PATH VERSION 2 (IOS)    PATH VERSION 2 (ANDROID)

JANUARY 9, 2012 - WWW.QUBOP.COM
NEW TRENDS:


            5-TAB SOCIAL APP


JANUARY 9, 2012 - WWW.QUBOP.COM
THE 5-TAB SOCIAL APP WITH CENTER ICON




          INSTAGRAM               PATH (VERSION 1)   COLOR
JANUARY 9, 2012 - WWW.QUBOP.COM
HIPSTER             SOUNDTRACKING    FOODSPOTTING


                   THE CENTER TAB ANSWERS THE QUESTION,
                        “WHAT DO I DO WITH THIS APP?”
JANUARY 9, 2012 - WWW.QUBOP.COM
EVERNOTE             PINTEREST         PHOTOVINE


                   THE CENTER TAB ANSWERS THE QUESTION,
                        “WHAT DO I DO WITH THIS APP?”
JANUARY 9, 2012 - WWW.QUBOP.COM
SOCIALCAM             OINK              STAMPED


                   THE CENTER TAB ANSWERS THE QUESTION,
                        “WHAT DO I DO WITH THIS APP?”
JANUARY 9, 2012 - WWW.QUBOP.COM
FOURSQUARE (PREVIOUS)   FOURSQUARE (NOW)
JANUARY 9, 2012 - WWW.QUBOP.COM
NEW TRENDS:


                     DEATH OF THE
                       TAB BAR?

JANUARY 9, 2012 - WWW.QUBOP.COM
HIDDEN NAVIGATION: REPLACING TAB BARS




      FACEBOOK                    PATH V2   DOLPHIN   NEWS 360
                                            BROWSER

JANUARY 9, 2012 - WWW.QUBOP.COM
HIDDEN NAVIGATION: REPLACING TAB BARS




     SCOOPLE (JUNE 2011)              LINKEDIN

JANUARY 9, 2012 - WWW.QUBOP.COM
HIDDEN NAVIGATION: DON’T HIDE IT TOO MUCH




                                  DOLPHIN BROWSER
JANUARY 9, 2012 - WWW.QUBOP.COM
NEW TRENDS:


               USERS EXPECT
              PULL TO REFRESH

JANUARY 9, 2012 - WWW.QUBOP.COM
PULL TO REFRESH: A NON-APPLE CONVENTION




       TWITTER                    BOXCAR   FACEBOOK    SEESMIC
                                           MESSENGER



JANUARY 9, 2012 - WWW.QUBOP.COM
NEW TRENDS:


          SIDEWAYS SLIDERS


JANUARY 9, 2012 - WWW.QUBOP.COM
SIDEWAYS SLIDERS




              PULSE                     COLOR        GOWALLA (R.I.P.)

JANUARY 9, 2012 - WWW.QUBOP.COM
NEW TRENDS:


                         THE RISE
                       OF GESTURES

JANUARY 9, 2012 - WWW.QUBOP.COM
Sensational iOS App Design: First Principles and New Trends for 2012
DOLPHIN BROWSER

JANUARY 9, 2012 - WWW.QUBOP.COM
NEW TRENDS:


                    IPAD - IPHONE
                    CONVERGENCE

JANUARY 9, 2012 - WWW.QUBOP.COM
TRADITIONAL IPAD
            SPLIT-VIEW CONTROLLER
                  (APPLE MAIL)
JANUARY 9, 2012 - WWW.QUBOP.COM
HOW TO DESIGN FOR IPAD:


        DESIGN FOR IPHONE,
   ADD BREATHING ROOM

JANUARY 9, 2012 - WWW.QUBOP.COM
FACEBOOK
                                          (IPHONE)



                       FACEBOOK (IPAD)
JANUARY 9, 2012 - WWW.QUBOP.COM
FLIPBOARD (IPHONE)




                                  FLIPBOARD (IPAD)
JANUARY 9, 2012 - WWW.QUBOP.COM
THANKS!

                                    CHIA HWU, CEO
                                    CHIA@QUBOP.COM
                                    TWITTER: @CHIAH


                                    EVAN KIRCHHOFF, CTO
                                    EVAN@QUBOP.COM
                                    TWITTER: @THEEVANK



                                  WWW.QUBOP.COM
JANUARY 9, 2012 - WWW.QUBOP.COM

More Related Content

PPTX
Designing For Mobile - by Nikhil Deshpande
PDF
Essential Mobile Design: Interface Principles and Best Practices for iOS, And...
PDF
21st century icon
DOCX
Steve jobs
PDF
Internet Marketing Magazine 10-2012
PPTX
Apple inc
PPTX
Steve jobs
PPTX
AS media coursework
Designing For Mobile - by Nikhil Deshpande
Essential Mobile Design: Interface Principles and Best Practices for iOS, And...
21st century icon
Steve jobs
Internet Marketing Magazine 10-2012
Apple inc
Steve jobs
AS media coursework

Viewers also liked (18)

PDF
5 Principles of Killer Mobile Apps: How to Think About Product Design for iOS
PPTX
Apps for good- Wire frames
PPTX
Survey of video sharing apps
PPTX
Mobile Apps -- From Idea to Execution
PDF
Startup lessons: Pitching and continuation (Åbo Akademi)
PDF
Design of the Kontakios iOS app
PPTX
Pitching a startup idea
PPT
No Story No Company
PDF
Date a Startup. Let us introduce ourselves
PDF
Training session - Pitching Your Startup or App to the Media
PDF
Start a revolution... in your bedroom.
PDF
SWCDO 101: The Business Model Canvas
PDF
Mobile Apps - Getting Your Idea Across
PPTX
Mobile app ideas 2017
PDF
Day in the life of a mobile video user
PPTX
SWCDO 101: Pitching your startup idea
PDF
Startup Pitching and Mobile App Startup
PDF
Mobile App Design course (iOS & Android)
5 Principles of Killer Mobile Apps: How to Think About Product Design for iOS
Apps for good- Wire frames
Survey of video sharing apps
Mobile Apps -- From Idea to Execution
Startup lessons: Pitching and continuation (Åbo Akademi)
Design of the Kontakios iOS app
Pitching a startup idea
No Story No Company
Date a Startup. Let us introduce ourselves
Training session - Pitching Your Startup or App to the Media
Start a revolution... in your bedroom.
SWCDO 101: The Business Model Canvas
Mobile Apps - Getting Your Idea Across
Mobile app ideas 2017
Day in the life of a mobile video user
SWCDO 101: Pitching your startup idea
Startup Pitching and Mobile App Startup
Mobile App Design course (iOS & Android)
Ad

Similar to Sensational iOS App Design: First Principles and New Trends for 2012 (20)

PDF
Hwu Chia - Trends in mobile health mHealth
PDF
Mobileweb
PDF
Developing for Windows Phone: A Guide for iOS Developers
PDF
Effective Mobile & Social Media Marketing Strategies - Handout Reference Mate...
PDF
Paul Trani - WVnyc2012
PDF
Things Every Designer Should Know About Creating for Devices
PDF
01 Mobile Web Introduction
PDF
Devcon5 presentation handout
PDF
Devcon5 presentation handout
 
PPTX
Brunei keynote Library Futures
PPT
1. nick lansley mi m 2012
PPT
1. nick lansley mi m 2012
PDF
madreport Q3 2014 seamless edition
PDF
What Lies Ahead for HTML5
PDF
What lies ahead of HTML5_Ooop Munich 2013_Krzysztof Szafranek
PDF
Hamish Willee
PDF
Prophets trends in Interactive Design 2012
PDF
BBDO Wordshop Digital Age Jan2011
PDF
Prophets trends-in-interactive-design
PDF
Nigeria & Designing for the Mobile Web
Hwu Chia - Trends in mobile health mHealth
Mobileweb
Developing for Windows Phone: A Guide for iOS Developers
Effective Mobile & Social Media Marketing Strategies - Handout Reference Mate...
Paul Trani - WVnyc2012
Things Every Designer Should Know About Creating for Devices
01 Mobile Web Introduction
Devcon5 presentation handout
Devcon5 presentation handout
 
Brunei keynote Library Futures
1. nick lansley mi m 2012
1. nick lansley mi m 2012
madreport Q3 2014 seamless edition
What Lies Ahead for HTML5
What lies ahead of HTML5_Ooop Munich 2013_Krzysztof Szafranek
Hamish Willee
Prophets trends in Interactive Design 2012
BBDO Wordshop Digital Age Jan2011
Prophets trends-in-interactive-design
Nigeria & Designing for the Mobile Web
Ad

Recently uploaded (20)

PDF
Urban Design Final Project-Site Analysis
PPTX
BSCS lesson 3.pptxnbbjbb mnbkjbkbbkbbkjb
PPTX
Complete Guide to Microsoft PowerPoint 2019 – Features, Tools, and Tips"
PPT
WHY_R12 Uaafafafpgradeaffafafafaffff.ppt
PPTX
Wisp Textiles: Where Comfort Meets Everyday Style
DOCX
actividad 20% informatica microsoft project
PPTX
EDP Competencies-types, process, explanation
PDF
Trusted Executive Protection Services in Ontario — Discreet & Professional.pdf
PDF
Quality Control Management for RMG, Level- 4, Certificate
PPTX
Tenders & Contracts Works _ Services Afzal.pptx
PDF
Chalkpiece Annual Report from 2019 To 2025
PDF
Facade & Landscape Lighting Techniques and Trends.pptx.pdf
PPTX
YV PROFILE PROJECTS PROFILE PRES. DESIGN
PPT
EGWHermeneuticsffgggggggggggggggggggggggggggggggg.ppt
PPTX
Entrepreneur intro, origin, process, method
PPT
pump pump is a mechanism that is used to transfer a liquid from one place to ...
PPTX
Implications Existing phase plan and its feasibility.pptx
PDF
Integrated-2D-and-3D-Animation-Bridging-Dimensions-for-Impactful-Storytelling...
PPTX
Special finishes, classification and types, explanation
PPT
Machine printing techniques and plangi dyeing
Urban Design Final Project-Site Analysis
BSCS lesson 3.pptxnbbjbb mnbkjbkbbkbbkjb
Complete Guide to Microsoft PowerPoint 2019 – Features, Tools, and Tips"
WHY_R12 Uaafafafpgradeaffafafafaffff.ppt
Wisp Textiles: Where Comfort Meets Everyday Style
actividad 20% informatica microsoft project
EDP Competencies-types, process, explanation
Trusted Executive Protection Services in Ontario — Discreet & Professional.pdf
Quality Control Management for RMG, Level- 4, Certificate
Tenders & Contracts Works _ Services Afzal.pptx
Chalkpiece Annual Report from 2019 To 2025
Facade & Landscape Lighting Techniques and Trends.pptx.pdf
YV PROFILE PROJECTS PROFILE PRES. DESIGN
EGWHermeneuticsffgggggggggggggggggggggggggggggggg.ppt
Entrepreneur intro, origin, process, method
pump pump is a mechanism that is used to transfer a liquid from one place to ...
Implications Existing phase plan and its feasibility.pptx
Integrated-2D-and-3D-Animation-Bridging-Dimensions-for-Impactful-Storytelling...
Special finishes, classification and types, explanation
Machine printing techniques and plangi dyeing

Sensational iOS App Design: First Principles and New Trends for 2012