• Origin Store

Origin Store

2013

Role: Visual Designer |  Team: 2 Interaction Designers, 3 Engineers, 1 Product Manager

Case Study – Origin Store Redesign

My team and I were tasked with reimagining EA’s digital distribution platform for video games so we transformed Origin’s e-commerce experience from the ground up. However, before you can start a redesign, it makes sense to do a deep dive into the current architecture to figure out exactly what were some of the issues with the old experience.

Deep Dive before the Redesign

My team and I were tasked with reimagining EA’s digital distribution platform for video games so we transformed Origin’s e-commerce experience from the ground up. To start a deep dive into the current architecture to figure out exactly what were some of the issues with the old experience. What we found:

  • Hard to customize, messy back end
  • Inconsistent look and feel
  • Customers couldn’t find what they were looking for

Left: old homepage, Right: interim product details page

Who to consider in the Redesign

  • Gamers: Core customers
  • Store Operations: Runs the store on a daily basis, makes updates and changes
  • Merchandisers: Runs promotions for users, provides engaging content for customers

Understanding Strategic Business Requirements

We defined our goals and initiatives so that we could design or them. We knew we wanted one single store (to rule them all) and not a different store on the web vs a different store in the application. We wanted to consolidate the store experience into one that was easier to update and maintain. We wanted a more streamlined checkout, as well as a flexible framework to expand more content in the future.

Competitive Analysis

We conducted a competitive analysis and looked at best in class across different industries (in addition to Steam/Apple iTunes). We looked at Amazon for their successful one click checkout, and Target for that consistent brand and experience across web and mobile devices. We also researched eBay and Amazon for ways they helped users to find things easily and their success in terms of SEO using canonical URLS for long tail search.

Testing before the Redesign

There’s a constant push and pull between customer needs vs business needs. Our team knew it was important to balance both. The customer asks: “Am I getting the best value? Do I trust this website?” The business asks: “Can we provide the products the customer wants?” “Can we get them to buy more?” We performed a series of usability tests on the old store to help make decisions for the new one we were designing.

Enhancing the Product Details Page

Because it was important to get the product page right, the team created an interim PDP before diving into the new store redesign. Here’s what was done:

  • Increased screenshot/.media size for the customers
  • Added multiple platform selectors for easier comparison
  • Added in promotional modules for exclusive content and special offers for the business

We found customers loved the ability to switch platforms easily and this increased add to carts by 4% with a 15% reduction in bounce rate.

Introduction of a Persistent Cart

The team integrated with Sims.com and tested a persistent shopping cart. What we saw was a 33% lift in items added to cart.

New Store Experience

This version displays beautiful and impactful artwork, it speaks to what the game is about and evokes emotion. The key focus of this layout is on specific franchises. Below the large hero is a series of modules that work off a flexible framework that can be merchandised with the user in mind. Layouts can be rearranged quickly and effectively with little design oversight, which increases better operational efficiency. For the users it keeps content dynamic and new.

Above: Redesigned homepage

Product Details Page

The Product Details Page (PDP) is arguably the single most important page of the entire store because that’s where the decision to purchase can often times take place. This is the digital equivalent of the real world ‘picking up the box and looking at it’–the back of the box experience, and this is how we approached this page when we redesigned. The background is game art specific and really sets the tone for the page. Now with an improved user experience we can take it further because of videos, bigger screenshots and things like playable demos. Features we introduced were platform selection, editions selection, demos, the ability to pre-order a product, comparison modules (to see the difference between two editions), large format media module, more robust product description, and related products.

Above: Redesigned product details page

Mini Cart

We introduced a mini-cart that allowed the user to continue shopping and browsing. It’s simple, gets out of the users way and encourages the user to continue shopping. We learned through testing that:

  • Once users added a product they were more likely to continue browsing
  • Product views increased by 155%, after an item was added to cart
  • More units were being added to cart with a 7% increase

Above: Redesigned mini cart

The Result

Our redesign resulted in both an increase in average order value (AOV) and Conversion rate. Looking specifically at US, we ended up with a 15% increase in average order value with a 9% increase in conversion rates across the entire site. Positive metrics across the board.