CTP Research

1. CTP Research User focused e-Commerce website

2. Project Overview: • e-Commerce website • Product – Mountain Bikes and Accessories • Main Focus: • Usability • User Experience

3. Main Areas of Research: • Mobile Usability • Checkout/Payment Systems • Signing Up/Logging In • Advertisements and Design Layout • Searching and Navigation • Competitor Research • Technical Research

4. Primary Research: To collect my primary research I created an online survey that could be accessed by a large number of users and allowed me to collect large quantities of data in a short period of time. https://www.surveymonkey.co.uk/r/LJ9H9DB

5. Mobile Usability

6. Mobile Usability: Primary Research • Filtered Results from smartphone users: • 9/21 shop online ‘very often’. • 10/21 nearly 50% get frustrated with shops ‘moderately often’. • The main reason for frustration (nearly 40%) is ‘logging in/signing up’. • The second most selected answer was lack of mobile functionality (20%). • However the majority believe the frustration is warranted as 71% believes logging in to be ‘good security’. • 57% believe that checkout systems are too lengthy and complicated, • 71% believe that adverts do not help to promote offers instead confuse the user and ultimately irritate them.

7. Mobile Usability: What does that tell me? • A large percentage get frustrated when shopping online • Some frustrations are warranted and or expected (singing up/logging in) • There are still some usability and user experience issues in viewing online shops on a mobile device • Checkout systems, especially on mobile devices, need to be shortened and simplified. • Advertisements needs to be limited as they distract and irritate the user.

8. Mobile Usability: Secondary research (1) These statistics are from Ecommerce sales by device of the United Kingdom from November 2015 to January 2016. They prove and strengthen the facts that I found out through my primary research that a large percentage, in this case over half, of consumers now opt to use mobile devices such as; smartphones or tablets.

9. Mobile Usability: Secondary research “During our mobile e-commerce usability study we observed that more than 50% of users tried to “search within” their currently navigated category path, in an attempt to “filter the product list on my screen with a search query”. Yet, 94% of mobile e-commerce sites do not support such behavior – and will instead perform a site-wide search query.” (2) Searching products is an essential aspect on e-commerce websites including the use of filtered searching. The irritation of consumers not being able to search in a specific category is seen to be causing the user to abandon the site and current basket.

10. Mobile Usability: Secondary research “When encountering designs like the one seen here from Overstock, the majority of the subjects who had first navigated to a category, such as “TVs” (first image), would go on to enter search queries such as “40”, believing this would narrow the TVs seen in the product list to only display 40-inch TVs (middle). However, Overstock performs a site-wide search, yielding a list of highly irrelevant results.” (2)

11. Mobile Usability: Secondary research “Many responsive mobile sites are using native drop-downs (as in: a select tag) for main navigation and manypluginshavebeendeveloped for this specific purpose, yet our usability research shows that this is a poor strategy. On the tested mobile e-commerce sites that used native drop-downs for navigation, the test subjects showed decreased control and overview of the menu items.” (3) The use of a native drop down for the use of navigation is simply, as stated, a poor strategy for navigation. During testing from Baymard institute they found that the user would scroll through the entire menu to see what the best match would be even if they already found a suitable option.

12. Checkout/Payment Systems

13. Checkout/Payment Systems: Primary Research This question proved to divide the users that completed my survey with 50/50 stating that they find checkout systems to be over complicated an lengthy. Over complicated payment systems only accounted for 6% and complex checkout procedures accounted for 10% of the reasons why people get frustrated while shopping online.

14. Checkout/Payment Systems: What does this tell me? • Are checkout/payment systems becoming easier to use or are we, as consumers, getting used to them? • They are not a substantial reason for consumer’s frustrations. • However, they still pose usability issues and should be made as simple and straight forward as possible. • They prove more of an issue on mobile devices (57% of mobile users find them too complicated).

15. Checkout/Payment Systems: Secondary Research (3)

