Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Mobile Mantras: Experience Design Best Practices for Mobile Development


Published on

Published in: Technology, Business
    my name is is my privet e-mail'(
    i will like to know you more. so that i can send you my picture and my detail's for you to know me more so I am waiting for your mail to my email address below. please don't chat me here just send me mail and i will get back to you with love.

    Are you sure you want to  Yes  No
    Your message goes here

Mobile Mantras: Experience Design Best Practices for Mobile Development

  1. 1. Mobile Mantras Experience Design Best Practices for Mobile Development Panel Participants Brian Assmus Additional Frank R Dellario ContributorsInspiring Human Perspective Matt DiGirolamo GihanAmarasinghe Rob Fitzgibbon SagiChaitas Hannah Liberty Andrew Georgiou Michelle McNulty Dr. Rob Johnson Ryan Travis AmitVyawahare
  2. 2. Executive Summary •  How we got here •  Basic XD Mantras •  Testing   2  
  3. 3. Back in the day, internet design was so   3  
  4. 4. Everything is so @#$@#^ complicated   4  
  5. 5. What do we mean by “mobile”? Apps vs. “Mobile-Friendly”   5  
  6. 6. And now…This is what we learned whilemaking it up as we went   6  
  7. 7. Basic Mantras/Guidelines•  Keep in mind that mobilization is content, context, and taskspecific•  Mobile requires a smaller, simpler version of a website that focuses on information and services•  Make the redirection to the mobile site automatic but allow access to the full site, ideally permitting mobile users to follow deep links into the site   7  
  8. 8. UX •  Define the use cases (for example, find a product price, find a store near you, call us, or perform a search). •  Order the use cases by the most frequent for a mobile user. Use your best guess, statistical information, and usability tests to keep this order updated. •  Simplify: Do your best to make every use case successful in no more than three clicks or at a page depth of no more than three. •  Touch/Swipe   8  
  9. 9. IA•  Search is the most important•  Minimize the amount of user text input required•  Group large lists by categories, each with no more than 10 items•  Provide the most-used features at the top•  Provide a Go to Top link in the footer•  Provide a Back link•  Use location services if   9  
  10. 10. IA Use top aligned labels for forms. Not only does this allow users to fill out the form faster, but it is also better for field   10  
  11. 11. IA•  Provide a link to full desktop site on all pages•  Use all the available width (i.e., not columns) for links, list elements, text inputs, and all possible focusable elements•  Maintain the total link count at no more than 10 per page•  Keep the main navigation to 3 or 4 links•  Avoid horizontal scrolling   11  
  12. 12. Visual•  Try your color palette in different environments (low light, bright sunlight, fluorescent lights)•  Keep graphics limited•  No to Low multimedia•  Maintain visual consistency with your desktop site or brand•  Think Condensed from the visual standpoint   12  
  13. 13. Visual•  Only essential elements are found on the home page•  Use background colors to separate sections•  Use legible fonts on every screen; don’t rely on the resolution   13  
  14. 14. Content•  Mobilize content – not just layout The ski resort of St. Moritz refocuses the content on their mobile website to be task based (what’s the weather, what lifts are open)•  Personalization &   14  
  15. 15. Content Take it Easy With Ads•  Small space can become easily cluttered.•  The New York Times is a good example of not porting all ads from the desktop   15  
  16. 16. Smaller Pieces Doesn’t Mean Less Consumption   16  
  17. 17. Content Don’t skimp on the content! Having a “light” site doesn’t mean you should leave out content from it. Some service providers apparently think that mobile users don’t need all that content – wrong! It’s a sure way to annoy and cause problems for people if you put one tenth of your content or shortened versions of articles on the mobile   HTTP://XKCD.COM/869/   17  
  18. 18. Testing MethodologiesChallenges:  •  Thousands  of  Mobile  Handsets  •  Different  Mobile  PlaDorms/OS  •  Different  Mobile  Carriers/Manufacturers  •  (Everything  is  so  @#$@#^  complicated  now)   18  
  19. 19. Mobile Usage vs. Testing Capabilities Smartphone  Pla2orm    Market  Share     Android   Apple   BlackBerry   Windows   Palm   19  
  20. 20. Types of Mobile Apps Testing •  User  Interface  TesRng   •  FuncRonal  TesRng     •  Performance  &  Stress  TesRng   •  Usability  TesRng              Addi%onal  key  tes%ng  types:   •  CompaRbility  TesRng   •  CerRficaRon  Compliance   •  Submission  Guidelines   •  InterrupRon  TesRng   •  Monkey  TesRng   •  Low/No  Network  TesRng   20  
  21. 21. Mobile Technology SetsPlatforms Android iOS Blackberry Windows WebOSDevices Various     Apple     Blackberry     Various     HP  /  Palm     HTML  /  CSS  /    Dev. Language Java     Objec;ve  C     Java     C#  /  C++  /  VB     JavaScript    Source Model Open     Closed     Closed     Closed     Closed     Limited    Multi-tasking Yes     Yes     Limited     Yes     (iOS  4+)     Webkit   Blackberry     Varies  with     WebOSStandard Browser Browser     Safari     Browser     Device  /  Carrier     Browser    Platforms GSM CDMA LTE HSPA+ WiMAX AT&T,     Verizon,     AT&T,    Devices Verizon     Sprint     T-­‐Mobile     Sprint     T-­‐Mobile     3G     3G     4G     4G     4G    Dev. Language 1769  /  739     848  /  506     6.44  /  5.0     2.48  /  1.05     2.15  /  .081     kbps     kbps     mbps     mbps     mbps    Source ModelMulti-tasking Yes     No     Yes     Yes     Yes   21  
  22. 22. Mobile App Test Strategy Remote Device Access Service •  Device Anywhere (Paid) •  Dawn of a New Era – the •  Perfecto Mobile (Paid) •  Nokia RDA (Free, For Symbian Phones) handset cloud -  Significantly lower Pros testing/development •  No purchase necessary costs •  Can select different carriers -  Works with flexible/agile •  More reliable than •  Automation capabilities. development methods Cons •  Takes time •  Reservations required •  High service costs   22  
  23. 23. Delivering Efficiency via Automation Test Automation Success Criteria Reliable   Maintainable   Scalable   •  Issues  detecRon  and   •  Minimum  sensiRvity  to   •  Test  coverage  expanded   security     applicaRon  and  test  case   efficiently   •  Accurate  VerificaRon     changes   •  Automated  test  cases   •  Unaaended  ExecuRon   •  Test  cases  separate  from   created  by  non  technical   automaRon  code   resources   23  
  24. 24. Mobile Automation   24  
  25. 25. 6 Emerging Trends in 2012 1.  Mobile  grabs  the  budget  spotlight   2.  Tablets  are  here  to  stay   3.  NFC  will  drive  mobile  payments   4.  Mobile  ALM  goes  mainstream   5.  TesRng  moves  to  the  cloud     6.  Private  clouds  for  mobile   25  
  26. 26. In Summary •  How we got here •  Basic XD Mantras •  Testing   26