Case Study: Disney Mobile Checkout

After a successful Marvel e-commerce launch our department head had learned about my UX design experience – I was tasked with taking a look into Disney’s mobile shopping cart and applying a human-centered design process to try to solve some significant issues – this hadn’t been done at all prior for Disney Consumer Products. We knew that there was an issue, but at the time, had little insight into why sales were so low on Disney’s newly launched mobile site. At the time, there was no user experience team at Disney Consumer Products, or their online store, though Jared M. Spool was doing work for Parks. Our department head knew there was time in this development cycle to allow some resources to try to fix the problem. After pitching a UX strategy brief and outlining a 3 month plan, I was able to hire a few contractors, and use our QA department- who we wanted to keep on staff in between development cycles. Each time we’d lose valuable and experienced testers, to other opportunities.

 

old sketch disney cart
old quick napkin sketch i saved 2014

Problems

  • Customers were getting stuck at checkout, and couldn’t use gift cards to apply to their balances on checkout on mobile.
  • The cart and checkout flow was disconnected- one often didn’t lead to another.
  • Images were obstructing buttons – a change that happened a year prior for guest users.
  • Poor error messaging that was vague didn’t direct a to linked re-try option
  • Bigger, brighter, better buttons – colored coded for purpose – blue for buy,  gray = cancel etc.

`

My Process for this project

  1. Discovery – identify the problems, propose early solutions, create a hypothesis.
    I sat with our hourly employed development testers who had a huge wealth of information, for a few days – until that point, they hadn’t spoken to leadership at all – there was a large divide in the organization -the two groups didn’t speak or approach each other.
  2. UX Strategy – I created a timeline and budget and pitched a research plan to the director of engineering to fix the mobile cart.
    Next, I gathered the QA team, and had them test a variety of devices and payment methods in the current checkout process using gift cards and test credit cards to fully complete the checkout process, which hadn’t been done previously. I worked with our devs to estimate time needed, and get their insights.
  3. Ideation / Wireframing – I knew we needed to hire an additional contract UX designer to create prototypes and work with me in order to get the work done by the next development cycle. We created the wireframes in , and worked with the devs who’d be coding the app throughout the process, to make sure time estimates were doable, no red flags, and get feedback.
  4. Testing – We used the QA team as consumers to test the prototypes.
  5. Design – We used the findings to create new payment flows and mockups.
  6. Testing, again – We tested this new set with our team and consumers sourced with help from marketing’s lead designer, family and friends who were known frequent shoppers, not hard to find in this group / building.
  7. Visual design – we worked with the designers in marketing to ensure our designs met the brand guidelines, then presented the work to stakeholders. I invited a few QA folks to share their insights first hand.
  8. Development – we handed off files to the developers who already had started the work, as we brought them in early on the project.
  9. Testing, again! We fixed minor issues at this point and presented our findings to leadership and engineering, for a go – no  – go decision and got the greenlight to launch.

 

OUTCOMES

After we launched the new mobile checkout, Disney saw a whopping 40% increase in mobile e-commerce site sales, accounting for millions of dollars in revenue each quarter. I was promoted and UX finally became something that was planned and budgeted for. to streamline the checkout process and add features and functionality. Our leadership found its way into the QA testing room more often. Because of this project, our 20+ QA testers didn’t need to hire 20 new QA engineers each quarter, and could keep those that wanted to be employed year round                                                                                   .

 

After we launched the new mobile checkout, Disney saw a 40% increase in mobile e-commerce site sales, accounting for millions of dollars in revenue each month. I was promoted to Director of UX, Engineering Web Commerce and continued to streamline the checkout process and add features and functionality. Because of this project the QA department didn’t need to 20 new QA engineers each quarter, and could keep them employed year round.

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top