16. Checkout/Payment Systems: Secondary Research “The values of the checkout start rate metrics were lower than the values of the cart start rate metrics (metrics 11 and 9). This means that some customers, who added a product to a shopping cart, did not begin the checkout/payment process. This suggests that the pages containing the ‘go to checkout’ button had usability problems. This was indeed confirmed by the heuristic evaluators who experienced navigational problems on these pages in all three sites. In addition, the evaluators thought the ordering process on site 1 was too long. “ (5) Study from the University of Loughborough: Using Google Analytics to evaluate the usability of e-commerce sites. The navigation routes to the checkout system is just as important as the system itself. The ability for the user to purchase one product and then proceed to the checkout system is an important usability feature.

17. Checkout/Payment Systems: Secondary Research “In this paper, the usability of payment process refers to the number of steps in the payment process. Although usability may be defined in other ways (e.g., reduction in amount of information provided), we assume that an online payment process is more usable to a consumer when the number of steps are fewer”…” To increase usability, many Websites have eliminated these steps. An example is the one-click buying process at Amazon.com”…” Hypotheses 3: Higher usability of payment processes should lead to (A) lower recall of past expenses and (B) greater impulse buying.” (6) The number of steps within a payment process is almost, or can be considered, the definition of how usable the system is. Looking at this through business mind set then if hypotheses 3 is achieved then the company ultimately will see increased sales.

18. Checkout/Payment Systems: Secondary Research “In our latest checkout usability study we’ve found that the average checkout contains 14.88 form fields. Yet our checkout usability testing also reveals that most sites can achieve a 20-60% reduction in the number of form fields displayed by default.” (3) • In this article the author reveals three tips to help cut down the checkout system: • Address Line 2” + “Company Name” can safely be collapsed behind a link. • Use a single “Full name” field. • Default “Billing = Shipping” and hide the fields entirely.

19. Signing up/Logging in

20. Signing up/Logging in: Primary research Signing up/Logging in is the main reason for frustration from the users who conducted my survey however in the same group 69% stated that it is also good security.

21. Signing up/Logging in: What does this tell me? • It is arguably the largest frustration that consumers react with. • However, people believe that it is an example of good security. • There is a balance between usability and security that the consumer has come to expect with online shopping services. • It is a larger issue facing mobile device users (40% of mobile users stated this as their main frustration).

22. Signing up/Logging in: Secondary Research (7) (8) (9)

23. Signing up/Logging in: Secondary Research (10) 12 Ways to Create a User-Friendly Website Registration Process: • Build value around registration • Eliminate as many fields as possible • Group fields logically • Break up long registration processes into steps • Make your security and privacy policies clear as day • Make password requirements secure, but not ridiculous • Make password recovery easy • Give the option to refresh Captcha • Clearly identify and explain form field errors • Consider offering social sign-in • Provide a guest checkout option • Let visitors determine how long to stay signed in However irritating creating accounts are they are almost necessary on ecommerce sites for clear security risk. Corey Wainwright writing for Hubspot list 12 ways to making this as user friendly as possible.

24. Signing up/Logging in: Secondary Research (11) “Some of the results were very interesting: 86% of respondents reported being bothered by the need to create new accounts at websites and said they would actually change their behavior: – 54% might leave the site and not return – 26% would go to a different site if possible – 6% would just simply leave or avoid the site – 14% would not complete the registration 88% admitted to supplying incorrect information or leaving form fields incomplete (this result should come as no surprise to marketers). This figure is up from 76% in last year’s study 90% admitted to leaving a website if they couldn’t remember their login details rather than taking the time to recover their login information. This figure is up from 45% in 2010 The study also found that even though website visitors are becoming more frustrated with traditional marketing, they are becoming more open to using social identities for website registration. In fact, 77% responded that social login is “a good solution that should be offered,” with 41% preferring social login over creating a new user account or using a guest account.” (12) Facebook, at the moment, dominates the social sign in feature for ecommerce websites

