Electrolux Ecommerce

Final design of Electrolux checkout page

OVERVIEW

I was part of a two-person UX team at DDB New York to redesign ecommerce checkout pages for Electrolux.com. The client was looking to simplify the checkout process so that users can purchase parts, accessories, consumables and small appliances in one location. This involved combining products from a Yahoo store ahead of its shutdown with products already on Electrolux.com. These two groups of products ship from separate warehouses and therefore one checkout transaction can involve two shipments. The checkout process needed to be redesigned to accommodate such scenarios.

Desktop wireframe for entering a new shipping address

MY ROLE

After my UX partner performed a comparative analysis of in- and out-of-category ecommerce websites, I created desktop and mobile wireframes within a shared Axure Team Project for all checkout pages while she designed pages leading up to checkout. After presenting axure.com-hosted wireframes to the client and developers and receiving swift approval, we briefed our visual designer who created page comps – which I also presented to the client and received approval for. Lastly, I annotated the wireframes for the final hand-off to developers.

Annotated wireframe of user selecting multiple shipping methods

CHALLENGES

The main challenge of this project was the complexity of the platform and internal processes and the involvement of several groups of stakeholders, to which we had limited access as an outside agency. Documenting and obtaining consensus on requirements was therefore our key to success. In collaboration with our contracted developers, we maintained a Google document that outlined over 30 use case scenarios and their related business, functional and UX requirements. This document not only provided a guiding light for the UX team and developers in determining features and interactions, but also chance to gain agreement and common understanding of our shared goals with the client.

OUTCOME

With all of our upfront research and requirements gathering, as well as our use of collaboration tools, designing a simplified ecommerce checkout flow was relatively efficient and straightforward. I was able to apply best practice approaches without hesitation from clients, which resulted in a streamlined and user-friendly set of pages.

Flow diagram depicting the user’s path through the checkout process

View the full set of clickable user flow and wireframes:
User Flow part 1 and part 2 (click page thumbnails to view corresponding wireframe)
Wireframes Home