Successfully reported this slideshow.

All The Screens: Cross Platform Design Strategies

111

Share

Loading in …3
×
1 of 29
1 of 29

All The Screens: Cross Platform Design Strategies

111

Share

Download to read offline

Mobile sites, responsive web, mobile apps, native, HTML5 or hybrid apps…Which of these solutions and combinations are right for your industry and product? We’ll take a look at examples of each and how companies are leveraging different solutions to meet their customer’s mobile needs. We’ll also explore the pitfalls of designing hybrid apps, and best practices for device neutral design. Finally, we’ll look at a case study from the world’s largest non-profit health organization and the cross platform strategy we are designing.

Mobile sites, responsive web, mobile apps, native, HTML5 or hybrid apps…Which of these solutions and combinations are right for your industry and product? We’ll take a look at examples of each and how companies are leveraging different solutions to meet their customer’s mobile needs. We’ll also explore the pitfalls of designing hybrid apps, and best practices for device neutral design. Finally, we’ll look at a case study from the world’s largest non-profit health organization and the cross platform strategy we are designing.

More Related Content

Related Books

Free with a 14 day trial from Scribd

See all

All The Screens: Cross Platform Design Strategies

  1. All The Screens: Cross Platform Design Strategies
  2. I work as a Consultant, helping companies with their UX Strategy. Theresa Neil
  3. SWEDEN TEXAS
  4. Lufthansa Across Platforms Classic Web Site Mobile Optimized Site In Flight Entertainment Native Tablet App Kiosk Native Mobile Apps
  5. Netflix Across Platforms Classic Web Site Hybrid Tablet Apps Hybrid Mobile Apps TV (Boxee) Game Console (XBox) Game Device (Playstation)
  6. ? What are the options for a cross platform strategy...
  7. Responsive Site Native App Web And /Or Installed Optimized Sites Hybrid App
  8. Responsive Web Site Defined Web site responds to the environment using css media queries. Typically achieved by using fluid grid layouts, like Responsive Grid System, Bootstrap, from Twitter, or Foundation by Zurb.
  9. Responsive Web Site UIWindow 768 x 1024 Cisco London 2012
  10. Responsive Web Site Ideal For Informational Web Sites Portfolios Content Consumption Sites • Newspapers • Magazines • Blogs Boston Globe
  11. If you want to learn more about designing for...
  12. Optimized Web Sites Defined Multiple web sites, each optimized for a different form factor, and different usage needs. Connect Smartphone Home At 80 Tablet Search Laptop 60 On The Go Entertain Manage 40 While Shopping Inform 20 At Work Shop On Public Navigate0 Transport At Home AM To/From School/Work At School/Work Out and About At Home PM 0 0 10 25 20 50 7530 10040 Mobile PC Mobile Usage Patterns
  13. Optimized Web Sites Some companies have three distinct sites... Mobile Web Site Tablet Web Site Classic Web Site
  14. Optimized Web Sites More often there are only two distinct sites. Amazonʼs Classic Web Site & Tablet Site Mobile Web Site
  15. Optimized Web Sites The mobile version is streamlined for core activities. jetBlueʼs Classic Web Site & Tablet Site Mobile Web Site
  16. Optimized Web Sites Ideal For Retail Search SaaS products Other web apps Basecamp
  17. If you want to learn more about designing for...
  18. Native Apps Defined An application that has been developed for use on a particular platform or device. Typically native apps are coded with: Objective C for Apple Java for Android and BlackBerry C# or Visual Basic for Windows 7.5 But there are also other options: Ruby Motion MonoTouch and MonoDroid Adobe AIR Adobe Flex 4.5 Showcase Apps
  19. Native Apps Evernote for BlackBerry Phone & Tablet, Android Phone & Tablet, iOS Phone & Tablet, Windows Phone
  20. Native Apps Xamarian MWC 2012 App C#, MonoTouch, MonoDroid
  21. Native Apps Ideal For Retail Financial Software (productivity tools) Games Enterprise Apps Benefits over Hybrid Better Performance Keynote (like PPT for Apple)
  22. Hybrid Apps Defined A ʻnative wrappedʼ web application. Products like Titanium and PhoneGap create a native wrapper that let the HTML and JS access OS dependent operations they could access on their own. NBC-Built with Titanium
  23. Hybrid Apps LinkedIn http://venturebeat.com/2011/08/16/linkedin-node/
  24. Hybrid Apps Netflix http://functionsource.com/post/netflix-feature
  25. Hybrid Apps Ideal For Software (productivity tools) Enterprise Apps Video Players Retail Benefits over Native Web analytics A/B testing Possibly lower costs Facebook
  26. Responsive Site Native App Web And /Or Installed Optimized Sites Hybrid App
  27. Boston Globeʼs Cross Platform Strategy Responsive Site Native Apps And
  28. eBayʼs Cross Platform Strategy Optimized Sites Native Apps And
  29. Thank You Follow me on Twitter @theresaneil Read my book and blog: “Mobile Design Pattern Gallery” OʼReilly 2012

×