Mobile Mantras: Experience Design Best Practices
•
1 gostou•606 visualizações
The document provides best practices for mobile experience design and development. It outlines basic mantras like keeping mobile sites simple and focused on key tasks. It also discusses testing methodologies, noting the challenges of testing across thousands of devices and platforms and the benefits of remote testing services and test automation. Emerging trends mentioned include the growing importance of mobile in budgets, the rise of tablets and NFC payments, and a shift to cloud-based mobile application lifecycle management and testing.
Recomendados
Mais conteúdo relacionado
Mais procurados
Mais procurados (19)
Semelhante a Mobile Mantras: Experience Design Best Practices
Semelhante a Mobile Mantras: Experience Design Best Practices (20)
Mais de Rob Fitzgibbon
Mobile Mantras: Experience Design Best Practices
- 1. Mobile Mantras Experience Design Best Practices for Mobile Development Panel Participants Brian Assmus Additional Frank R Dellario Contributors Matt DiGirolamo Gihan Amarasinghe Rob Fitzgibbon Sagi Chaitas Hannah Liberty Andrew Georgiou Michelle McNulty Dr. Rob Johnson Ryan Travis Amit Vyawahare
- 2. Executive Summary • How we got here • Basic XD Mantras • Testing Methodologies onetooneglobal.com 2
- 3. Back in the day, internet design was so mellow onetooneglobal.com 3
- 4. Everything is so @#$@#^ complicated now onetooneglobal.com 4
- 5. What do we mean by “mobile”? Apps vs. “Mobile-Friendly” Websites Native vs. web development onetooneglobal.com 5
- 6. And now… This is what we learned while making it up as we went along onetooneglobal.com 6
- 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 onetooneglobal.com 7
- 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 Friendly onetooneglobal.com 8
- 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 useful onetooneglobal.com 9
- 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 zooming. onetooneglobal.com 10
- 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 onetooneglobal.com 11
- 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 onetooneglobal.com 12
- 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 onetooneglobal.com 13
- 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 & Localization onetooneglobal.com 14
- 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 version onetooneglobal.com 15
- 16. Smaller Pieces Doesn’t Mean Less Consumption onetooneglobal.com 16
- 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 site. onetooneglobal.com HTTP://XKCD.COM/869/ 17
- 18. Testing Methodologies Challenges: • Thousands of Mobile Handsets • Different Mobile Platforms/OS • Different Mobile Carriers/Manufacturers • (Everything is so @#$@#^ complicated now) onetooneglobal.com 18
- 19. Mobile Usage vs. Testing Capabilities Smartphone Platform Market Share Android Apple BlackBerry Windows Palm onetooneglobal.com 19
- 20. Types of Mobile Apps Testing • User Interface Testing • Functional Testing • Performance & Stress Testing • Usability Testing Additional key testing types: • Compatibility Testing • Certification Compliance • Submission Guidelines • Interruption Testing • Monkey Testing • Low/No Network Testing onetooneglobal.com 20
- 21. Mobile Technology Sets Platforms Android iOS Blackberry Windows WebOS Devices Various Apple Blackberry Various HP / Palm HTML / CSS / Dev. Language Java Objective 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 WebOS Standard 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 Model Multi-tasking Yes No Yes Yes Yes onetooneglobal.com 21
- 22. Mobile App Test Strategy Remote Device Access Service • Device Anywhere (Paid) • Perfecto Mobile (Paid) • Dawn of a New Era – the • 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 onetooneglobal.com 22
- 23. Delivering Efficiency via Automation Test Automation Success Criteria Reliable Maintainable Scalable • Issues detection and • Minimum sensitivity to • Test coverage expanded security application and test case efficiently • Accurate Verification changes • Automated test cases • Unattended Execution • Test cases separate from created by non technical automation code resources onetooneglobal.com 23
- 25. 6 Emerging Trends in 2012 1. Mobile grabs the budget spotlight 2. Tablets are here to stay 3. NFC (near field communications) will drive mobile payments 4. Mobile ALM (application lifecycle management) goes mainstream 5. Testing moves to the cloud 6. Private clouds for mobile testing onetooneglobal.com 25
- 26. In Summary • How we got here • Basic XD Mantras • Testing Methodologies onetooneglobal.com 26
- 27. Join Our Conversation! @Onetooneglobal #MobileUsability #ExperienceDesign onetooneglobal.com 27
Notas do Editor
- Gestation of panel – Hallway conversationsTouching the elephantMy role is Vanna White of Wheel of FortunePanelists:Brian is a interface designer with this Clark Kent/Superman paradigm – great illustratorFrank understands the technology and understands the client. Kinda like Carter in Hogan’s Hero’s – lovable and is always blowing things upMatt: Yeoman researcher – you’re just so glad he’s on your side – kind of guy Henry V was talking about in the “we few we merry few we band of brothers’ St. Crispin’s SpeechHannah – IA – she can catch the lacrosse ball left handed – her fundamentals are great and can be applied to unique circumstancesMichelle: user research Strong silent type. When you have a problem, she has the solutions – and she has solutions for 3 things down the road you haven’t even thought about yetRyan, web developer – our rockstar of responsive design – thinks like a developer but feels like a creativeAmit: our backstop – there isn’t a dev issue that he can’t solve
- Again, not sure where a point like this would sit, but I would also mention ensuring you consider the overall user experience across multiple devices. You talk about ensuring visual brand consistency but I think it goes a little further than that. I don't know anyone who's sole experience of all things online is via a mobile device. To some extent, its about how you design and structure content and where you place functionality - and where you send people to standard websites because that is the best experience for a particular interaction.Where does the tablet fit in – another 4 hours of debateFlash is dead or has solved a problem that doesn’t exist anymore
- Apps are downloaded and installed on your mobile device, as opposed to rendered in a browserAvailability, compatibility, findability, updatability, sharability, sustainabilityDepends on context, app as cached, depends if user need DB or internet accessWith HTML5, people aren’t thinking apps anymore (at least some people say that - HTML5 will kill native apps) hybrid approach?Ties into RESPONSIVE DESIGN is today’s equivalent of TQM (total quality management) aspiration masquerading as a methodologyDo users really differentiate? Agencies do…
- Note that in the Far East it’s the mobile, not the web that’s the primary internet device
- think about a mobile solution is not simply about considering people on the go.Why? Mobile is mobile, the user is in transit or idle somewhere ready to be in transit, they're not "parked" at their computer where they may not mind lengthy input or process. Mobile needs to be in bit size chunks, easy to pop in an digest.On page 2 when talking about redirecting to the mobile site I think it is important to allow user to follow deep links into the site, whether this means that they view the full version of the site first (and therefore the page they were looking for) with the option to switch to the mobile version (i.e. it's not automatic redirection). Or the site can handle the deep link whilst moving the user to the mobile version of the site. The later option may be difficult to implement especially if the original deep link does not have a mobile equivalent.
- Depending on the device, a design ethos should include being 'thumb friendly'. This doesn't necessarily mean that people always use their thumbs to interact with their device, but the design should be usable for all people, however big or cumbersome their hands and digits may be (no staring at my hands!). This doesn't necessarily mean bigger targets - you can often achieve the same result by allowing for bigger spaces between targets.How account sells “a side of mobile”
- This may be more of an internal consideration, but I've always made a point that structural and functional navigation devices can work very differently on mobile. Tabs aren't always as effective and faceted search/navigation should be treated very differently. Again, this goes back to ensuring the content is fit for a mobile site.Similarly, I think its more important on a mobile site that the navigational model remains consistent. Mobile sites should avoid using too many different models - avoiding jumping between a 'hub and spoke' approach and a hierarchical model.
- Another Example: Website may have a call to action page suggesting user create a sign in or create one for their site, with links to sign in and sign up, 3 pages total, on the mobile, combine them together (one page for intro and sign in, one page for sign up page). In other words, think condensed from a visual standpoint.Comparing experiences on mobiles side by side Do you pick a device or be all things to all people – ties into your researchMobile, unlike the desktop, is a sharing device
- But digestible chunks doesn't mean less content. Though a hershey's kiss is small, if I eat enough, I've eaten a whole candy barI would extend mobilizing content to include personalisation and localisation. And make a point that this is no longer limited to apps - HTML5 and JQuery makes some of the rich, localised interaction possible on mobile sites too.
- http://www.msnbc.msn.com/id/26396295/The finding is detailed in the October 2008 issue the Journal of Consumer Research. In the other new study, Maura L. Scott at the University of Kentucky and colleagues at Arizona State University assessed people's perceptions and eating habits of M&Ms in regular and miniature packages
- Thousands of Mobile Handsets: For mobile developers, it is one of the biggest challenges that they may ever face. In order to develop a mobile application, one needs to be very sure about the devices they are targeting. According to a research 1388.2 million handsets were sold in year 2010.Thease devices are of different screen sizes, input methods (QWERTY, touch, normal) with different hardware capabilities. Knowing the fact that testing on every device is not possible and feasible at all, the diversity in handsets is a big challenge for Mobile developers.2) Different Mobile Platforms/OS: There are different Platforms/OS currently present in the market. Android, IOS, BREW, BREWMP, Symbian, Windows 7, Blackberry (RIM) and so on. Diversity in mobile platforms, different OS versions and platform limitations make it a bit difficult and challenging for developing mobile apps and so for testing them. There might be chance of inconsistency in terms of functionality across multiple devices of same platform and every platform may have some limitations.3) Different Mobile Carriers/Manufacturers:There are different mobile carriers in the market and every manufacturer may have some norms regarding the mobile application, if the application is coming preinstalled in the device. Verizon wireless, AT & T, T- Mobile, Orange, Docomo, Airtel, Vodafone, Reliance are some the carriers.
- Gihan
- Similar to general Software Testing, Mobile Software Testing also includes:User Interface Testing (Color scheme, Menu styles, Consistency of UI over various Devices)Functional Testing (Testing core functionality of Mobile App as per specification)Performance & Stress Testing [Behavior of Mobile Application in Low resources(Memory/Space), Behavior of mobile website when many mobile user simultaneously access mobile website)]Usability Testing (Testing of usability aspects of Mobile Apps)Apart from above mentioned testing types, some key testing types may include the following.Testing for Compatibility:Testing the compatibility of your application with native device features (i.e. To make sure your application is not hampering native device functionality)Certification Compliance Testing:For downloadable mobile applications, there are various Third party Mobile Quality Certification program for various platforms. True Brew Testing(for BREW Apps), Java Verified program (for J2ME apps), Symbian Signed Test Criteria (for Symbian Apps) are some examples. Apart from regular functional testing, you may need to test your application against the test cases/Testing criteria provided by these certification processes. However, it depends on your client, whether they want to certify their application or not.Submission Guidelines Compliance Testing: The application needs to adhere to the specified submission guidelines to publish it in any mobile application store. Failure to meet these guidelines may result in rejection of your app on mobile application stores. For example failure to comply with application Submission guidelines for Apple App Store may result in rejection of your app in Apple app store.Interruption Testing (Voice Calls, SMS, Charger, Low memory Notification) while application is running.Monkey Testing: – Continual key pad entries via tools to test application stability with various key press events.Low Network/No Network case Testing: – Application behavior when there is no network coverage or Low network strength.
- Today, we are in the midst of a new mobile testing era. Leading enterprises and web companies are shifting away from tedious and time consuming manual testing and emulator based testing methodologies to the use of a handset cloud, an environment to remotely test, troubleshoot and monitor applications on real devices over the Internet, in real time across the major mobile networks in the world. The main benefits are seen in significantly lower testing and development costs as well as a very flexible and agile application development environment that enables companies to securely and quickly respond to business needs and the extremely dynamic mobile market.Take Help from Remote Device Access ServiceDue to a large number of devices available in the market, it is not feasible to buy a new device every time. At the same time Simulators are not completely reliable enough to launch a mobile app based on testing conducted only on simulators. RDA (Remote device services) can be a good solution to deal with these challenges. The remote device access services enable access to a live device over the Internet. As a Mobile Apps Tester, you should be aware of such services and should suggest your managers about the capabilities of such Services.Some Available RDA Services are:Device Anywhere (Paid)Perfecto Mobile (Paid)Nokia RDA (Free, For Symbian Phones)Advantages of RDA:You don’t need to purchase actual device.User can select different Carriers e.g. Verizon, T-Mobile, AT & T.RDAs are more reliable than simulators as they are real devices.Some RDA Service like Device Anywhere also has automation capabilities.Disadvantages of RDA:Since you access devices remotely it takes time for any action or key event.Sometimes the needed device is not available due to prior reservations.Higher Service Cost
- Delivering Efficiency via AutomationAutomation testing tools are most efficient at the same time allowing testers to automate tedious repetitive test scenarios and generate reports. Add that to the ability to access and operate real mobile devices via the web and you get yourself a powerful mobile testing machine. Scripting specific usage and test scenarios for data driven regression and functional testing, scheduling them, running them in loops, running them across multiple devices, all of these allow a given QA team to accomplish much more with much less resources. Tasks that previously took manual testers days to complete can be replaced by unattended execution of comprehensive automated test scripts on multiple devices. Using a cloud-based remote device access platform with strong automation capabilities, enables organizations to address the ongoing problems of testing costs and complexities in the impossibly dynamic mobile market.
- Explore Tools and Utilities:There are many software tools and utilities available in the market which may help you in testing of your Mobile Application effectively. Some of these tools are available in SDKs itself. However you may still dig out the internet for such tools on various platforms.Tools to check Battery Consumption while your app is running. E.g. Nokia Energy Profiler.Tools/Software to capture screenshot: – There are many tools available for various mobile platforms to capture screenshot from device itself. E.gScreenshot tool for Symbian S60 Devices.Tools to Generate dummy files to test behavior of mobile app at Low EFS. e.g. Maxfilecnt utility from QUALCOMM for BREW mobile apps,Fill Device Memory Lite for Android apps.Tools to Generate Random key events. e.g. Monkey tool(Android), BREW Grinder(BREW), Hopper Test Tool (Windows Mobile)Tools to Capture Logs. E.g. Apphance for Android.Here are six emerging trends that will be even hotter this year:Mobile grabs the budget spotlight – Mobile will take on a more prominent role in enterprises’ budgets and team structure as its business justification becomes clear.Tablets are here to stay – Tablets will become an essential work tool. According to a Gist study, more that 65 million tablets are expected to sell in 2011, and 65% of mobile workers use a tablet (some of this is actually for work!)NFC will drive mobile payments –2012 is billed as the year that mobile payments will finally arrive on center stage. However, we still see a couple of key questions to be resolved before mobile payment reach prime time: 1) what is the clearing process?; 2) how do you ensure secure payments?; and 3) how do you test mobile payments in such a diverse market?Mobile ALM goes mainstream – Mobile testing will no longer be a side project in the QA process, but rather an organic and essential part of the process.Testing moves to the cloud – Not only will the cloud will become more dominant in terms of mobile services, it will also be used for all types of software testing. Cloud-based testing for mobile apps will be a particularly powerful solution as it is well-suited to support multiple testing environments. Due to the large and ever-growing number of mobile platforms, developers require numerous testing environments that can be managed and supported relatively easily in the cloud.Private clouds for mobile testing – Integrators will establish their own “private” clouds to support the mobile testing needs of enterprise customers using 3rd party technology (e.g., Perfecto Mobile).
- TomDeMarcoPeopleware, open kimono the tech may change but often the challenges are the same