tag:econsultancy.com,2008:/topics/user-experience-and-usability Latest User Experience and Usability content from Econsultancy 2016-07-25T11:12:46+01:00 tag:econsultancy.com,2008:BlogPost/68070 2016-07-25T11:12:46+01:00 2016-07-25T11:12:46+01:00 Eight examples of fashion ecommerce product filters: Good & bad Nikki Gilliland <p>(Note - as there are a few differences on mobile, such as abridged filters, I am solely concentrating on the desktop experience for now.)</p> <h3>H&amp;M</h3> <p>H&amp;M’s ‘Shop by Feature’ filter is designed to point the user in the direction of curated themes.</p> <p>While creative in theory, it actually seems to be quite pointless.</p> <p>What the retailer seems to have forgotten is that the whole point of a filter system is to narrow down products in order to point the consumer in a specific direction – not lead them down a random path to ‘off duty denim’ when it’s far easier to just filter by ‘jeans’.</p> <p><img src="https://assets.econsultancy.com/images/0007/7155/H_M.PNG" alt="" width="477" height="419"></p> <p>Aside from this, the regular filter is very user-friendly.</p> <p>With options to choose by colour, size and style - plus a handy 'clear all' button - it's easy to narrow down exactly what you're looking for.</p> <p><img src="https://assets.econsultancy.com/images/0007/7310/H_M_filter.PNG" alt="" width="750" height="580"></p> <h3><strong>River Island </strong></h3> <p>River Island’s filtering system is slightly fiddly in that it only allows you to select one filter at a time (selecting mutliple filters involves multiple reloading of the results page).</p> <p>However, one feature I quite like is that it allows you to see how many items each one includes. While this might sound slightly off-putting (I did occasionally find myself focusing on the number rather than the actual category I was selecting) – it is pretty helpful.</p> <p>For instance, if a filter returns just two items, you’ll know ahead of time rather than clicking through just to be disappointed.</p> <p><img src="https://assets.econsultancy.com/images/0007/6999/river_island_filter.PNG" alt="" width="600" height="699"></p> <h3><a href="https://econsultancy.com/blog/67581-six-reasons-i-love-zara-com-and-a-few-reasons-i-don-t/"><strong>Zara </strong></a></h3> <p>Zara’s filter system is a mixed bag. By placing it at the top of the page instead of the left-hand side, it focuses the user’s attention.</p> <p>It also enables you to select multiple features at once, using specific elements like ‘characteristics’ and ‘colour’.</p> <p>And we mean specific… Anyone happen to know what an ‘ecru’ coloured shirt looks like?</p> <p>Well thanks to its filtering system, you do now.</p> <p><img src="https://assets.econsultancy.com/images/0007/7002/zara_filter_2.PNG" alt="" width="780" height="512"></p> <p>On the other hand, its filter button is not the most visible, nor are highlighted filters, a fairly major UX issue.</p> <p>Annoyingly, there is also no option to sort filtered results.</p> <p><img src="https://assets.econsultancy.com/images/0007/7375/Screen_Shot_2016-07-24_at_18.44.10.png" alt="zara" width="615" height="256"></p> <h3><strong>Ted Baker</strong></h3> <p>Much of Ted Baker’s website is slick, so it’s a little disappointing that its filtering system is less so.</p> <p>While it does offer a decent number of options to filter by, including patterns, colours, sizes etc, like River Island it only allows you to choose one option (i.e. colour <em>or</em> size) before you have to repeat the process to choose another.</p> <p>Furthermore, the drop-down menu is a little slow, making the whole process feel slightly frustrating.</p> <p>Luckily, with its creative copywriting and <a href="https://econsultancy.com/blog/67999-seven-inspiring-examples-of-ecommerce-lookbooks/">lookbooks</a>, there's a lot to enjoy elsewhere on the site.</p> <p><img src="https://assets.econsultancy.com/images/0007/7003/Ted_Baker_filter.PNG" alt="" width="513" height="670"></p> <h3><strong>Hunter</strong></h3> <p>Like Ted Baker, Hunter’s filter is in the form of a drop-down menu, however, with separate tabs for each filter option – it’s far easier to use.</p> <p>It also includes some nice touches like a tick appearing as you narrow down the search, and an instant reset button.</p> <p><img src="https://assets.econsultancy.com/images/0007/7004/Hunter_filters.PNG" alt="" width="780" height="539"></p> <h3><strong>Marks and Spencer</strong></h3> <p>User reviews is a feature that many retailers fail to utilise. Functioning as a vote of confidence, rating systems are always useful for consumers that are unsure of what products to buy.</p> <p><a href="https://econsultancy.com/blog/67883-marks-spencer-what-does-putting-the-customer-at-the-heart-of-everything-mean/">Marks and Spencer </a>is one of the few retailers to shrewdly include them.</p> <p>Allowing users to filter by star ratings (1 and above, 2 and above and so on), it helps out the consumer who values other people’s opinions. While it’s located at the bottom of the left-hand side and so fairly inconspicuous, it’s still a worthwhile addition.</p> <p> <img src="https://assets.econsultancy.com/images/0007/7006/M_S_filter_2.PNG" alt="" width="350" height="669"></p> <h3><strong>Suit Supply </strong></h3> <p>In contrast to H&amp;M, Suit Supply is a great example of how to use product filtering in a more creative fashion.</p> <p>Instead of words, it utilises visuals to highlight various product features, cleverly showcasing the retailer’s wide variety of options.</p> <p>From collar type to style by context, this element is simple but effective, and something I've not come across before.</p> <p><img src="https://assets.econsultancy.com/images/0007/7007/Suit_supply_collar.PNG" alt="" width="780" height="330"></p> <p><img src="https://assets.econsultancy.com/images/0007/7008/Suit_supply.PNG" alt="" width="780" height="527"></p> <h3><strong>ASOS</strong></h3> <p>With such a large amount of items, it’s a good job that ASOS offers such as comprehensive filter system.</p> <p>From brand and style to fit and sleeve length, there any many different options to choose from, and with different filters across different categories - it’s cleverly executed.</p> <p>As well as helping to guide the consumer to find what they like, it also allows ASOS the brand to showcase its wide variety of products.</p> <p><img src="https://assets.econsultancy.com/images/0007/7017/ASOS_filter_2.PNG" alt="" width="300" height="408"> <img src="https://assets.econsultancy.com/images/0007/7019/ASOS_jean_filter.PNG" alt="" width="300" height="435"> </p> <h3>What can we learn?</h3> <p>While H&amp;M's example might not work, the brand's willingness to experiment with product filtering should be applauded.</p> <p>If done right, a decent filter can massively improve the user experience.</p> <p>Fast, with clear visuals and the ability to select multiple options... that's the dream.</p> tag:econsultancy.com,2008:BlogPost/68103 2016-07-22T14:31:13+01:00 2016-07-22T14:31:13+01:00 A day in the life of... Online Capability Consultant at BT Ben Davis <p>But before we do - if you're in the market for a digital job, check out our <a href="https://jobs.econsultancy.com/">jobs board</a> or benchmark your digital knowledge using our <a href="https://econsultancy.com/training/digital-skills-index-lite/">Digital Skills Index</a>.</p> <p>Alternatively, if you would like a Day In The Life profile, you can email us via press@econsultancy.com.</p> <h3>Please describe your job, Tom! What does an Online Capability Consultant do?</h3> <p>At BT we want to be number one for customer service and my role is all about ensuring that happens across the digital estate.</p> <p>I am responsible for turning our customer management and service journeys into an online experience that’s easy and efficient for our customers to use.</p> <p>I am responsible for creating and eliciting all the new requirements, defining user experience and <a href="https://econsultancy.com/blog/63462-ecommerce-product-pages-where-to-place-30-elements-and-why/">wireframes</a> and managing the development and launch of the product.</p> <p>Our team is working on some great experiences for our customers and ranging from paying a bill or reporting a fault right through to changing their TV package and tracking an order online.</p> <p><img src="https://assets.econsultancy.com/images/0007/7349/tom_barton.jpg" alt="tom barton" width="336" height="336"></p> <h3>Whereabouts do you sit within the organisation? Who do you report to?</h3> <p>I sit within the Digital team in BT Consumer, in a sub team called Digital Capability which includes both in life and project work.</p> <p>I report to the Senior User Experience manager.</p> <h3>What kind of skills do you need to be effective in your role?</h3> <p>You certainly need to be analytical, to allow you to review data quickly and to make effective UX and process decisions.</p> <p>Strong <a href="https://econsultancy.com/blog/66616-the-virtues-of-user-testing-under-the-influence/">user testing</a> skills and an inquisitive mind really help to get to the crux of the problem to ensure what you design is fit for purpose and allows customers and advisors to perform their task as effectively as possible.</p> <p>Strong people skills to ensure you can take everyone on the digital journey – our commercial and operational colleagues have great ideas and plans, but it’s up to me to give them clear options for how they turn them into reality online.</p> <p>The ability to learn quickly and grasp technical concepts at a high level allows you to marry your technical and design knowledge to spot how to cut risks, fix issues and save money. </p> <h3>Tell us about a typical working day…</h3> <p>My role is really varied so it really does depend on what needs doing!</p> <p>I start every day with a stand up to ensure we all know what everyone is doing and if anyone needs any support with the day’s activities.</p> <p>After that it can get quite varied but most days involve defining and writing requirements for the next piece of functionality. I will chat with the process SMEs to help turn complex business processes into an online experience.</p> <p>Once we have these I will brief our UX designers to start bringing the idea to life. </p> <p>After a call with the development team to ensure what we have designed is feasible we will update the wireframes and brief the Visual Design team to the final functionality created.</p> <p>After all this it’s time to optimise what we already have live and work closely with our marketing team to analyse the data and be on the lookout for changes that make the online experience even better.</p> <p>Busy day eh!</p> <p><img src="https://assets.econsultancy.com/images/resized/0007/7351/postits-blog-flyer.jpg" alt="post it wall" width="470" height="351"></p> <h3>What do you love about your job? What sucks?</h3> <p>I love working for such a high profile company and especially in their digital team. We are a relatively new team and have grown from 20 to 130 in a matter of years.</p> <p>The team has a great mix of ages and backgrounds and everyone is great to work with – also not wearing a suit is always good!</p> <p>It’s great being able to see an idea turn into something a customer can actually use. I know it’s cheesy but I really think we are making a positive difference to people’s lives – making everything they do online easier, quicker and more personal.</p> <p>I think my favourite thing about my role is its variety. One day I’ll be creating wireframes, the next analysing Omniture data to ensure we are getting the most out of what we have – I really get the chance to get involved in all aspects of the online journey.</p> <p>The only negative is the time it takes to implement change. We’re getting better with more agile processes coming in but with such a big company getting things changed can be a bit frustrating at times.</p> <h3>What kind of goals do you have? What are the most useful metrics and KPIs for measuring success?</h3> <p>We use quite a lot at BT but the main ones we use are Channel Share and Propensity to Contact.</p> <p>Our goal is to remove calls from the call centre and help people self-serve as much as they can, the more people we can get online the better. We want customers to have the same personal experience online as they do when they call up.</p> <p>Propensity to Contact (or PTC) measures how many customers go online and then phone up within seven days. We take the approach that if someone has gone online and then had to phone up, we’ve failed – the lower this measure the better.</p> <p><img src="https://assets.econsultancy.com/images/0007/7350/Screen_Shot_2016-07-22_at_14.08.26.png" alt="contact BT" width="615" height="366"></p> <h3>What are your favourite tools to help you to get the job done? </h3> <ul> <li> <strong>Axure</strong> – wireframe tool. It can be pretty complicated when you start learning how to use it but when you get the hang of it, what it can do is pretty impressive</li> <li> <strong>Omniture and Excel</strong> – To crunch those numbers</li> <li> <strong>Treesorter</strong> – A lot of what we do involves getting people from A to B in the easiest way. Treesorter allows us to test where the best place to put everything is</li> <li> <strong>Trello</strong> – A great online tool to help with lists and team tasks</li> <li> <strong>Jira</strong> – Our defect tracking and requirements tool</li> </ul> <h3>Which brands do you think are doing digital well?</h3> <p>I think digital is really exciting at the moment and there are loads of brands that are doing some pretty great stuff, but if I had to pick some I would go for:</p> <p><strong>John Lewis</strong> – The way they marry up online and offline activities make shopping extremely painless. When I have had queries or issues, is has been such a stress free experience it solve these.</p> <p><strong>Amazon</strong> – Similar to John Lewis, however I know there is so much more they could do with the data and resources they have. I feel they are just testing the water at the moment – Watch this space!</p> <p><strong>Skyscanner</strong> – I’m convinced I have booked more flights since I started using Skyscanner! The amount of data it has to crunch in such a short space of time is impressive. It’s so easy to use and the ability to customise everything really helps with usability. It translates seamlessly from desktop to mobile as well</p> <h3>Do you have any advice for people who want to work in ecommerce?</h3> <p>Try to learn as much as you can about the full customer lifecycle and how digital can affect every aspect of it. </p> <p>The more exposure you get to more roles such as marketing, <a href="https://econsultancy.com/reports/seo-best-practice-guide/">SEO</a>, UX etc the better as it will allow you to understand how each role comes together to create the full end-to-end experience.</p> <p>It’s really important to stay up to date and read articles and blogs on the latest trends and digital best practice. It’s easy with so many free resources online – many companies also offer free conferences that are great to attend.</p> <p>No matter what your role is in digital, it’s vital you keep the end user in mind, whether that be a customer or a back end user. It is vital everything is designed with them in mind.</p> <p>I think most importantly just have passion for getting into digital and work hard, and the rest should come naturally.</p> tag:econsultancy.com,2008:Report/3008 2016-07-21T11:30:00+01:00 2016-07-21T11:30:00+01:00 Internet Statistics Compendium Econsultancy <p>Econsultancy’s <strong>Internet Statistics Compendium</strong> is a collection of the most recent statistics and market data publicly available on online marketing, ecommerce, the internet and related digital media. </p> <p><strong>The compendium is available as 11 main reports (in addition to a B2B report) across the following topics:</strong></p> <ul> <li><strong><a href="http://econsultancy.com/reports/advertising-media-statistics">Advertising</a></strong></li> <li><strong><a href="http://econsultancy.com/reports/content-statistics">Content</a></strong></li> <li><strong><a href="http://econsultancy.com/reports/customer-experience-statistics">Customer Experience</a></strong></li> <li><strong><a href="http://econsultancy.com/reports/web-analytics-statistics">Data and Analytics</a></strong></li> <li><strong><a href="http://econsultancy.com/reports/demographics-technology-adoption">Demographics and Technology Adoption</a></strong></li> <li><strong><a href="http://econsultancy.com/uk/reports/ecommerce-statistics">Ecommerce</a></strong></li> <li><strong><a href="http://econsultancy.com/reports/email-ecrm-statistics">Email and eCRM</a></strong></li> <li><strong><a href="http://econsultancy.com/reports/mobile-statistics">Mobile</a></strong></li> <li><strong><a href="http://econsultancy.com/reports/search-marketing-statistics">Search</a></strong></li> <li><strong><a href="http://econsultancy.com/reports/social-media-statistics">Social</a></strong></li> <li><strong><a href="http://econsultancy.com/reports/strategy-and-operations-statistics">Strategy and Operations</a></strong></li> <li><strong><a title="B2B Internet Statistics Compendium" href="http://econsultancy.com/reports/b2b-internet-statistics-compendium">B2B</a></strong></li> </ul> <p>Updated monthly, each document is a comprehensive compilation of internet, statistics and online market research with data, facts, charts and figures.The reports have been collated from information available to the public, which we have aggregated together in one place to help you quickly find the internet statistics you need, to help make your pitch or internal report up to date.</p> <p>There are all sorts of internet statistics which you can slot into your next presentation, report or client pitch.</p> <p><strong>Those looking for B2B-specific data should consult our <a title="B2B Internet Statistics Compendium" href="http://econsultancy.com/reports/b2b-internet-statistics-compendium">B2B Internet Statistics Compendium</a>.</strong></p> <p> <strong>Regions covered in each document (where available) are:</strong></p> <ul> <li><strong>Global</strong></li> <li><strong>UK</strong></li> <li><strong>North America</strong></li> <li><strong>Asia</strong></li> <li><strong>Australia and New Zealand</strong></li> <li><strong>Europe</strong></li> <li><strong>Latin America</strong></li> <li><strong>MENA</strong></li> </ul> <p>A sample of the Internet Statistics Compendium is available for free, with various statistics included and a full table of contents, to show you what you're missing.</p> tag:econsultancy.com,2008:BlogPost/68031 2016-07-19T12:14:01+01:00 2016-07-19T12:14:01+01:00 Answering the key question of content auditing: Where do I start? Michael Hewitt <h3>Existing content</h3> <p>When it comes to investment in content marketing, it isn’t a huge surprise that much of it goes on producing new content, new material and new campaigns.</p> <p>Plenty of marketers will talk at length about how much content they are producing, how packed their <a href="https://econsultancy.com/blog/64587-eight-free-content-calendar-templates-to-help-plan-your-output/">editorial calendars </a>are and how they are preparing to launch their “next big campaign”, but what about the content that they already have?</p> <p>Content marketers are focused so heavily on producing new content that meets the evolving needs of both their audiences and the expectations of search engines, that they are neglecting to ensure that their existing content does likewise. </p> <h3>A daunting prospect</h3> <p>The phrase “content audit” conjures up many feelings, and few of them positive. </p> <p>For many, it is a laborious process that involves hours upon hours, days upon days or even weeks upon weeks of manual review, fiddling around in analytics, and identifying gaps in coverage. It’s not, for many, the most enthralling responsibility in the job description.</p> <p><img src="https://assets.econsultancy.com/images/0007/6721/content-audit.jpg" alt="" width="400" height="300"></p> <p>Even if you do manage to conduct a thorough audit, it can often be difficult to force through changes on key brand pages due to the influence of various stakeholders, compliance issues and various other obstacles.</p> <p>Many also find the results and impact of a content audit difficult to measure, and so decide to focus their efforts elsewhere.</p> <p>But content auditing is something that needs to be a prominent and regular part of not only your content marketing strategy, but your wider digital marketing strategy.</p> <p>Just think about how many search algorithm updates that there may have been, how many new devices have been launched and how many new media platforms have emerged since you last reviewed your content – that could be quite a sobering realisation. </p> <h3>The case for a content audit</h3> <p>The ultimate purpose of any content audit is to understand how your content is performing, how it is delivering for your customers and what value it is providing. </p> <p>There are plenty of both tangible and intangible measurements for successful content, but this doesn’t necessarily confirm that content is useful, relevant or could be considered ‘quality’ by most reasonable measures.</p> <p>You could, for instance, use social shares as a measurement of quality content but, in doing so, it’s likely that you’ll reach conclusions that, whilst they may drive engagement, don’t necessarily drive a commercial return. Providing content that your audiences will engage with is undoubtedly a starting point but, and I hate to break this to you, human beings may not always be the best judges of quality.</p> <p>What your content audit is ultimately about is ensuring that every piece of content on your site is making some form of contribution to improving conversion rates, search visibility, user experience, and relevance.</p> <p>Get it right and you could even start stealing that prized <a href="https://econsultancy.com/blog/66672-semantic-search-the-future-of-search-marketing">Google Knowledge Graph</a> real estate. </p> <h3>The manual approach</h3> <p>If you’re in a position where you are managing a relatively small site with a handful of pages, then manual content auditing might not be such a hardship.</p> <p>Starting with your URL and keywords, you can start to build a picture of where your brand ranks for these key terms, which pages consistently rank for those key terms, and how your competitors perform. </p> <p>It is then down to you to make a human assessment of each of these pages, and you can look at multiple factors to judge <a href="https://econsultancy.com/blog/66971-a-content-manager-s-practical-guide-to-doing-just-enough-seo/">how well optimised your pages are for search</a>, and how they contribute to the user journey. These factors could include URL optimisation, title tags, meta description, ‘H-tag’ optimisation and hierarchy, keyword coverage and word count.</p> <p>You can then add layers of insight from Google Analytics, social monitoring tools and start to understand how these pages contribute to the customer search journey.</p> <p>Are there pages that are haemorrhaging traffic through unusually high exit rates? If so, this page might not adequately serve the customer search query. </p> <p>With only this very top-level and basic approach to content, you can already start to understand just how much time that you're going to have to spend with your head in an Excel spreadsheet, and why many marketers are reluctant to run a manual content audit at any sort of scale.</p> <h3>A scientific approach</h3> <p>But content auditing doesn’t have to be such a daunting prospect, and it is possible to take a more scientific, algorithmic approach to content auditing.</p> <p>At Stickyeyes we use SCOT (<a href="http://www.stickyeyes.com/content-optimisation-tool/">Stickyeyes Content Optimisation Tool</a>), to look at content in the same way that a search engine may look at it, and identify key areas of success and areas for improvement. In short, addressing that critical first hurdle – where to start.</p> <p>The factors we consider include technical elements, such as keyword coverage, meta data and the use of header tags, as well as engagement factors for which there is evidence of a correlation with higher search rankings – factors such as bounce rate, time on page, social engagement and brand awareness for example.</p> <p>For those with sizable websites, this kind of process can be invaluable in understanding just where to focus effort and resource. Here is just one example of a typical output for a printing brand that we ran through the tool. </p> <p><img src="https://assets.econsultancy.com/images/0007/6722/graph1.jpg" alt="" width="668" height="276"></p> <p>What we can see clearly is that whilst the brand in this example does have some strong content optimisation scores, in excess of 85%, there are a number of revenue-driving keywords for which the domain scores poorly – notably “cheap leaflet printing”, “cheap flyers”, and “cheap flyer printing”.</p> <p>Evidently, this brand has struggled to provide content for search terms with a “cheap” prefix and this therefore provides some direction for their content review.</p> <p>Of course, it may be that the brand sees itself as a quality brand and therefore may not want to specifically target search terms such as “cheap” and “low cost”, but the level of insight provided allows the brand to make that decision.</p> <h3>Identifying the quick wins</h3> <p>Of course, any content appraisal and audit needs to have a degree of human intervention, but what this algorithmic approach does is allow us to automate large parts of the process and using this insight, content managers can start to make some key decisions and prioritise their actions. </p> <p>There are, in this example, a number of pages that score highly and, with a few minor tweaks, can potentially drive further value. These are what we would classify as “quick wins”. </p> <p>Of course, it isn’t simply enough to throw a few keyword-heavy paragraphs into the page in the hope that Google will deem that to be more relevant, but we can now start considering how we can enhance the user experience for these pages and these terms.</p> <p>It may be that we create specific content for these terms, we may change the site structure to make our existing pages more prominent, or we may actually decide to remove certain pages to focus traffic on more valuable pages.</p> <p>What we are essentially trying to do is enhance the user journey rather than hinder it; and there are different ways to do that depending on the circumstances. </p> <p>This process makes it easier to run audits on a more regular basis, allowing you to monitor the success of any changes that you do make, understand the contribution that your new content is making and identify the next key actions for your optimisation strategy. If something appears to be having an adverse effect, this can be identified and rectified very quickly. </p> <h3>The impact on search</h3> <p>We have been using this approach for a number of brands and what we have found is that as we continually work on improving our content scores within SCOT, we have experienced increased visibility within organic search. </p> <p><img src="https://assets.econsultancy.com/images/0007/6723/graph2.jpg" alt="" width="814" height="336"></p> <p>Of course, what we can’t do is isolate the impact of these content amendments from the various other elements of activity that may have been undertaken to improve search performance, but there is evidence of a strong correlation between the quality of on-page content and search rankings. </p> <p>And it is important to stress that whilst we may be looking to introduce an algorithmic approach to content auditing, this shouldn’t be mistaken as an algorithmic approach towards content creation.</p> <p>What we are trying to do here is to ensure that our <a href="https://econsultancy.com/blog/67605-why-content-marketing-isn-t-seo-and-why-seo-isn-t-just-content/">content strategies plug key gaps</a> in what our audiences are looking for, but this shouldn’t turn content creation and optimisation into little more than a box ticking exercise. </p> <p>What matters above all else is that your brand is still providing value to the end user and delivering the best possible experience. Adding a layer of technical competence helps to deliver that user experience, but is also valued by search engines as they look to deliver the most relevant results. </p> <p><a href="http://www.stickyeyes.com/content-optimisation-tool%20">Try the latest version</a> of SCOT for free.</p> tag:econsultancy.com,2008:BlogPost/68061 2016-07-18T13:09:12+01:00 2016-07-18T13:09:12+01:00 23 clever uses for colour in ecommerce UX Ben Davis <h3>1. Virgin America - green for validated fields</h3> <p>Let's start with something simple but beautiful. Upon validating my data entry, <a href="https://econsultancy.com/blog/65065-30-little-things-i-love-about-the-new-virgin-america-website/">Virgin America</a> turns each field green.</p> <p>Purple is also used to highlight a field that hasn't been completed yet, as I click into it.</p> <p><img src="https://assets.econsultancy.com/images/0007/7055/virgin_validation.gif" alt="virgin america" width="615"></p> <h3>2. ASOS - flagging up sales in a mega menu</h3> <p>You might say this design touch is almost imperceptible, but using red text to highlight sales and savings in a mega menu will catch the eye.</p> <p>A great way to encourage increased browsing and basket value.</p> <p><a href="http://www.asos.com/women/"><img src="https://assets.econsultancy.com/images/0007/7044/Screen_Shot_2016-07-13_at_14.07.25.png" alt="asos website" width="615" height="477"></a></p> <h3>3. Nike - showing off product and encouraging add to cart</h3> <p>I've included Nike for its conspicuous lack of colour. The black and white design lets its products impress with their own colour.</p> <p><a href="http://www.nike.com/gb/en_gb/"><img src="https://assets.econsultancy.com/images/0007/7034/Screen_Shot_2016-07-13_at_12.12.34.png" alt="nike homepage" width="615" height="331"></a></p> <p>The one place where a splash of orange is used? The 'add to cart' button, for obvious reasons.</p> <p><img src="https://assets.econsultancy.com/images/0007/7035/Screen_Shot_2016-07-13_at_12.12.47.png" alt="nike product page" width="615" height="332"> </p> <h3>4. The Trainline - contrast, clarity, fun</h3> <p>The combination of bold colour and smart iconography makes <a href="https://econsultancy.com/blog/67022-nine-things-i-love-about-the-trainline-app/">the Trainline's app</a> and website easy and fun to use.</p> <p>Contrast in the booking engine allows users to methodically follow the booking process, taking one step at a time without fear of making a mistake.</p> <p><img src="https://assets.econsultancy.com/images/resized/0006/7779/img_2228-blog-flyer.png" alt="trainline app" width="300"></p> <h3>5. Pure Cycles - product differentiation</h3> <p>Pure cycles sells bikes online. What the retailer understand very well is the way that colour can be used to differentiate between products or present them in an appealing way.</p> <p>Lots of these bikes have similar elements (certainly in appearance), so using different colour on the wheels and frames allows Pure to create a diverse looking catalogue that the customer is not bored to browse.</p> <p>There's something for everyone, rather than an academic exercise of distinguishing between materials and detailed specs.</p> <p><a href="https://www.purecycles.com/"><img src="https://assets.econsultancy.com/images/0007/7042/Screen_Shot_2016-07-13_at_14.01.58.png" alt="pure cycle" width="615" height="352"></a></p> <p>This approach extends to cheaper products, such as grip sets. Pure Cycles displays all the colours together, to aim for high impact from an ostensibly functional and boring item.</p> <p><img src="https://assets.econsultancy.com/images/0007/7043/Screen_Shot_2016-07-13_at_14.04.15.png" alt="pure cycle products" width="615" height="341"></p> <p>When it comes to Pure Cycles' glow bikes, it really goes the extra mile to make product imagery stand out.</p> <p>Sales is all about the product, so making it look great on an ecommerce site should be aesthetic priority number one.</p> <p><img src="https://assets.econsultancy.com/images/0007/0134/bike_glow.gif" alt="pure cycles" width="505" height="280"></p> <h3>6. Pelican - more contrast and comprehension</h3> <p>A brand with rich heritage in design, it's unsurprising that Pelican's ebook-buying website is bold, simple and uses colour to instantly convey the distinctive clarity of Penguin's non-fiction house.</p> <p>This clarity helps reassure the customer that reading a book on their personal device (possibly a smartphone) will be an easy and enjoyable process.</p> <p>Clarity through contrast is something that many subscription and service businesses try to achieve, as these are often interfaces that the customer expects to use frequently, and wants to enjoy using (e.g. Spotify).</p> <p><img src="https://assets.econsultancy.com/images/0007/7038/Screen_Shot_2016-07-13_at_12.20.41.png" alt="pelican library" width="615" height="339"></p> <p><a href="https://www.pelicanbooks.com/"><img src="https://assets.econsultancy.com/images/0007/7037/Screen_Shot_2016-07-13_at_12.20.38.png" alt="pelican book" width="615" height="340"></a></p> <p>Though you might regard this as a publishing website, it still sells stuff through a checkout - maybe you'd like to emulate its chunky design?</p> <p><img src="https://assets.econsultancy.com/images/0007/7036/Screen_Shot_2016-07-13_at_12.20.20.png" alt="pelican checkout" width="615" height="338">  </p> <h3>Houzz - branding &amp; conversion</h3> <p>Houzz isn't strictly an ecommerce website (<a href="https://econsultancy.com/blog/67987-home-sweet-home-why-houzz-is-worthy-of-the-best-app-award">and app</a>), it's a marketplace where consumers can find designers, architects and products.</p> <p>But apart from the lack of a checkout, there's lots of features here that are directly transferable to a 'traditional' ecommerce site.</p> <p>The site and app's UX revolves around the use of brand colouring (green) to highlight certain elements in the design. It's a very effective way of encouraging or reassuring the user whilst asserting the brand.</p> <p>Lots of ecommerce sites do this, but Houzz takes it to the nth degree.</p> <p><strong>7. Highlighting products in UGC</strong></p> <p>Green is used throughout the very good Houzz app. Of note are the green price tags that signify products that can be clicked on, within photographed interiors.</p> <p><img src="https://assets.econsultancy.com/images/0007/7041/IMG_3040.PNG" alt="houzz app" width="350"></p> <p><strong>8. Highlighting reviews</strong></p> <p>This is often done in orange, but Houzz uses brand colouring to pick out reviews, bringing some social proof to the selection of designers and architects.</p> <p><a href="http://www.houzz.co.uk/"><img src="https://assets.econsultancy.com/images/0007/7016/Screen_Shot_2016-07-13_at_11.13.15.png" alt="highlighting reviews" width="615" height="271"></a></p> <p><strong>9. Ghost buttons</strong></p> <p>A feature of modern web design on desktop, in green again.</p> <p><img src="https://assets.econsultancy.com/images/0007/7015/ghost.gif" alt="ghost button" width="615"></p> <p><strong>10. Calls to action</strong></p> <p><em>'Visit store' call to action</em>  </p> <p><strong><img src="https://assets.econsultancy.com/images/0007/7024/Screen_Shot_2016-07-13_at_11.23.17.png" alt="call to action - houzz" width="615" height="311"></strong></p> <p><strong>11. Picking out breadcrumb trails and filters</strong></p> <p>This is a nice way to keep customers oriented.</p> <p><img src="https://assets.econsultancy.com/images/0007/7023/Screen_Shot_2016-07-13_at_11.20.27.png" alt="houzz breadcrumb" width="615" height="315"></p> <p><strong>12. Product rollovers</strong></p> <p>Another piece of UX assistance. Here Houzz highlights the save button (for creating a wishlist of sorts) and the email icon (to send the product listing to a friend).</p> <p><img src="https://assets.econsultancy.com/images/0007/7020/rollover_products.gif" alt="rollovers houzz" width="500"></p> <h3>13. Wish - discount flashes</h3> <p><a href="https://econsultancy.com/blog/67873-12-examples-of-persuasive-mobile-ux-from-ecommerce-app-wish/">Wish</a> is an ecommerce website and app aimed at bargain hunters.</p> <p>Its heavily discounted and promoted products and highlighted with orange flashes to show percentage discount, number remaining, and time remaining.</p> <p><img src="https://assets.econsultancy.com/images/0007/5257/IMG_2923.PNG" alt="wish app" width="300">  <img src="https://assets.econsultancy.com/images/0007/5248/deal_clocks.PNG" alt="wish app" width="300"></p> <p>Wish even uses this tactic in the checkout, again using an orange banner.</p> <p><img src="https://assets.econsultancy.com/images/0007/5247/checkout_incentive.PNG" alt="wish app" width="300"></p> <h3>14. Helbak - alternative to white space</h3> <p>Helbak Ceramics uses pastel shades to back product photographs on the hompage.</p> <p>This helps to delineate space and perk up the overall design, as well as add lustre to the products.</p> <p><a href="http://www.helbak.com/"><img src="https://assets.econsultancy.com/images/0007/7106/Screen_Shot_2016-07-14_at_13.03.30.png" alt="helbak" width="615" height="343"></a></p> <h3>15. Best Buy - flagging items in your cart</h3> <p>This is standard procedure - a cart that highlights when it has items in it, so the user knows to checkout.</p> <p>A lot of sites do this - here's Best Buy using its brand yellow, which it also uses for its 'add to cart' buttons.</p> <p><img src="https://assets.econsultancy.com/images/0007/7070/Screen_Shot_2016-07-14_at_08.38.51.png" alt="best buy" width="615" height="211"></p> <h3>16. Crayola - branding &amp; sheer fun</h3> <p>No other menu will give you this much joy in ecommerce. If websites should reflect their brands, Crayola nails it here.</p> <p><a href="http://www.crayola.com/"><img src="https://assets.econsultancy.com/images/0007/7045/Screen_Shot_2016-07-13_at_14.41.35.png" alt="crayola website" width="615" height="330"></a></p> <p><em>And on mobile</em></p> <p><img src="https://assets.econsultancy.com/images/0007/7046/crayola.gif" alt="crayola on mobile" width="227" height="309"></p> <h3>17. Flipkart - highlighting notifications</h3> <p>Notifications are becoming more common in ecommerce, a messaging feature used to flag up offers to customers, which are often also pushed to app users.</p> <p>Flipkart uses yellow to make the bell icon stand out.</p> <p><img src="https://assets.econsultancy.com/images/0007/7071/Screen_Shot_2016-07-14_at_09.04.23.png" alt="flipkart" width="615" height="222"></p> <h3>18. Currys - checkout progress indicator</h3> <p>Another bit of practical colouring here. Many ecommerce sites do this.</p> <p><img src="https://assets.econsultancy.com/images/0007/7095/Screen_Shot_2016-07-14_at_12.09.19.png" alt="currys" width="615" height="386"> </p> <h3>19. Lush - product contrast</h3> <p>We love lush (<a href="https://econsultancy.com/blog/67158-why-lush-is-the-undisputed-master-of-b-commerce/">see this article</a>). Like the Nike example above, Lush's copious whitespace allows its colourful products to shine.</p> <h3> <img src="https://assets.econsultancy.com/images/0006/8739/Screen_Shot_2015-11-05_at_19.12.09.png" alt="lush website" width="615"> </h3> <h3>20. Kayak - making sense of a booking engine </h3> <p>Booking engines can be dauntingly rich in information. Kayak uses its brand orange to pick out important features or information.</p> <p>It also uses a secondary colour, green, for persuasive elements such as savings and reviews.</p> <p><a href="https://www.kayak.co.uk"><img src="https://assets.econsultancy.com/images/0007/7063/Screen_Shot_2016-07-13_at_15.57.11.png" alt="kayak booking page" width="615" height="416"></a> </p> <h3>21. Odd Pears - product illustrations</h3> <p>I haven't seen many ecommerce sites do this - use illustrations instead of product photographs. Obviously, this will only work for a predictable commodity such as socks, but here it is quite effective.</p> <p>The patterns are given extra vibrancy in 2D and the uniformity between the images makes users want to collect them all.</p> <p>Adding colour swatches underneath each image adds to the attraction.</p> <h3><img src="https://assets.econsultancy.com/images/0006/8727/Screen_Shot_2015-11-05_at_18.03.34.png" alt="odd pears" width="615"></h3> <h3>22. IKEA - checkout errors</h3> <p>Another standard feature, using red to highlight where a user has missed a field or given incorrect information.</p> <p>Some checkouts only use red text and have generic messaging - IKEA is much clearer, bordering the field in red and including an intstructive message in red.</p> <p><img src="https://assets.econsultancy.com/images/resized/0007/7103/screen_shot_2016-07-14_at_12.43.51-blog-flyer.png" alt="ikea checkout" width="470" height="364"></p> <h3>23. AO.com - colour coding products</h3> <p><a href="https://econsultancy.com/blog/66768-ao-com-the-best-ecommerce-experience-available-online/">AO.com</a> uses colour well, with its brand green picking out key features such as delivery information and calls to action.</p> <p>The site also adds the energy rating flags of each appliance (traditionally coloured green to red depending on efficiency). This allows energy conscious users to quickly pick out the best machines.</p> <p><img src="https://assets.econsultancy.com/images/0007/7069/Screen_Shot_2016-07-14_at_08.30.52.png" alt="ao.com" width="615" height="526"> </p> tag:econsultancy.com,2008:BlogPost/68028 2016-07-06T14:21:35+01:00 2016-07-06T14:21:35+01:00 Five ecommerce lessons from Burberry and Hermes Bart Mroz <p dir="ltr"><a href="https://us.burberry.com/">Burberry</a> is a luxury brand that really gets it right. The brand’s digital experience is perfectly aligned with its image and persona - creating a sleek, chic, modern and cool feel.</p> <p dir="ltr">The couture brand uses bold visuals throughout its site, with a dynamic homepage that integrates interactive elements and visually stunning photography that instantly captures the attention of any consumer.</p> <h3 dir="ltr">Create compelling visual design</h3> <p dir="ltr">It’s important to build an ecommerce site that offers compelling visual design to help differentiate your brand from the competition.</p> <p dir="ltr">Burberry does an excellent job at this by creating innovative product pages that are dramatically different from those of its competitors.</p> <p dir="ltr">The details that go into the design elevate the shopping experience and add to the perceived brand value.</p> <p><img src="https://assets.econsultancy.com/images/0007/6804/product_images_plus_thumbnail.png" alt="" width="700" height="412"></p> <p dir="ltr">Product images are all perfectly shot on a consistent backdrop with every element of the product and the model in clear, crisp focus.</p> <p dir="ltr">This makes it possible to see even minute details without zooming in. Consistent and high-quality visuals such as these display your products in the best possible light.</p> <p dir="ltr">One unique visual feature that Burberry’s site utilizes is the use of large image tiles, which makes for a visually appealing browsing experience.</p> <p dir="ltr">Additionally, supplementary product details are sectioned off so consumers can quickly find the exact information they desire.</p> <p><img src="https://assets.econsultancy.com/images/0007/6805/recommended.png" alt="" width="700" height="414"></p> <p dir="ltr">And while many ecommerce sites provide <a href="https://econsultancy.com/blog/65866-how-do-product-recommendations-influence-buyer-behavior/">product recommendations</a> directly below the featured product, this practice can distract shoppers from following through on the purchase.</p> <p dir="ltr">By reducing the footprint of the product recommendation display and aligning it off-center, Burberry presents shoppers with additional options without detracting from the main product. </p> <h3 dir="ltr">Infuse branded content with commerce</h3> <p dir="ltr">An ecommerce site is much more than a destination to purchase products. It provides a platform for brands to engage with visitors and deliver content that tells an interactive story about the brand.</p> <p dir="ltr">Burberry’s website achieves this by seamlessly merging content and commerce to create a fluid and consistent brand image throughout the site.</p> <p dir="ltr">These experiences give users an emotional connection to the brand – similar to that of visiting a physical retail store.</p> <p><img src="https://assets.econsultancy.com/images/0007/6806/burberry_acoustic.png" alt="" width="700" height="416"></p> <p dir="ltr">The <a href="https://us.burberry.com/acoustic/#/acoustic">Acoustic</a> section, for example, features up-and-coming musicians performing in natural environments while dressed in Burberry clothing, yet there is no sign of a hard sell.</p> <p dir="ltr">It feels more like an exclusive look into these individuals’ lives which helps create emotional connections to visitors through music.  </p> <p><img src="https://assets.econsultancy.com/images/0007/6807/burberry_spring_summer.png" alt="" width="700" height="417"></p> <p dir="ltr">The <a href="https://us.burberry.com/our-history/#/heritage/heritage-1800-1">Our History</a> section provides a visual recap of how the iconic Trench Coat has evolved through the years, featuring world-famous models and prominent advertisements through different points in time.</p> <p dir="ltr">Each of these iconic images imbues a deep connection into the history of the brand and the people who helped shape it.</p> <h3 dir="ltr">Simplify the site’s structure</h3> <p dir="ltr">Brands often feature an extensive product line-up so effectively categorizing each product can be challenging, making it difficult for consumers to find exactly what they are looking for.</p> <p dir="ltr">Therefore, it’s crucial to simplify the site’s structure to make it easy for visitors to navigate your products.</p> <p><img src="https://assets.econsultancy.com/images/0007/6809/burberry_site_structure.png" alt="" width="700" height="412"></p> <p dir="ltr">Burberry did an excellent job of this by designing a site that makes exploring both intuitive and simple. The dynamic directory on the left-hand side of the page makes it simple to navigate and search products by category and/or collection.</p> <p dir="ltr">Each and every part of the website can be accessed through this directory and major categories can be expanded into subcategories.</p> <p dir="ltr"><strong><a href="http://www.hermes.com">Hermes</a></strong>, while also a world-class luxury brand with exceptionally crafted merchandise, offers a digital commerce experience that’s severely lacking.</p> <p dir="ltr">When visitors first arrive at the homepage, they’re immediately presented with three options: the brand site, the ecommerce store and store listings.</p> <p dir="ltr">There is a major divide between content and commerce, forcing shoppers to pick one path instead of allowing them to experience the brand in its entirety, and this is just the beginning of the shopper’s journey.</p> <p><img src="https://assets.econsultancy.com/images/0007/6810/hermes_homepage_2.png" alt="" width="700" height="537"></p> <h3 dir="ltr">Balance creativity with functionality</h3> <p dir="ltr">Some brands go so far into differentiating their sites from the competition that they end up confusing their visitors.</p> <p dir="ltr">The Hermes online shop is a prime example of this since the brand presents an unconventional design that makes visitors question whether it functions as an ecommerce site. </p> <p dir="ltr">The homepage looks more like a boutique art gallery than a luxury brand store, with its hand-drawn images that lack descriptions.</p> <p dir="ltr"><img src="https://assets.econsultancy.com/images/0007/6802/hermes_homepage.png" alt="" width="750" height="474"></p> <p dir="ltr"> There is no information to be found about the Hermes brand or any of its product, both of which can add context and content to the brand.</p> <p dir="ltr">Without these elements, the brand loses out on the opportunity to deliver an engaging brand experience.</p> <h3 dir="ltr">Offer Robust Product Pages</h3> <p dir="ltr">On many of Hermes’ product pages, <a href="https://econsultancy.com/blog/67052-a-copywriter-s-template-for-excellent-product-page-descriptions/">product descriptions</a> consist of a few sparse words such as “Printed beach towel” or “Hermes silk tie”.</p> <p dir="ltr">However, the lack of content and information doesn’t stop there.</p> <p dir="ltr">Many product pages offer just one or two images and products are presented on sketches rather than on models; this makes for a great artistic statement but it doesn’t translate well for commerce.</p> <p dir="ltr">.<img src="https://assets.econsultancy.com/images/0007/6811/hermes_towel.png" alt="" width="700" height="356"></p> <p dir="ltr">The Hermes site seems to have been created by artists, for artists.</p> <p dir="ltr">While this approach may resonate with some of the brand’s loyal fans, brands can’t afford to take ecommerce design to such an extreme creative direction in today’s increasingly competitive digital commerce landscape.</p> <p dir="ltr">If a brand’s ecommerce offering doesn’t drive sales or provide content that elevates the brand image, then it fails to deliver on consumer expectations and risks losing market share to its competitors.</p> <p dir="ltr"><em>For more on this topic, see:</em></p> <ul> <li><a href="https://econsultancy.com/blog/64767-where-are-luxury-brands-going-wrong-online/"><em>Where are luxury brands going wrong online?</em></a></li> <li><a href="https://econsultancy.com/blog/67604-what-s-the-point-of-social-media-for-luxury-brands/"><em>What’s the point of social media for luxury brands?</em></a></li> <li><a href="https://econsultancy.com/blog/67731-think-affiliate-marketing-doesn-t-work-for-luxury-brands-think-again/"><em>Think affiliate marketing doesn’t work for luxury brands? Think again</em></a></li> </ul> tag:econsultancy.com,2008:BlogPost/68014 2016-07-05T14:47:00+01:00 2016-07-05T14:47:00+01:00 How charities can win at the Zero Moment of Truth Alasdair Graham <p>Prior to the internet and mobile being such prevalent and omnipotent forces in everyday life, the donor journey looked a lot like the diagram below.</p> <p>Charities' marketing efforts were focused heavily on influencing the “first moment of truth”, the key donation interaction. </p> <h3>The 'classic' three-step mental model</h3> <p><img src="https://assets.econsultancy.com/images/0007/6600/original_mental_model.jpg" alt="Classic 3 step mental model" width="635" height="243"></p> <p>However the donor journey has now changed significantly, largely due to the fact that over three quarters of UK adults now own a smartphone.</p> <p>This connectivity coupled with the shift in donors' expectations in terms of receiving a return from their donation (whether altruistic or otherwise) has given rise to a new mental model and donor journey.</p> <h3> <strong>The new mental model: Zero moment of truth</strong> </h3> <p> <strong><img src="https://assets.econsultancy.com/images/0007/6601/ZMOT_mental_model.jpg" alt="Zero moment of truth for charities" width="682" height="305"></strong></p> <p>The ‘Zero moment of truth’ mental model takes into account today's landscape of highly connected and diligent donors whose donation journeys span multiple marketing channels, devices and timespans.</p> <p>Utilising the Proctor &amp; Gamble and Google '<a href="https://www.thinkwithgoogle.com/collections/zero-moment-truth.html">Zero Moment of Truth</a>' or ‘ZMOT’ model shown above, alongside our own qualitative research into 25 of the UK's top charities, this article aims to highlight pitfalls and opportunities for charities in digital with a specific focus on the defining ZMOT.</p> <h3>Zero Moment of Truth: ‘ZMOT’</h3> <p>The zero moment of truth is:</p> <ul> <li>A commuter reading the news on his iPhone while travelling to work, seeing the need for aid due to a natural disaster and doing a Google search on his phone for how he can help/donate. </li> <li>The managing director of a local business monitoring regional social media on her mobile for an opportunity to give back to the community through a charitable donation.</li> <li>A young office worker on her lunch break with a family member affected by an illness researching which charity will make the most of her donation from her desktop computer.</li> </ul> <p>The ZMOT is a moment that has never been more prevalent and is ultimately where donations are won or lost.</p> <p>Communicating effectively in this moment can also be the difference between a one-off donation of £5 or a standing monthly donation of £10.</p> <blockquote> <p>84% of people said that ZMOT shapes their decisions. It’s now just as important as stimulus and the first moment of truth in moving consumers from ‘undecided’ to ‘decided’ in terms of who they choose to donate to, how much and with what regularity.</p> </blockquote> <p>During the zero moment of truth or ‘research/choosing’ phase it is essential to put your best foot forward and ensure your charity is front and centre in users' searches and conversations where possible.</p> <p>As an example, a young man has been incited to donate to a cancer charity due to a recent personal scare.</p> <p>He performs a Google search on his phone for “cancer charities” which returns three prominent AdWords results for Macmillan, Cancer Research UK and Alder Hey.</p> <p><em>Google mobile search for "cancer charities"</em></p> <p><img src="https://assets.econsultancy.com/images/resized/0007/6602/cancer_charities_google_mobile-blog-flyer.jpg" alt="Google search for cancer charities" width="470" height="508"></p> <p>However, a quick review of the sites' homepages raised more questions than were answered, so later a second Google search is undertaken at home on a laptop computer for “where does the money I donate to cancer research go”.</p> <p><em>Google desktop search</em> </p> <p><img src="https://assets.econsultancy.com/images/resized/0007/6603/2016-06-22_17_02_49-where_does_the_money_i_donate_to_cancer_research_go_-_google_search-blog-flyer.png" alt="where does the money I donate to cancer research go" width="470" height="596"></p> <p>Despite the fully populated <a href="https://econsultancy.com/reports/paid-search-marketing-ppc-best-practice-guide/">PPC ads</a> in the returned search results, not one of them answers the query, with the majority just dumping the user on a ‘donate’ page with no further information.</p> <p>Worse still, the top result from Cancer Research UK directs the user to a broken page – not good!</p> <p><em>Cancer research UK paid search landing page for Google query “where does the money I donate to cancer research go”</em></p> <p><img src="https://assets.econsultancy.com/images/0007/6606/cancer_research_broken_site_screenshot.png" alt="Broken landing page cancer research" width="662" height="174"></p> <p>This presents a significant opportunity to improve visibility and relevance in paid search, particularly for Cancer Research UK in this instance.  </p> <p>Thankfully the organic listings, which are dominated by Cancer Research UK, are more useful.</p> <p>They provide a clear answer – “80p of every £1 given is used to beat cancer” and that “thanks to donations Cancer Research UK have doubled cancer survival rates.”</p> <p>Provided a user heads straight into organic results then Cancer Research UK could consider the ‘Zero Moment of Truth’ won. However it's likely, particularly on mobile, that a paid result will be clicked.</p> <h4>What about the competition?</h4> <p>This particular search engine results page also raises the question “where are the other cancer research charities in the organic results?”</p> <p>In addition to the search example shown above, it is imperative to consider what questions your potential donors may be asking in the zero moment of truth and where they are asking them.  </p> <p>From here it’s important to be where your donors are and to address their queries across organic and paid search, social media, their emails and on news sites and blogs.</p> <p>Additionally, there is significant value in personalising messaging based on who’s reading your ‘ZMOT’ content.  </p> <p>This is obviously far easier on channels such as Facebook or Twitter, however there are opportunities to tailor messaging in search using geotargeting or <a href="https://support.google.com/adwords/answer/2701222?hl=en-GB">Remarketing Lists for Search Ads</a> or strategically targeting content to local news sites and blogs.</p> <h3>First Moment of Truth: ‘FMOT’</h3> <p>The first moment of truth is:</p> <ul> <li>A donor visiting your website and making a standing monthly donation of £15.</li> <li>The friend of someone doing a charity 10k run that has posted a link to their JustGiving page on their Facebook feed and been inspired to give to the cause through the JustGiving platform.</li> <li>Someone that follows your charity on Twitter and appreciates the work being undertaken, then passes by a charity box on their lunch break and gives a cash donation.</li> </ul> <p>Given the prevalence of mobile devices and trust in online financial transactions over the past decade it may be a surprise to find that the vast majority of donations are still made offline.</p> <p>According to a 2015 study from Barclays, <a href="https://www.barclayscorporate.com/content/dam/corppublic/corporate/Documents/research/the-future-of-charitable-donations.pdf">79% of donations</a> are still being made offline with ‘direct cheque’ and ‘direct cash’ donations leading the charge.</p> <p><em>Online vs. offline donations</em></p> <p><img src="https://assets.econsultancy.com/images/resized/0007/6609/online_vs_offline_donations_pie-blog-flyer.jpg" alt="Online vs offline charitable donations" width="367" height="358"></p> <p>This currently makes the first moment of truth more often than not a donation box, phonecall or personal interaction rather than a website or app.</p> <p>A situation that is potentially made worse by the fact that one in five charities don’t currently facilitate online donations on their own sites.</p> <p>However, this is set to change as younger donors tend to have a strong preference for donating online.  </p> <p>The Barclays study indicates that 72% of charities expect an increase in donations stemming from social media activity and 87% of charities agree that they’ll receive significantly more donations directly via their website in the near future.</p> <p>While the majority of the 25 charities we surveyed have made a strong effort to facilitate online donations, there are still significant opportunities for improvement across the board to improve conversions and total donations.</p> <p>None of the charities we surveyed were employing customisation measures to improve site user experience and donations. </p> <p>Provided data can be collected from existing and new donors such as their location, demographic or past donations, site content can be customised to improve conversions and maximise the value of a donor.</p> <p>As an example, first moment of truth donor experience customisation could take the form of:</p> <ul> <li>Tailoring site content based on user data, for example personalising content based on location to indicate where your charity has helped in the donor's region.</li> <li>Tailoring suggested donations based on user data such as location, or past donations.</li> </ul> <p>This engagement, customisation and initial contact is particularly important for young, first-time donors, because gaining affinity among them will be critical to future donations as they grow older and more affluent.</p> <p>Additionally, making an effort to attract online donations can significantly improve the addition of Gift Aid as the process is far easier compared to offline.</p> <h3>Second Moment of Truth: ‘SMOT’</h3> <p>The second moment of truth is:</p> <ul> <li>A donor receiving a welcome email giving thanks and indicating where their donations may be getting spent.</li> <li>A donor completing a donation online and being shown a ‘thank you’ page that allows them to quickly share where they donated and how it's going to help.</li> </ul> <p>One item often not considered with charitable donations is the second moment of truth – the user's ‘experience’ of the donation and how this moment can be used to influence other potential donors in their zero moment of truth.</p> <p>While 100% of the 25 major charities we surveyed sent a follow-up ‘thank you’ email, 44% of those emails were not personalised to any significant degree (only names were ‘personalised’).</p> <p>Additionally, there were only limited opportunities to share your donation and information about the charity's work, which again has the potential to become another donor's ZMOT, creating a positive feedback loop from user-generated content and conversation.</p> <h3>Key Takeaways</h3> <h4>1. Online donations set to increase</h4> <p>While online isn’t a major player at the moment in terms of volume it is almost guaranteed to become the primary means of donation in the coming years as younger, digital native donors begin to gain affluence.  </p> <p>This is backed up by the fact 71% of charities are seeing ongoing increases in online donations.</p> <p>The benefits of online donations reach much further than convenience and capturing the ‘next generation’ of donors, as online donations significantly increase the likelihood of Gift Aid additions and also present opportunities to engage donors in an on-going relationship through targeted online communications.</p> <p>Furthermore, the charities that invest in and get digital correct early on are likely to be the key players in the coming years.</p> <h4>2. Provide relevant information to user queries</h4> <p>Pay close attention to how your donors are behaving in the zero moment of truth.  </p> <p>In the example given earlier, a search for “where does the money I donate to cancer research go” yielded a paid result that led nowhere.  </p> <p>Capitalising on opportunities and queries such as this with targeted information can significantly increase the chances of donation.  </p> <p>A valuable exercise here may be to ask the questions “what would incite me to donate to a particular charity over another” and “what questions would I be asking to validate my choice of charity and where would I be asking them”.</p> <h4>3. Use social to influence the ZMOT</h4> <p>Take every opportunity to facilitate the positive feedback loop between a donor’s second moment of truth and their creation of a new donor's zero moment of truth.  </p> <p>For example, creating opportunities to share details of your donation and its impact on the donation complete page.  </p> <p>Potentially pre-populate a share that is customised to the donation amount, for example “I just paid for a month's worth of clean water for a child in Tanzania – You can make a difference too...”</p> <p>This circumvents any friction around “what to share” or “what to say” with social shares.</p> <p>Furthermore, taking the opportunity to give sincere thanks and show how each donation is being used can pay significant dividends in terms of creating brand affinity and promoting sharing and discussion around your charity.</p> <p>Again, this creates a positive feedback loop into the zero moment of truth.</p> <h4>4. Personalise experiences wherever possible</h4> <p>Personalisation across all points inclusive of stimulus, zero moment, first moment and second moment of truth is a cost effective way to improve conversion rates and can also influence donation amount and frequency.</p> tag:econsultancy.com,2008:BlogPost/67994 2016-06-29T11:41:12+01:00 2016-06-29T11:41:12+01:00 10 ecommerce UX treats on the new Oasis website Ben Davis <h3>1. Product photograph carousels in listings</h3> <p>Yes, there's a quickview functionality (click the eye icon) but there's also the option of cycling through product shots on the filter page in a mini slider, as shown in the GIF below.</p> <p>Great stuff. They work nicely on mobile, too.</p> <p><img src="https://assets.econsultancy.com/images/0007/6497/oasis_products.gif" alt="oasis product listings" width="585" height="297"></p> <h3>2. Filter products by stock in your local store</h3> <p>This is smart. <a href="http://www.oasis-stores.com/gb/home">Oasis</a> allows me to filter my search by stock in my local store.</p> <p>So, if I'm setting off in ten minutes to go shopping, I can see whether the item I want will be available when I get there.</p> <p>Yes, I can order a product to store, but that takes time. This feature allows instant gratification, making the website a tool for offline shopping.</p> <p><img src="https://assets.econsultancy.com/images/0007/6495/Screen_Shot_2016-06-24_at_15.07.14.png" alt="oasis search filters" width="615" height="331"> </p> <p>Oasis is also promoting what it calls 'seek &amp; send'. If a product is out of stock at the distribution centre, Oasis will source it from remaining stock in stores.</p> <p>This is what the best retailers do (<a href="https://econsultancy.com/blog/64758-how-in-store-tech-improves-customer-service-for-schuh/">Schuh has been doing it</a> for a while), so plaudits to Oasis for enabling it.</p> <p>What's slightly strange is that Oasis doesn't go the whole hog and consolidate store and warehouse stock on the website. Saying 'good things are hard to find' could be seen as an indictment of operations.</p> <p>I'm being picky - it's a definite improvement.</p> <p><img src="https://assets.econsultancy.com/images/resized/0007/6501/screen_shot_2016-06-24_at_15.57.02-blog-flyer.png" alt="seek and send" width="470" height="257"></p> <h3>3. Best-sellers and 'loved right now' carousels on the homepage</h3> <p>There's debate in ecommerce about whether it's a good idea to put products on the homepage.</p> <p><a href="https://econsultancy.com/blog/67394-why-ecommerce-retailers-should-never-place-products-on-the-homepage/">Some say</a> it reduces scrolling below the fold and diminishes user momentum on entry.</p> <p>Personally, I'm not so sure - if users are looking for something specific, they won't necessarily hit the homepage, but casual shoppers might.</p> <p><img src="https://assets.econsultancy.com/images/0007/6493/Screen_Shot_2016-06-24_at_14.50.03.png" alt="loved right now and bestsellers" width="615" height="394"></p> <h3>4. Chunky predictive search includes commerce <em>and</em> content</h3> <p>I really like the search bar. It's chunky, <a href="https://econsultancy.com/blog/66082-how-john-lewis-m-s-and-debenhams-handle-on-site-search">predictive</a> and easy to use (aside from a tiny bug where rollover of a two-word suggested search term only underlines one word).</p> <p>As you can see in the screenshots below, not only are products surfaced as I am typing, but once I hit my search results page, I can toggle from products to content.</p> <p>I haven't seen this functionality before. It could arguably distract from ecommerce, or perhaps further integrate content to increase dwell time. </p> <p>All will depend on the quality of the articles - which I didn't think worked particularly well on mobile, with small font and no clarity of message.</p> <p><em>Predictive search</em></p> <p><img src="https://assets.econsultancy.com/images/0007/6487/Screen_Shot_2016-06-24_at_14.38.34.png" alt="oasis search" width="615"></p> <p><em>Search results include articles</em></p> <p><img src="https://assets.econsultancy.com/images/0007/6486/Screen_Shot_2016-06-24_at_14.25.22.png" alt="oasis search" width="615" height="303"> </p> <h3>5. Shoppable user-generated content (UGC)</h3> <p>This feature is becoming increasingly common, and I think Oasis has done a good job here.</p> <p>There's plenty of content already loaded and it seems genuine, giving shoppers a better idea of what pieces look like on a 'real' model.</p> <p>Photos can be uploaded from Facebook, Instagram or from your hard drive / photo library. The section also promotes the hashtag #destinationoasis for shoppers to share their looks.</p> <p><img src="https://assets.econsultancy.com/images/0007/6476/Screen_Shot_2016-06-24_at_14.10.03.png" alt="oasis ugc" width="615" height="321"></p> <p><em>Excuse my ill-timed volume control</em></p> <p><img src="https://assets.econsultancy.com/images/0007/6472/Screen_Shot_2016-06-24_at_13.58.46.png" alt="ugc oasis" width="615" height="365"></p> <h3>6. E-receipts added to your online account</h3> <p>This hasn't been implemented yet, but soon offline shoppers will be able to request an e-receipt, not just on email, but saved to their online account.</p> <h3>7. Clean and clear product pages with UGC included</h3> <p>The product pages are well laid out on desktop. I particularly like the fact that the user can see each thumbnail photograph clearly, before they select them.</p> <p>User-generated content is included in these thumbnails, too.</p> <p>We're familiar with <a href="https://econsultancy.com/blog/66040-how-should-you-approach-product-videos-for-ecommerce/">product video</a> by now, but Oasis does it well here, with a full 18-19 seconds of footage.</p> <p><img src="https://assets.econsultancy.com/images/0007/6502/Screen_Shot_2016-06-24_at_16.08.58.png" alt="product page oasis" width="615" height="339"></p> <h3>8. Silly rollovers</h3> <p>I'm all for <a href="https://econsultancy.com/blog/67345-23-creative-examples-of-hover-states-in-ecommerce-ux">micro-interactions</a> to spice up a desktop website (these rollovers are redundant on mobile), but these feel a little pointless.</p> <p>Yes, they're twee, but the more annoying thing is that when I rollover them, I forget what category I'm hovering over.</p> <p>A minor quibble on a lovely website.</p> <p><img src="https://assets.econsultancy.com/images/0007/6477/rollies.gif" alt="oasis rollovers" width="585" height="229"></p> <h3>9. Slightly weird copywriting</h3> <p>In some places, I do get the feeling that the <a href="https://econsultancy.com/training/courses/online-copywriting/">copywriting</a> has been done by someone who doesn't quite have an ear for fashion speak.</p> <p>Here's a good example - 'anyone for tennis?' - not quite sure what relevance that has for the little black dress, gown or mini. Perhaps I'm nitpicking.</p> <p><img src="https://assets.econsultancy.com/images/0007/6491/Screen_Shot_2016-06-24_at_14.44.55.png" alt="anyone for tennis" width="450" height="459"></p> <h3>10. 'Why create an account?'</h3> <p>More best practice done well, giving users reasons why they should register for an account.</p> <p><img src="https://assets.econsultancy.com/images/resized/0007/6494/screen_shot_2016-06-24_at_14.42.31-blog-flyer.png" alt="why create an account" width="470" height="413"></p> tag:econsultancy.com,2008:Report/934 2016-06-21T14:00:00+01:00 2016-06-21T14:00:00+01:00 Digital Marketing Template Files Econsultancy <h3>Overview</h3> <p><strong>Digital Marketing Template Files</strong></p> <p><strong>Authors:</strong></p> <ul> <li>James Gurd, Owner and Lead Consultant, <a title="Digital Juggler" href="http://digitaljuggler.com/">Digital Juggler</a> </li> <li>Ben Matthews, Director, <a title="Montfort" href="http://montfort.io/">Montfort</a> </li> <li>Ger Ashby, Head of Creative Services, <a title="Dotmailer" href="https://www.dotmailer.com/">Dotmailer</a> </li> <li><a title="Starcom Mediavest Group" href="http://smvgroup.com/">Starcom Mediavest Group</a></li> </ul> <p><strong>Files available:</strong> 10 file bundles, 50+ individual template files<br></p> <p><strong>File titles:</strong> See sample document for full breakdown of section and file information.</p> <h3>About these files</h3> <p>Need help with an area of digital marketing and don't know where to start? This pack of downloadable files contains best practice templates that you can use in your digital marketing activities. Feel free to adapt them to suit your needs.</p> <p><iframe src="https://www.youtube.com/embed/jxKmQGxspc8?wmode=transparent" width="560" height="315"></iframe></p> <h3>Contents</h3> <p>In this release we have 10 template bundles containing over 50 individual template files for digital marketing projects.</p> <p><strong>Download separate file bundles below:</strong></p> <ul> <li>Affiliate Marketing</li> <li>Content Marketing</li> <li>Display Advertising *to be published soon*</li> <li>Ecommerce Projects</li> <li>Email Marketing</li> <li>Search Engine Marketing: PPC</li> <li>Search Engine Marketing: SEO</li> <li>Social Media and Online PR</li> <li>Usability and User Experience</li> <li>Web Analytics</li> </ul> <p><strong>The template files bundle also includes a <a href="https://econsultancy.com/reports/small-business-online-resource-manager/">Small Business Online Resource Manager</a> that </strong><strong>can help you effectively manage and own your online assets.</strong></p> <p><strong>There's a free guide which you can download to find out more about exactly what is included.</strong></p> tag:econsultancy.com,2008:BlogPost/67955 2016-06-16T11:42:03+01:00 2016-06-16T11:42:03+01:00 How one simple A/B test helped RS Components increase add-to-cart conversion by 159% Ben Davis <p>The brand was winner of a <a href="http://www.festivalofmarketing.com/awards/categories?utm_source=econsultancy&amp;utm_medium=blog&amp;utm_campaign=econ%20blog">Masters of Marketing Award</a> in 2015 for user experience. We've <a href="https://econsultancy.com/blog/67239-the-ultimate-ecommerce-cro-ux-case-study-rs-components/">previously detailed some of this award-winning UX work</a> on the blog.</p> <p>Improvements included:</p> <ul> <li>Image-supported predictive search.</li> <li>Surfacing popular categories in search, above returned products. This has increased clickthrough.</li> <li>Increasing the speed of faceted search by 70%, with a 40% increase in conversion.</li> <li>Extended sort and compare functions.</li> <li>Express checkout and 'remember me'.</li> <li>Large and more dynamic product pages with embedded video.</li> </ul> <p>As such, conversion growth (year on year) is at a four-and-a-half year high, up 10%.</p> <p>In this post, I thought I'd bring you one extra titbit.</p> <p>It's an <a href="https://econsultancy.com/blog/67249-a-beginner-s-guide-to-a-b-testing/">A/B test</a> that implemented no drastic changes to the RS Components UI, but one that yielded impressive results and was a winner of the <a href="https://blogs.adobe.com/digitaleurope/personalisation/adobe-summit-emea-winners-whichtestwon-contest/">WhichTestWon Competition</a> at 2016's Adobe Summit in EMEA.</p> <h3>Stock levels - visual cues test</h3> <p>The RS Components website displayed product listings with no clear indication of stock levels, only a call to action allowing the user to 'check stock levels'.</p> <p>Customer feedback and best practice wisdom told the RS team that this was a frustrating experience, as customers want to know an item is in stock before they go to add it to their basket.</p> <p>So, the team knew that adding a visual cue in product listings would likely generate an improvement in conversions to basket.</p> <p>An A/B test was conducted to demonstrate the impact of improving this area of the site, in order to create a business case for rolling out this change across all products.</p> <p><em>The pre-existing RS Components site, showing product listings with 'check stock levels' call to action.</em></p> <p><img src="https://assets.econsultancy.com/images/0007/6152/A.png" alt="rs components test 1" width="275" height="361"></p> <h4><strong>Test A</strong></h4> <p>Version A placed an 'In stock' marker in green on each product listing, with a grey link to 'check qty'.</p> <p>This was a fairly subtle change, I think you'll agree, but an improvement on the pre-existing UX.</p> <p><img src="https://assets.econsultancy.com/images/0007/6153/b.png" alt="rs components test 1" width="285" height="360"></p> <h4><strong>Test B</strong></h4> <p>Version B was a little bolder, with an 'In stock' green flag in the corner of each listing and a tick for good measure.</p> <p>The 'check stock levels' call to action becomes clearer, taking up the full space beneath the quantity field and 'add' button.</p> <p>As is fairly obvious from the emblazoned screenshot below, this version was the winner, increasing add-to-basket clickthrough rate by 159%.</p> <p><img src="https://assets.econsultancy.com/images/0007/6151/Untitled-4.png" alt="rs components test 2" width="309" height="368"></p> <h3>Conclusion</h3> <p>This is a snappy little test but one I thought deserved publishing, just to re-emphasise that although the concept of <a href="https://econsultancy.com/blog/67920-how-can-we-design-experiences-that-increase-customer-happiness">customer happiness</a> is in vogue (and rightly so), focusing on small and tangible improvements is still the bedrock of ecommerce.</p> <p>Let us know in the comments if you've got your own similar examples of uplift through A/B testing.</p>