research & interaction design - @unitid (2015)

A comfortable online shopping experience for Miss Etam

Responsive redesign for Miss Etam webshop based on their existing e-commerce platform

About this project

Miss Etam is a Dutch fashion brand targeting the typical Dutch housewife, aged 40 and over. Following a takeover, and in the middle of a rebranding process, their aim was to increase revenue from online sales.

My challenge

"Optimise usability and trust for this very conservative user group...While staying as close to the existing back-end as possible"

A target group unfamiliar with online shopping, an exisitng e-commerce platform and limited budget meant we had to dig deep on what was worth changing. Miss Etams existing A/B testing experience helped us out tremendously.

Research

At the start of this project, I facilitated a couple of sessions with all the stakeholders involved. The goal was to get as much information on the project as possible before actually starting the design. It was also a great way to find out stakeholder expectations, and get them all aligned on the project goal.

We filled a get-keep-grow matrix to decide on the segment of users to aim for. We did a user journey session, to get to know the user and identify opportunities. And we did a card sorting session to get a grip on the information structure and content.

Design system - Setting up the framework

At the start, we knew we were building on an existing framework, so the first step was to make an inventory of all the existing components and templates. Together with a visual designer I set up the grid and the major breakpoints. Then I set up an information structure and designed the main navigation. The production part of this project used scrum, which allowed us to design incrementally, per component and per template.

Design highlights

collapsable Filters

Filters are a good way of getting to your desired item fast, but there are a lot of them. Collapsing all filter categories makes it easier to find the filter you’r looking for.

Size indication

While making a user journey, we found out item sizes are a very important part of the selection proces. In addition to other mechanism, we introduced a size overview on hover, to quickly asses if it’s useful to even consider this item.

Next steps

Quick & dirty prototyping in InVision allowed us to test early versions of this concept live, with the right audience, in actual Miss Etam stores. this helped us make design decisions quicker, and steer the concept in the right direction.

The new design was implemented during 12 week scrum process. Miss Etam employees got access to a custom CMS system to ensure maintainability. The new design is continuously A/B tested to gain further insight into customer behaviour and to optimise conversion.