MyMURO Website Redesign
A 3-week design sprint for MyMURO, an educational children’s toymaker.
I was working on a team with two other UX graduates and had the role of facilitator. I was also responsible for creating the high fidelity prototype and preparing all deliverables for handover to the client. These included a style guide, the component library of nested symbols, and the project to be uploaded to Zeplin.
Overview
Our brief from the client was simply to carry out a redesign that would improve the checkout conversion rate on the MyMURO website. At present they are using Shopify, but intend to build a new site in Q3 ’20 ahead of the Christmas period. Our findings will enable them to make the most of their busiest time of the year, with 70% of annual sales usually made in Q4.
We delivered an improved user flow that encourages visitors to better understand the benefits of purchasing a MyMURO toy. This was supported by a restructure of the website’s information architecture, including the navigational elements and sitemap. We also improved accessibility throughout the site, most notably through the checkout process. Whilst nothing has yet been implemented to provide quantitive proof of an improvement to the conversion rate, I believe that the results of our usability tests demonstrate that we achieved our goal.
Understanding the product
Our brief gave a specific but very broad goal, so our first step was to immerse ourselves in the product itself. We had access to the current Google Analytics so I reviewed the data available and it was very insightful. The client had asked for a desktop-first redesign but it transpired that over 70% of the site’s traffic was mobile so we reprioritised. 75% of visitors to the site were woman, with the majority aged from 25–34. Only 2% of visitors were signing up for the newsletter, a waste of an often lucrative resource.
There was a disproportionately large drop out on the ‘shipping’ page of the checkout process and an embedded video on the homepage was making it very slow to load. Most interestingly, a surprisingly large amount of traffic was landing on one of the blog posts instead of the homepage, but then almost invariably navigating away from the site instead of exploring further. It transpired this was the result of a successful Facebook marketing campaign and gave us a much more distinct problem to solve.
We conducted a complete content audit of the existing site and it became clear that MyMURO has a unique value proposition that would help shape our designs in the later stages of the process. It was also clear that there was a large amount of valuable yet hidden content that no users were accessing. We used a couple of questions in our screener survey questions to address the relevance of these pages to those considering a purchase (very). I’ve shown the updated sitemap below, complete with new taxonomies ratified through user testing.
Defining the opportunity
Armed with a better understanding of the brand, we considered MyMUROs direct ‘boutique’ competitors and compiled a feature analysis for a quick overview of how they compare. The UK market for toys marketed specifically at under 5’s is estimated be worth $1,574,000,000 in 2020 but it’s incredibly crowded, making it important to stand out. We also considered bigger brands, who generally feature a lower price point but put less emphasis on the developmental benefits of their products.
It was then time to consider our user. We used an online survey to get a general overview, and carried out 12 phone interviews with parents to gain a deeper insight. The responses from the latter were compiled on a Google Sheet, before being transcribed onto post-its on a Miro board and affinity mapped.
All of our insights so far enabled us to define the user for whom we’d be designing. From this point onwards, any decisions to be made would be from the perspective of Amy and her goals and frustrations. We created an experience map based on our research and this highlighted her pain points in the buying process. To focus our design efforts we used a problem statement, and also illustrated an outcome statement to outline our goals for the project.
Collaborative ideation
With the user and problem defined, I facilitated a design studio with the client via Miro & Zoom. This was based on 3 ‘how might we’ questions and proved a great opportunity to get the client involved in the design process. The most beneficial was the question ‘how might we make the educational benefits of each toy easily understandable to the user’, resulting in an interactive page that will encourage parents to learn more about the toys’ developmental benefits specific to their own child.
This more tailored approach will reduce the information overload currently experienced by parents and testimonials from accredited experts will give the guidance credibility. We also considered how to maintain the educational integrity of the blog posts whilst still directing users from them into the shop. As a team we conducted design studios all the way through to the high fidelity screens, finding them to be both efficient and effective despite not being in the same room.
Refining the solution
Remote working definitely makes the paper sketch stage a little more time consuming and less naturally collaborative (mid-lockdown in London!), but we soon moved onto Sketch and InVision to create a low fidelity prototype. Using a testing script with scenarios and prompts for feedback, we conducted usability tests over Zoom and again compiled the results into a Google Sheet. The results were affinity mapped and formed the rationale behind the next round of iterations made to the prototype.
We found the mid-fi tests to be the most useful as the inclusion of text had our users becoming very vocal in their opinions; parents make really excellent test subjects. Amy was still at the forefront of our minds as we endeavoured to keep all of the most relevant information easily accessible without allowing the pages to become cluttered. Given the limited real estate of a mobile screen this wasn't always straightforward, but I think we achieved a good balance in the end.
One of our goals was to make the educational content on the site more accessible and we achieved that through a multi-media offering instead of the long blog posts that many parents struggle to find the time to read.
I found working on the high fidelity screens really enjoyable; there was lots of scope for creativity and the product really lends itself to fun elements like the interlocking puzzle pieces. I became best friends with my spacers and really focused on creating consistent components to keep things scalable — given the amount of iterations that were made this was a worthwhile effort. On reflection I could have saved some time on the earlier versions by worrying less about the small details and focusing only on the iterations needed for the next round of testing.
Results
Our final round of testing went very smoothly and the client was delighted with the final screens as well as the rationale behind them. We believed that by removing any perceived obstacles from the user flow, be it adding more intuitive navigational elements or restructuring the homepage, we could increase the sales conversion rate. In addition, by better educating users on MyMURO’s USPs and developmental benefits it should be possible to corner a larger portion of the market.
Link to the final prototype: https://invis.io/S9Y7X59YE2M
Next steps
We created a list of recommendations for the client based on user feedback, including offering free UK shipping and increasing the amount of content written by accredited educators on the site. We were reliant on the results of our final usability tests as our success metric, so it would be worth conducting A/B testing on the main pages in the updated user flow.
From a design perspective, the filters on the product pages need refining in preparation for a larger range of products being added to the site. Tree testing of the product taxonomy would also be useful here. I realised whilst writing this post that there should be an option to create an account on the checkout confirmation page!
Retrospection
Overall we were incredibly fortunate to have a bump-free ride throughout this project, aside from the lifetime ban on Mumsnet (I should probably have read the rules before posting a survey link). Our team Miro board was invaluable and kept our efforts efficient despite residing in different countries throughout. I think that as facilitator I was able to bring out the best of my teammates, making it a learning experience whilst remaining results driven.
My main takeaway is to prioritise better during the design phase, specifically when the more intricate elements are introduced. There’s no point perfecting a puzzle piece when there’s a high chance it’ll need to be restructured the following day; far better to wait until the design has been ratified through testing.
