UserDesign

Future Plc. Magazines

THE PROJECT

International web portal for selling and subscribing to world renowned magazines including .Net, Total Film, T3, PC Gamer and Digital Camera magazine.

GOALS

Reduce bounce rate, increase conversion, audit existing solution and online brand.

THE TEAM

  • Agile / scrum / sprint methodology
  • UX Consultant Lead
  • Product Lead
  • Tech Lead
  • BA (Business Analyst)
  • Senior Designer
  • Junior Developer

TURNAROUND TIME

8 months.
January – August 2015.

BRIEF

Future Plc’s online portal for selling online magazine subscriptions needed an overhaul, new responsive design and new back-end system. However due to lack of resource initially it required identifying crucial areas to improve the existing solution.

After looking at the analytics, it was clear that the home page had the highest bounce rate and was the most problematic for users. We looked at the whole journey – from direct traffic or Google and SEO perspective i.e. users could type in “digital camera magazine subscription” where the descriptive text, title for the page needed to be considered as part of the journey to get users to the correct site/landing page,

Throughout all of these processes we worked within an agile, scrum environment having daily stand-ups and meetings ensuring the robustness of the original brief remained intact, and all parties including the development agency, internal designers and business stakeholders were engaging and happy with the ongoing user experience audit and design. ‘Popcorn’ sessions and workshops were implemented to engage key client team members resulting in their tangible feedback on the existing solution.

RESEARCH & TESTING

An array of research was completed including remote, guerrilla and lab user testing. An example of a simple user task given:

To the user: imagine you are familiar with the magazine, and have bought single issues before
User task: subscribe to Digital Camera Magazine under the best offer available

This particular lab testing was completed in controlled conditions and enabled us to audit the existing solution with a wide demographic of people (ranging 25-45), giving us an unbiased insight into people’s perceptions of the existing solution.

Lab Test Video – Edward, Airline Pilot, 30

Lab Test Video – Primary School Teacher, 25

User research and data was provided by a paper questionnaire within the magazines and an email survey questionnaire. This fed into the initial video testing findings to assist the process of defining key user journeys and user personas.

Finally, added to the initial research was analytics taken from Google Analytics – namely conversion, bounce rate and the e-commerce omni-channels i.e. add to basket and complete purchase. Many subscribers for example did subscribe via a printed form within the magazines rather than online, but went on to manage their account online.

The mobile site was having little positive impact i.e. the revenue was small, so the desktop site was served to mobile with the .m switched off to aid design and journey consistency (until a responsive site was rolled out).

Initial remote user testing was also undertaken via usertesting.com with the demographic pre-defined (25-45 year olds, male and female), who had previously subscribed to a magazine. Users were given their top 5 elements to pick from. They were asked this before they even saw Future’s and a competitor’s site (for comparison). This provided intel on what the user was looking for as soon as they landed on the page. Examples include ‘Subscribe Now’ CTA (call to action), product image or contact information.

Remote video test with card sort, questionnaire, competitor analysis

FINDINGS & METHODS

Users wanted:

  • More visually inspiring content – magazines are a visual medium, with the cover the biggest USP
  • Less journey interruptions
  • Less clutter
  • Clearer subscription options

Once we had identified the clear target points, user journeys and personas, we began to develop prototypes and designs for a new home page. It was clear that most users were looking to make a purchase for the first time or renew subscriptions – there was very little in-between.

INITIAL OUTCOMES, WIREFRAMES & TESTING

Several prototypes and designs were developed, mostly high-fidelity as we knew users were after a visually appealing design and craved a simplified route to purchase.

For every iteration of the home page we tested remotely with at least 6 users, comparing the experience to competitors to help reach a conclusive design and prototype to test.

Remote video test with card sort, home and category page feedback

Crucially we went out and put this in front of real people in a public place (guerrilla user testing). Users were given card sorts before being shown anything visual, again this gave us a neutral understanding of what they were expecting to see or require to achieve a goal i.e. subscribe to a magazine online.

They were shown the existing home page, category page (as they were asked to click through this far to the journey) along with competitors, and then a proposed new design. Finally they were asked what their preference was on  design, journey and interaction to give conclusive feedback.

Guerrilla cafe user test with card sort, audio, visual feedback

MULTIVARIATE A/B TESTING

Once we were confident in the new home page concept and had a “winner”, we built within Optimizely (a leading A/B testing platform) and delivered to a small amount of traffic – monitoring the overall engagement within Optimizely itself (goal clicking) and GA analytics where the testing event had triggered to give us a in-depth understanding of user demographic, behaviour and buying ecommerce behaviour. The traffic allocation was then increased and the results were in.

Due to the success of the new home page and new tab structure we rolled this out to the product listing page (PLP) to deliver a hand-in-hand experience. This was successfully MVT (multi-variant) A/B tested and put live on the site aiding conversion, engagement and lowering bounce rate. A success. Next we applied the same principles above to the next key pages – the product detail pages (PDP). This included the subscription and single product pages.

Using the same methodologies as above, we quickly achieved a revised design which was then put out for testing.

FINAL OUTCOMES

SUCCESSES

  • 15k monthly uplift once the home and category page went live
  • Increased conversion – up by 1%
  • More subscriptions
  • Lower bounce rate – down by 1%
  • Visually appealing (feedback has been positive on the lager product images)
  • Improved CTR (click through rate)
  • On brand (more recognised with trusted, explicit logo and consistent brand message)

FUTURE PROPOSALS

Having maximised the existing solution, a new back-end order fulfilment system and front-end design was required. We proposed several key responsive visual designs to launch with these new systems, but due to budget concerns this project ceased until further notice.

The above proposed designs have been “parked” for future use to re-launch and rejuvenate the site, to better utilise mobile and tablet devices.

SKILLS / SOFTWARE UTILISED

Adobe Photoshop, Axure, OmniGraffle, InVision, Optimizely, paper sketching, Google Analytics, jQuery, CSS3, HTML5, guerrilla lab remote user testing, Adobe Illustrator, Multivariate A/B testing, UI visual design, retina assets, workshops, popcorn sessions, agile, scrum, responsive design, mobile, tablet, prototyping, NetSuite SuiteCommerce CMS, stakeholder meetings, storyboarding, accessibility, usability studies