25. Adverts and Layout Design

26. Adverts and Layout Design: Primary Research The majority, two thirds, of the users asked stated that advertisements just end up confusing consumers. Cluttered advertisement and poor design layout accumulated to be 28% of the reasoning to why people get frustrated while shopping online.

27. Adverts and Layout Design: What does this tell me? • Advertisements, whether used to advertise the domains content or third party content, doesn’t seem to have the desired effect on the user. • Cluttered layouts can cause the user to abandon their baskets and use another site.

28. Adverts and Layout Design: Secondary Research (13) • “Disadvantages Of Using Popups: • Many visitors, especially those who are familiar with internet technologies, don't like popups. Some people dislike them so much, the will immediately exit a site with a popup. • Some popups, especially those which contain scripts, might slow your page load time down which is a factor in conversions as well as SEO. • Anything less than the right message at the right time can be annoying and distract visitors from their experience.” (13) “The purpose of a popup is to provide a very strong call-to-action. This action might be an announcement or sale you want to the visitor to know about, but more often than not, it's to collect email addresses. Test after test has proven that popups work extremely well. In one test, popups drove 1,375% more email captures vs. a sidebar opt-in form. In another test, a website was receiving only 10 to 15 subscribers per day despite getting over 44,000 unique visitors each day. After implementing a popup with a 60 second delay, they began receiving 100-150 emails per day.” Pop-ups are great for business however can easily interrupt the users experience. Both of the above are from the same blog and suggest a large dilemma in using pop-ups.

29. Adverts and Layout Design: Secondary Research “The Z-Pattern is applicable to almost any web interface since it addresses the core website requirements such as hierarchy, branding, and calls to action. The Z-pattern is perfect for interfaces where simplicity is a priority and the call to action is the main takeaway. Forcing a Z-pattern for a website with complex content may not work as well as the F-pattern, but a Z-pattern can help bring a sense of order to simpler layouts (and increase conversion rates). Here's a few best practices to keep in mind: Background — Separate the background to keep the user's sight within your framework. Point #1 — This is a prime location for your logo. Point #2 — Adding a colorful secondary call to action can help guide users along the Z-pattern. Center of Page — A Featured Image Slider in the center of the page will separate the top and bottom sections and guide the eyes along the Z path. Point #3 — Adding icons that start here and move along the bottom axis can guide the users to the final call to action at Point #4. Point #4 — This is the finish line, and an ideal place for your primary Call to Action.” (14)

30. Searching and Navigation

31. Searching and Navigation: Secondary Research “The low success rate (64%) for search in our study showed that search functionality on many websites was inadequate. Simply indexing all the words used on your website is not enough.” (15) 27% of “sale catastrophes” were due to users not being able to find items using the search functionality available on the websites tested by Nielson Norman Group.

32. Searching and Navigation: Secondary Research • “Benchmarking the search experience of the 50 top-grossing US e-commerce websites reveals a surprisingly grim state of affairs. Here’s a walkthrough of just a handful of the most interesting statistics: • 16% of e-commerce websites do not support searching by product name or model number, despite those details appearing on the product page! An additional 18% of websites provide no useful results when the user types just a single character wrong in the product’s name. • 70% require users to search by the exact jargon for the product type that the website uses, failing to return relevant products for, say, “blow dryer” if “hair dryer” is typed, or “multifunction printer” if “all-in-one printer” is typed. • Searches with symbols and abbreviations are not supported by 60% of e-commerce websites. For example, the websites do not map the double quotation mark (often substituted for the double prime symbol: ″) or “in” to “inch.” • Autocomplete suggestions are found on 82% of e-commerce websites. While some implementations greatly enhance the search experience, 36% of implementations do more harm than good. • Only 34% allow users to easily iterate on their query by prefilling it in the search field on the results page, despite the fact that, according to our tests, users frequently need to iterate on their query — on average, 65% of test subjects required two or more query attempts during testing. • Only 40% of websites have faceted search, despite it being essential to e-commerce search because it is the foundation of contextual filters. • While an e-commerce website eases navigation by offering two types of breadcrumbs, 92% of the top-50 websites display only one breadcrumb type or none at all.” (16) On the left are findings from a report into the state of e-commerce search abilities from the top 50 grossing US e-commerce websites.

