• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Multiscreen Design Strategies
 

Multiscreen Design Strategies

on

  • 2,583 views

Fragmentation of capabilities across mobile platforms creates both difficulties and opportunities as designers craft experiences for the varied platform landscape. This discussion will look at how ...

Fragmentation of capabilities across mobile platforms creates both difficulties and opportunities as designers craft experiences for the varied platform landscape. This discussion will look at how interaction patterns are changing and how designers will create experiences that take advantage them.

Statistics

Views

Total Views
2,583
Views on SlideShare
2,275
Embed Views
308

Actions

Likes
14
Downloads
0
Comments
0

4 Embeds 308

http://floatlearning.com 305
http://translate.googleusercontent.com 1
http://stage.floatlearning.com 1
http://131.253.14.66 1

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Multiscreen Design Strategies Multiscreen Design Strategies Presentation Transcript

    • Multiscreen Design Strategies FloatLearning 2011 Josh Campbell Magic MightFriday, June 10, 2011
    • Innovation through Magic Might Design strategy and execution at the intersection of mobile, web and beyond 2Friday, June 10, 2011
    • Multiscreen Design Strategies Magic Might 3Friday, June 10, 2011
    • Multiscreen Design Strategies Magic Might 4Friday, June 10, 2011
    • Multiscreen Design Strategies Magic Might 5Friday, June 10, 2011
    • Topics • How to target experiences (market overview) • Interaction Patterns • Gestural Differences • Coordinated screen designs • Q&A Magic Might 6Friday, June 10, 2011
    • Considerations & Constraints Magic Might 7Friday, June 10, 2011
    • Considerations The decision points you weigh in your design. Magic Might 8Friday, June 10, 2011
    • Constraints The known, fixed elements that you design for. Magic Might 9Friday, June 10, 2011
    • UX Landscape For “Mobile” applications Magic Might 10Friday, June 10, 2011
    • Impact of Product & Software design on Application Designers Magic Might 11Friday, June 10, 2011
    • iOS Easy right? Magic Might 12Friday, June 10, 2011
    • Which iOS? iOS 3, 4 or the upcoming 5? Magic Might 13Friday, June 10, 2011
    • Retina-Display? Retina or Original display? Magic Might 14Friday, June 10, 2011
    • iPad or iPhone? Screen dimensions Magic Might 15Friday, June 10, 2011
    • Even iOS has complications Apple still requires you to think about their product design in your application design. Magic Might 16Friday, June 10, 2011
    • Android Much less focused. Magic Might 17Friday, June 10, 2011
    • Android Versions Cupcake 6 Donut Eclair Froyo Gingerbread Honeycomb Magic Might 18Friday, June 10, 2011
    • Android Versions 70% 64.6% 52.5% 35% 21.2% 17.5% 0.092 1.9% 2.5% 0.006 Cupcake Donut Eclair Froyo Gingerbread Honeycomb Versions Data collected during a 14-day period ending on June 1, 2011 http://goo.gl/sgND Magic Might 19Friday, June 10, 2011
    • Android Resolutions 80% 75.2% 60% 40% 20% 17% 3.3% 2.8% 0.7% 1.1% Small Normal Large Xlarge Small Normal Large Xlarge Small Normal Large Xlarge HDPI MDPI LDPI Data collected during a 14-day period ending on June 1, 2011 http://goo.gl/Ow8r Magic Might 20Friday, June 10, 2011
    • What’s your HDPI? 800x480 854x480 960x540 1280x800 Magic Might 21Friday, June 10, 2011
    • Screen Dimensions 4.5” 800x480 4.3” 800x480 4” 800x480 4” 960x540 3.7” 854x480 Magic Might 22Friday, June 10, 2011
    • not to mention... Processor differences Color Depth Button Placement UI themes Magic Might 23Friday, June 10, 2011
    • But that’s just iOS and Android... Magic Might 24Friday, June 10, 2011
    • Others are just as varied. Magic Might 25Friday, June 10, 2011
    • ... Blackberry Symbian Windows Palm Magic Might 26Friday, June 10, 2011
    • Mobile OS-North America All phones types 40% 36.23% 30% 27.86% 21.17% 20% 10% 8.22% 6.46% iOS Android Blackberry Symbian Other Versions Data collected during a 3 month period March to May 2011 http://goo.gl/o1AJW Magic Might 27Friday, June 10, 2011
    • Mobile OS-Worldwide All phones types 40% 31.9% 30% 23.2% 20% 16.55% 15.56% 13.49% 10% iOS Android Blackberry Symbian Other Versions Data collected during a 3 month period March to May 2011 http://goo.gl/o1AJW Magic Might 28Friday, June 10, 2011
    • Mobile OS-North America Smartphones 60% 51% 45% 42% 32% 32% 30% 24% 15% 12% 8% 3% 1% 1% 0% 0% 2010 2011 2010 2011 2010 2011 2010 2011 2010 2011 2010 2011 iOS Android Blackberry Symbian WebOS Windows Phone Data collected from March to June in 2011 and 2010 http://goo.gl/yl8O Magic Might 29Friday, June 10, 2011
    • Mobile OS-Worldwide Smartphones 50% 41% 37% 37.5% 35% 27% 25% 20% 17% 16% 12.5% 6% 0.59% 0.18% 2010 2011 2010 2011 2010 2011 2010 2011 2010 2011 Symbian iOS Blackberry Android WebOS Data collected from March to June in 2011 and 2010 http://goo.gl/yl8O Magic Might 30Friday, June 10, 2011
    • The landscape is clearly fragmented... Magic Might 31Friday, June 10, 2011
    • Your design should be too Magic Might 32Friday, June 10, 2011
    • Design with a Benchmark in mind Magic Might 33Friday, June 10, 2011
    • Benchmark • Screen Size (Dimensions) • Screen Resolution • OS & Version • Tablet/Phone • Processing Speed • Input Requirements • Upgradability? Magic Might 34Friday, June 10, 2011
    • Look for the largest market and define a clear benchmark Try to serve the fewest number of people with each benchmark Magic Might 35Friday, June 10, 2011
    • Don’t reinvent, reorganize Use the paradigms that are people are most familiar with and the OS provides to make it easier... Magic Might 36Friday, June 10, 2011
    • A simple example Magic Might 37Friday, June 10, 2011
    • Twitter for iPad Magic Might 38Friday, June 10, 2011
    • Twitter for iPad Magic Might 38Friday, June 10, 2011
    • Twitter for iPad Magic Might 38Friday, June 10, 2011
    • Twitter for iPad A B C Magic Might 38Friday, June 10, 2011
    • Twitter for OS X Magic Might 39Friday, June 10, 2011
    • Twitter for OS X A B Magic Might 39Friday, June 10, 2011
    • Twitter for iPhone Magic Might 40Friday, June 10, 2011
    • Twitter for iPhone A B C Magic Might 40Friday, June 10, 2011
    • Twitter for Android Magic Might 41Friday, June 10, 2011
    • Twitter for Android A B C Magic Might 41Friday, June 10, 2011
    • Email Account Bob Smith 8:12 AM Very important Message Amazon.com 7:32 AM Your Amazon.com order has shipped Built in Chicago 4:32 PM Built in Chicago Weekly Update: Spot- TT Chicago 3:45 PM TastingTable CHI: The citys most exciting W3C Newsletter 2:18 PM W3C Public Newsletter Scott Wilson 8:12 AM Magic Might 42Friday, June 10, 2011
    • Email Account Bob Smith 8:12 AM Very important Message Amazon.com 7:32 AM Your Amazon.com order has shipped Built in Chicago 4:32 PM Built in Chicago Weekly Update: Spot- TT Chicago 3:45 PM TastingTable CHI: The citys most exciting W3C Newsletter 2:18 PM W3C Public Newsletter Scott Wilson 8:12 AM Magic Might 42Friday, June 10, 2011
    • Built in Chicago 4:32 PM Email Account Built in Chicago Weekly Update: Spot- light on Obtiva, Startup City and Some Bob Events Great Smith 8:12 AM Very important Message Built in Chicago Promoting digital innovation in the Amazon.com worlds greatest city 7:32 AM A message to all members ofshipped Your Amazon.com order has Built in Chicago Built in Chicago Dear Built in Chicago Members, 4:32 PM Built in Chicago Weekly Update: Spot- A quick note to thank everyone for such a great month of activity--we are over TT Chicago 3,200 members and almost 800 blog PM 3:45 posts, averaging 800+ citys most exciting TastingTable CHI: The visits/day. Be sure to Follow Us on Twitter so we can start sharing your updates and celebrat- W3C Newsletter ing your successes. Also, check out a PM 2:18 W3C Public Newsletter few great upcoming events below-you wont want to miss the chance to hear some of the best local entrepreneurs Scott Wilson A final note remind- share their stories. 8:12 AM ing everyone to upload a profile picture Magic Might 42Friday, June 10, 2011
    • Email Account A Built in Chicago 4:32 PM Built in Chicago Weekly Update: Spot- light on Obtiva, Startup City and Some Bob Smith 8:12 AM Great Events Very important Message Built in Chicago Promoting digital innovation in the Amazon.com 7:32 AM worlds greatest city Your Amazon.com order has shipped A message to all members of Built in Chicago Built in Chicago 4:32 PM C Dear Built in Chicago Members, B Built in Chicago Weekly Update: Spot- A quick note to thank everyone for such a great month of activity--we are over TT Chicago 3:45 PM 3,200 members and almost 800 blog TastingTable CHI: The citys most exciting posts, averaging 800+ visits/day. Be sure to Follow Us on Twitter so we can start sharing your updates and celebrat- W3C Newsletter 2:18 PM ing your successes. Also, check out a W3C Public Newsletter few great upcoming events below-you wont want to miss the chance to hear some of the best local entrepreneurs Scott Wilson 8:12 AM share their stories. A final note remind- ing everyone to upload a profile picture Magic Might 43Friday, June 10, 2011
    • Gmail for Honeycomb Magic Might 44Friday, June 10, 2011
    • Gmail for Honeycomb A B Magic Might 44Friday, June 10, 2011
    • Gmail for Honeycomb Magic Might 45Friday, June 10, 2011
    • Gmail for Honeycomb B C Magic Might 45Friday, June 10, 2011
    • Sparrow OS X Magic Might 46Friday, June 10, 2011
    • Sparrow OS X A B Magic Might 46Friday, June 10, 2011
    • Sparrow OS X Magic Might 47Friday, June 10, 2011
    • Sparrow OS X A B C Magic Might 47Friday, June 10, 2011
    • Screen constructs for multiple devices Magic Might 48Friday, June 10, 2011
    • Multi Pane Magic Might 49Friday, June 10, 2011
    • Grid Layouts Magic Might 50Friday, June 10, 2011
    • Coverflow/Carousel Magic Might 51Friday, June 10, 2011
    • Use interaction patterns that work well across screens. Multi-Pane is great for tablets & tvs Grid layouts work well for direct manipulation Carousels work well for indirect manipulation Magic Might 52Friday, June 10, 2011
    • Keep the Idea & Intent of the application the same Magic Might 53Friday, June 10, 2011
    • Optimize the interaction and layout for the target device benchmark. Magic Might 54Friday, June 10, 2011
    • But what about the fragmentation? Magic Might 55Friday, June 10, 2011
    • Be Ruthless. Pick a Benchmark. Your users will thank you. Magic Might 56Friday, June 10, 2011
    • Gestures & Input Magic Might 57Friday, June 10, 2011
    • Direct Indirect Magic Might 58Friday, June 10, 2011
    • Direct Indirect Magic Might 59Friday, June 10, 2011
    • Try to use analogous gestures: swipe = scroll tap = click press & hold = right-click Magic Might 60Friday, June 10, 2011
    • Last.fm Kinect Magic Might 61Friday, June 10, 2011
    • Last.fm Kinect Magic Might 61Friday, June 10, 2011
    • Gestures are slightly different for each platform. You apps should be too. Magic Might 62Friday, June 10, 2011
    • Multi screen interactions Magic Might 63Friday, June 10, 2011
    • Two of the Same Magic Might 64Friday, June 10, 2011
    • Two Different Magic Might 65Friday, June 10, 2011
    • 1+ devices working in concert Magic Might 66Friday, June 10, 2011
    • Two Way Communication Magic Might 67Friday, June 10, 2011
    • One Way Communication Magic Might 68Friday, June 10, 2011
    • One Way Communication Magic Might 69Friday, June 10, 2011
    • Inform other Participants Magic Might 70Friday, June 10, 2011
    • Multiple screens can enhance an experience by making it a shared experience. Magic Might 71Friday, June 10, 2011
    • Multiple screens can provide better input mechanisms. iPhone remote app provides a keyboard for Apple TV Magic Might 72Friday, June 10, 2011
    • Final Advice... Magic Might 73Friday, June 10, 2011
    • In a fragmented market your design probably should be too. Magic Might 74Friday, June 10, 2011
    • Have a tight benchmark as a starting point for the user experience. Magic Might 75Friday, June 10, 2011
    • Use gestures that are appropriate for each device and platform. Magic Might 76Friday, June 10, 2011
    • Look for opportunities to leverage multiple screens together for new ways to enhance learning. Magic Might 77Friday, June 10, 2011
    • The market changes fast, always be ready to adapt. Magic Might 78Friday, June 10, 2011
    • Questions Magic Might 79Friday, June 10, 2011
    • Thank you Josh Campbell @magicandmight Magic Might 80Friday, June 10, 2011