3 th mobile leadership program mobile assets
•Download as PPTX, PDF•
4 likes•13,807 views
Mobile leadership program by Google
Recommended
Recommended
More Related Content
What's hot
What's hot (20)
Viewers also liked
Viewers also liked (12)
Similar to 3 th mobile leadership program mobile assets
Similar to 3 th mobile leadership program mobile assets (20)
More from Rein Mahatma
More from Rein Mahatma (20)
Recently uploaded
Recently uploaded (20)
3 th mobile leadership program mobile assets
- 2. 1. Sites & Apps 2. Site Design Principles TABLE OF CONTENTS
- 3. Sites & Apps
- 4. Is mobile web dead? “The mobile war is over and the app has won” venturebeat.com 2013/04/03 86% 14% TIME SPENT ON SITES TIME SPENT ON APPS USER TIME SPENT ON MOBILE DEVICES Source: Flurry (http://www.flurry.com/bid/109749/Apps-Solidify-Leadership-Six-Years-into-the-Mobile-Revolution#.VQmG7GTLeD4)
- 5. 66% SITES 6% APPS 28% SITES & APPS PRIMARY CHANNEL FOR COMMERCIAL TASKS INDUSTRY SNAPSHOT 75% OF AUTOS USERS 60% OF FINANCE USERS 70% OF TRAVEL USERS 71% OF RETAIL & TECH USERS 64% OF LOCAL SERVICES USERS ... USE SITES MORE OFTEN FOR COMMERCIAL TASKS 86% 14% TIME SPENT ON SITES TIME SPENT ON APPS 14% 40% GAMIN G & ENT. 28% SOCIAL 20% OTHER USER TIME SPENT ON MOBILE DEVICES Time spent Value for your business Source: Flurry (http://www.flurry.com/bid/109749/Apps-Solidify-Leadership-Six-Years-into-the-Mobile-Revolution#.VQmG7GTLeD4)
- 6. Mobile site is an entrance to your service SITE USERS APP USERS + New & Occasional Users + Consideration Phase Also +Frequent Users +Existing Customers +Frequent Users +Existing Customers +Unique Mobile Usage
- 7. Pop quiz! How many apps are there on Google Play?
- 8. 60% of apps have never been downloaded 20% are only used once after installation 95% of apps are abandoned within a month Source: http://www.hindustantimes.com/business-news/over-100-billion-mobile-apps-downloaded-in-2013/article1-1124695.aspx
- 9. Your Client: Apps or Sites? APPS FIRST WHO: APP-CENTRIC MODELS SITES FIRST WHO: MOST COMPANIES SITES + APPS WHO: COMPANIES WHO HAVE NAILED THEIR SITE... Intended for high frequency use (e.g. daily) Delivers app-only capabilities (e.g. offline) Entertainment, media, or gaming uses. Fully optimized for mobile Fully functional core capability like commerce Built with your future customer base in mind ...and want to expand on site capabilities... ...with app-only capabilities (e.g. offline) Focused on most loyal, engaged customers
- 11. Busy Distracted Lazy Fast Relevant Easy Three characteristics of mobile users
- 12. Qualitative user data 100 Mobile Websites Tested
- 13. 25 mobile site UX principles Homepage & Site Navigation Site Search Commerce & Conversions Form Entry Usability & Form Factor
- 14. Source:http://www.googl e.com/think/multiscreen/ whitepaper- sitedesign.html Make site search visible and relevant Auto-completion, filters and sorting
- 15. Make x-device experience seamless Share button and shopping cart / wish list Source:http://www.google.com/t hink/multiscreen/whitepaper- sitedesign.html
- 16. Make form short and effective Mandatory fields, conversion steps, real time validation and numerical keyboards
- 17. HOMEPAGE & SITE NAV. 4/4 Calls to Action Front & Center Short Menus Homepage Navigation Promotions Well Integrated Doing Not Doing SITE SEARCH 0/4 Visible Site Search Relevant Results Filters Guides to better results SCORE TOTAL COMMERCE & CONVS. 3/5 Guest browsing Guest Checkout Existing information used Click to Call Present Easy to convert on another device 10/25 FORM ENTRY 2/5 Info entry streamlined Simplest input method used Visual Calendars Real time data validation Efficient form design USABILITY & FORM FACTOR 1/7 Entire site optimized for device No pinch to zoom Product images expandable Site works all orientations Stay in same window Avoids “full site” labeling Clear about use of users location Legend Can consumers get around easily? Can consumers search for what they want? Can consumers search for what they want? Can consumers easily give you their information? Can consumers use your website with minimal frustration? Let’s review and score your mobile site UX!
- 18. Thank you!
- 19. Insert client site example here Filling Out Forms: On Screen Selectors
- 20. Mobile Sites: The Good, The Bad, The Ugly
- 21. Users of Sites Vs. Users of Apps SITES APPS + First Time Users + New & Occasional Users + Consideration Phase Also +Frequent Users +Existing Customers +Frequent Users +Existing Customers +Users of Unique Mobile Functionality
- 22. Pop Quiz: Name this Company ● 352 Million Average Monthly Unique Users ● Offices across the world ● Market Cap of 5.8B ● Company culture is described as a passionate, predicated on collaboration, humility and respect
- 23. King.com
- 24. Why This Matters “... I was worried I would miss something or wouldn't be able to read something, and I was worried about screwing something up and you know, her birthday was coming up quick ...”
- 25. Insert client site example here Keep Calls-to-action front and center Lowest User Ratings Highest User Ratings
- 26. Confusing for Consumers Insert client site example here Easy to Find Info Homepage should focus on connecting consumers to the content they are seeking Keep Calls-to-action front and center
- 27. Make Site Search Visible, Smart & Relevant
- 28. Make Site Search Visible, Smart & Relevant
- 29. Allow your customers to convert as a guest
- 30. Consumer Pain Point: Filling Out Forms
- 31. Seems Daunting Insert client site example here Seems Manageable Divide form into smaller chunks to make it more approachable for consumer Filling Out Forms: Steps & Progress Bars
- 32. Let Users Pick Up Where They Left Off Users want to be able to finish their task later if needed
- 34. Allow your customers to convert as a guest Average Rating (Mobile Sites)
Editor's Notes
- Content Page
- In April, Flurry released internal data that suggested that 86% of users’ time on smartphone is spent in apps, with only 14% spent on the web. This stat quickly led to multiple headlines across the tech and popular press about the death of the mobile web. The Flurry data is interesting, but it’s worth digging into it a little deeper to understand its relevance for your business. It’s also useful to take a step back and recognize that the length of time a user is engaged in something isn’t always the best measure of value, particularly to a business. Source: http://www.economist.com/blogs/graphicdetail/2014/06/daily-chart-1
- Coming back to the Flurry data - across their tracking universe, Flurry found that on average smartphone users spent 86% of their time in apps and 14% on mobile web sites. Now if we unbundle that 86% we find that 68% was actually spent in social and gaming/entertainment apps. That’s great news if you’re creating the next Facebook or video site, but for the rest of businesses, it means you’re fighting and clawing with millions of other non-entertainment apps to grab a share of the remaining 20% of users’ time. Arguably a more relevant consideration for the majority of businesses is where users are taking the actions that make you money. Google, in partnership with Ipsos, recently undertook a massive study of users’ habits on mobile devices. The study surveyed over 29,000 smartphone users across 9 industries to understand their mobile device habits and preferences. When it comes to commercial tasks, 66% use sites more often, 28% use sites and apps equally and only 6% prefer apps. So having a good mobile site enables you to address 94% of users looking to take commercial action. Sources: Time spent stats: http://www.flurry.com/bid/109749/Apps-Solidify-Leadership-Six-Years-into-the-Mobile-Revolution#.U44l461dVX4; Commercial task stats: Google/Ipsos Multiscreen Industry Study of 29k smartphone users across 9 industries (to be published).
- So let’s think about the users: Who are the users of mobile sites? Site Users can be lots of different types of people. Some perhaps browsing, and maybe aren’t a good fit for your product. (Such as this child on the motorcycle) Some people might give you their information, or convert. And some will come back over and over again. They like you, and they probably buy things from you. App users are your brand loyalists. Such as someone who wants to tattoo their brand to themselves. They are loyal users, frequent consumers of your products or content, and want to access you quickly and easily. - first time users - new and occasional users - those in the consideration phase. AND engaged users - users who come back again and again. Who are the users of native apps? - Frequent users - Existing customer base - users of unique mobile functionality AND engaged users - users who are frequent - coming back repeatedly. Compared to someone who purchased a t-shirt of your brand, the app user is more similar to someone who got a tattoo of your brand. They are deeply invested in your brand.
- The App Stores are crowded. Data suggests it’s difficult to get a user to download your app and even more difficult to become one of the few they access each month. Unless you plan to displace one of top apps, often games, or social websites it may be hard to stand out and gain momentum. Odds are your potential user base will be a subset of your loyal customers. Source: http://www.hindustantimes.com/business-news/over-100-billion-mobile-apps-downloaded-in-2013/article1-1124695.aspx
- Here are some helpful ways to think about what types of companies might make sense for Apps. Of course, an app first company, great example here is Uber.,
- We relied on a wide range of qualitative user data for these sessions. Moderators listened to their verbal feedback and reactions and observed their behaviors as they browsed Notetakers captured and logged any issues or mistakes users experienced and tagged each issue with a timestamp, a brief description, and a severity rating After exploring each site, participants provided ratings on the overall experience along with their reasons for providing those ratings
- We then aggregated all of our findings to come up with some guiding principles of site design. The insights can be categorized across 5 main categories. Today we are going to go through a few of the things we observed when doing the research.
- Another important aspect of forms are the on-screen selectors that are chosen for the user to interact with. The menu choices would take up more than half the screen when they appeared, and basically the entire screen if they were in landscape. Tap into the menu. Swipe once or twice to the selection. Tap on the selection. Tap Done or Enter. For every single dropdown. In many cases, these dropdown menus, or even worse, wheel selectors (as in the example on the right), would be used for fields that only had 2 choices, like gender. --- On the other hand, some sites decided to skip dropdown menus altogether when there were only a few choices and and present users with larger, tappable selection buttons or icons instead. Now, what could have been 3 taps and a swipe along with a jarring menu display that occupied most of the screen, they had only a tap or two without leaving the screen at all. -If you take a look on the left, on the same screen that Airbnb presents three dropdown menus in a row, they also incorporate on-screen buttons (type of sublet) at the top -In the middle here, Cheapoair presented on-screen ‘+’ and ‘-’ icons for designating the number of passengers rather than a series of dropdown menus or a wheel selector -This is appropriate due to the small quantities involved in almost all cases -Similarly, on lowes.com on the right, users can use on-screen buttons to change the quantity of a product before adding it to the cart -In case of larger quantities, users can also tap on the number and change the value with a numeric keypad So that gives you some insight into forms - and there are more related principles in the full whitepaper.
- Now the sites that are out there - they run the range, from the good, through the bad, to the ugly. Some are still desktop sites on mobile. Some are well designed mobile optimized sites - including responsive and adaptive technologies underlying them. Some are poorly designed mobile sites.
- So let’s think about the users: Who are the users of mobile sites? - first time users - new and occasional users - those in the consideration phase. AND engaged users - users who come back again and again. Who are the users of native apps? - Frequent users - Existing customer base - users of unique mobile functionality AND engaged users - users who are frequent - coming back repeatedly.
- Source: http://investor.king.com/investors/ir-home/default.aspx
- This is what one of the biggest app companies looks like. They are the makers of Candy Crush and other games.
- When we’ve talked to people in the past about what they expect from mobile sites, they felt that they couldn't find what they want using mobile websites, nor can they get specific, in their searches. They were hard to navigate, unfamiliar, sparse on design, smaller. To give some more context, here’s a participant quote from a mobile shopping study that we ran, where one of our participants describes shopping for a birthday gift on a mobile website ... ... I was worried I would miss something or wouldn't be able to read something, and I was worried about screwing something up and you know, her birthday was coming up quick ...”. So you can see as in the example here - that people are just trying to get stuff done - when they turn to mobile sites. And yet for all the issues, we also know that people are indeed turning to the mobile web - the data shows is that.
- Homepages with clearer, larger calls-to-action, like those on the right here, performed better. A few things to call out from the research: It can be easy for mobile users to miss menu items, so always put your key calls-to-action where you know users will see them. Study participants had the easiest time completing tasks on sites that clearly displayed primary calls-to-action in the main body of the site, with secondary tasks available through menus or below the fold. Make sure that the people who visit the page have a clear call-to-action that addresses their needs. That might be one clear call to action for everyone, or it may require a few different calls to action - so there may be division in your traffic.
- The desktop homepage often serves as a welcome page, messaging center and promotional space all in one, but the mobile homepage should focus on connecting users to the content they’re looking for. We’ll take a couple of car brands as an example. Looking at Crysler on the left here, many users were unsure of how to start learning about Chrysler’s vehicles when they arrived at the mobile site.They struggled to find the menu icon, and didn’t notice any clear calls-to-action on the homepage. On the Toyota mobile site - shown here on the right, ... in contrast, users quickly found the vehicles they were most interested in.
- When prompted to shop for a funny t-shirt on zazzle.com, most users abandoned the task because they couldn’t find a way to refine the thousands of results to a set that they could browse. The filter was displayed at the bottom of the search results screen, below links for Related Products
- In contrast, almost all users utilized the filter dropdown on htc.com when shopping for smartphones. In this case while it did provide a quick and easy way to shorten that list - which was useful for those interested in refining by carrier, this refinements could have been better because htc could also have allowed them to refine in other ways, for example, by price or features. In summary - mobile users are really receptive to shortening any list, to exclude items that are really not for them, when they are going through many items. These and other findings lead is to define the principle of keeping search visible, smart and relevant.
- Another principle around making sure people convert, is to beware of making enemies at registration gates. Many of the lowest rated sites frustrated users when they were forced to create an account in order to continue. Getting access to customer information and preferences can be integral to a companies website success, but be wary of asking for it too early. Users want to explore and browse content before they commit to providing their personal information.
- When users complain about browsing the web on their mobile phones, they almost always blame one of two things; pinching and zooming in order to read text, and filling out forms. In our study, we observed a lot of users complete a lot of forms on a lot of websites, and we learned a lot from it. There’s a lot that we could talk about in terms of forms: - there’s form labeling, there’s validation. All of these things are important - but I don’t have time to talk to you about all of them today. So we’re going to look at one aspects which is chunking the form. With multi-part forms, let your users know what’s coming with a progress bar on top. Study participants were intimidated by a multi-part form with a very complex initial step, but felt much more comfortable with a different, more straightforward form that clearly labeled each upcoming section.
- Breaking down a form into manageable chunks makes it much more approachable - and Progressive do a really good job here - on the right. On progressive.com, users appreciated that each section was labeled so they had an idea of what was coming up and none of the steps seemed disproportionately difficult. We saw far too many forms like the one on the left - long, scrolling, foreboding forms. Few users attempted to progress beyond Step 2 when prompted to open a new account on tdameritrade.com because they felt the overall process would take too long based on what they saw in the first two steps.
- Now, we know from research that people have reasons for switching devices - and continuing tasks on a different device. In some cases they wish to move to a bigger screen, in other cases they just need to pick up on their task at another time and in another place. Example: Macy’s allows users to email products or share products via social networks. We need to make it easy for them to go from one device to another. In the study we observed several users copying and pasting hyperlinks and emailing them to themselves. Other participants pinned items to follow up on later.Because of what we saw in the studies we are advising developers of mobile websites to seek opportunities to facilitate cross-channel conversion through their mobile website.
- Another principle around making sure people convert, is to beware of making enemies at registration gates. Many of the lowest rated sites frustrated users when they were forced to create an account in order to continue. Getting access to customer information and preferences can be integral to a companies website success, but be wary of asking for it too early. Users want to explore and browse content before they commit to providing their personal information.