33. Searching and Navigation: Secondary Research • “An E-Commerce Study: Guidelines For Better Navigation And Categories” by Christian Holst states that there are a number of basic ways in which product findability can be improved on the majority of e-commerce websites. These are as follows; • Don’t Make Parent Categories Shallow. (Also, Have Parent Categories.) • Put The Same Subcategory Within Multiple Main Categories When Necessary. • Consider Having A “What’s New” Category Or Filter. • Suggest Both Alternative And Supplementary Products On Product Pages. • List “Recently Viewed Items.” • Create Dedicated Pages That List Compatible Products. • Always Link Contextual Images Directly To The Products Shown (17)

34. Competitor Research

35. Competitor Research: Evan’s Cycles (18)

36. Competitor Research: Evan’s Cycles • Fully mobile responsive • Good mobile functionality: • Menu • Forms • Basket • Forces you to create account – no social media log in functionality • No segregating search ability within specific category (however supply refine options within categories) • Relatively short singing up forms • Simple and well designed checkout system

37. Competitor Research: Chain Reaction Cycles (19)

38. Competitor Research: Chain Reaction Cycles • Fully mobile responsive • Good mobile functionality: • Forms • Basket • No mobile menu – have to go back to home page to navigate categories and products • Refining items using sidebar – rather messy design layout • Simple product display and layout • Simple 6 field sign up form • Simple change currency ability • Ability to checkout as guest • Simple checkout system however poor layout

39. Competitor Research: Planet X Cycles (20)

40. Competitor Research: Planet X Cycles • Fully mobile responsive • Good mobile menu however search integration could be separate • Too many adverts – makes the layout confusing • Again no specific category search functionality • Register form is too long • Easy to set currency • Overly complicated checkout system

41. Technical Research

42. Technical Research: payment integration The two main integration methods I will look to implement are: • Google Wallet • PayPal “PayPal has over 137 million active accounts in 193 markets and 26 currencies around the world” (21) PayPal has a developers site which offers a lot of support and documentation on how to integrate it into any site using a number of technologies. How to integrate PayPal - https://developer.paypal.com/docs/integration/web/

43. Technical Research: social sign in Oneall.com offer a javascriptapi which enables a multitude of different social platform login services - http://www.oneall.com/services/social-login/ Storm Path also offers an API which calls only facebook and Google sign in functionality, however these two are the most popular so it is a possible tool - https://stormpath.com/blog/the-social-integration

44. Summary and Recommendations

45. Mobile Usability • Shop must be fully responsive • Must be able to search within specific category • Menu must be accessed from every page • Menu will not use ‘native dropdown’

46. Checkout/Payment Systems: • Integration of third party paymet systems as well as standard bank card payment • 1 click checkout or at least instant access to checkout from every page • Forms will use the bare minimum fields required to gain information

47. Signing up/Logging in: • I will eliminate as many fields as possible for registering • Fields will be grouped logically • Integration of social sign up • Facebook • Google • Password requirements will be secure yet not excesive

48. Adverts and Layout Design: • No pop-ups • Limit adverts space to main header/slider area • Use the ‘Z layout’ homepage • Logo, menu, basket link at top banner • Main image/slider • Content

49. References: • Author unknown, 51% of UK ecommerce happened via mobile (2016), ecommerce news [accessed 22 November 2016] available from: http://ecommercenews.eu/51-uk-ecommerce-happened-via-mobile/ • Christian Holst, Mobile Usability: Allow Users to ‘Search Within’ Their Current Category (94% Don’t) (2016), Baymard Institute [accessed 22 November 2016] available from: http://baymard.com/blog/search-within-current-category • Christian Holst, The Average Checkout Flow Has 14.88 Form Fields – Twice as Many as Necessary (2016), Baymard Institute [accessed 22 November 2016] available from: http://baymard.com/blog/checkout-flow-average-form-fields • Jamie Appleseed, Mobile: Never Use Native Drop-Downs for Navigation (2016), Baymard Institute [accessed 22 November 2016] available from: http://baymard.com/blog/mobile-dropdown-navigation • HASAN, L., MORRIS, A. and PROBETS, S., 2009. Using Google Analytics to evaluate the usability of e-commerce sites. IN: Kurosu, M. (ed.). Human Centered Design, HCII 2009, Lecture Notes in Computer Science 5619, pp. 697-706. [accessed 22 November 2016] available from: https://dspace.lboro.ac.uk/dspace-jspui/bitstream/2134/5685/1/Using%20Google • Dutta, Ranjan; Jarvenpaa, Sirkka; and Tomak, Kerem, "Impact of Feedback and Usability of Online Payment Processes on Consumer Decision Making" (2003). ICIS 2003 Proceedings. Paper 2. [accessed 22 November 2016] avaibale from: http://aisel.aisnet.org/cgi/viewcontent.cgi?article=1107&context=icis2003 • Susanne Colwyn, Why do online shoppers abandon their Ecommerce shopping baskets and what can retailers do to re-engage? (2016) Smart Insights [accessed 22 November 2016] available from: http://www.smartinsights.com/conversion-optimisation/checkout-optimisation/reasons-cart-abandonment-digitalinsights/ • Hazel Bolton, Shopping Cart Abandonment Rate Statistics (2015), Formisimo [accessed 22 November 2016] availabe from: http://www.formisimo.com/blog/shopping-cart-abandonment-rate/

50. References: • Author Unknown, Why Users Abandon (2016), Baymard Institute [accessed 22 November 2016] available from: http://baymard.com/lists/cart-abandonment-rate • Corey Wainwright, 12 Ways to Create a User-Friendly Website Registration Process (2012), Hubspot [accessed 23 November 2016] available from: http://blog.hubspot.com/blog/tabid/6307/bid/31517/12-Ways-to-Create-a-User-Friendly-Website-Registration-Process.aspx#sm.000000zcz48q1ie2qxp4i3bq1if40 • Dave Chaffey, Social Sign-on : the implications for Ecommerce sites [Infographic], Smart Insights [accessed 23 November 2016] available from: http://www.smartinsights.com/social-media-marketing/social-media-platforms/social-sign-on-the-implications-for-ecommerce-sites/ • David Kirkpatrick, Social Media Marketing: Social login or traditional website registration? (2012), Marketing Sherpa Blog [accessed 23 November 2016] available from: http://sherpablog.marketingsherpa.com/social-networking-evangelism-community/social-login-registration/ • Richard Lazazzera, Why You Should Be Using Popups on Your Online Store, shopify [accessed 23 November 2016] available from: https://www.shopify.co.uk/blog/16009092-why-you-should-be-using-popups-on-your-online-store • Creative Bloq Staff, How the human eye reads a website (2014) Creative Bloq [accessed 23 November 2016] available from: http://www.creativebloq.com/ux/how-human-eye-reads-website-111413463 • Jakob Nielsen, Rolf Molich, Carolyn Snyder, Susan Farrell, E-Commerce user experience – search (2000) Nielson Norman Group [accessed 23 November 2016] available from: http://citeseerx.ist.psu.edu/viewdoc/download?doi=10.1.1.472.2548&rep=rep1&type=pdf • Christian Holst, The current state of e-commerce search (2014), Baymard Institute [accessed 23 November 2016] available from: https://www.smashingmagazine.com/2014/08/the-current-state-of-e-commerce-search/