Millie n Me Website
Re-design

Redesigning a small ecommerce business website to optimise user satisfaction

The Millie n Me website redesign focused on improving user satisfaction for an online fashion boutique. User research emphasised clearer product images, an optimized checkout, better filters, and accessible reviews. Through personas, usability tests, and prototypes, we achieved higher satisfaction and faster purchase times, with a strong emphasis on accessibility and seamless site navigation.

General Assembly

3 weeks

2024

Setting the stage

Millie n Me is a beloved Melbourne boutique founded in 2017 by a mother-daughter duo on a mission to make fashion stylish and inclusive for all women. Seven years and three boutiques later, their passion remains strong—but their online shopping experience needed a UX refresh.

As the lead UX designer, I tackled this challenge by conducting in-depth user research, analysing competitors through heuristic evaluations and usability testing, and synthesising insights into a clear problem statement. From ideation to prototyping, I crafted digital solutions that enhanced usability, ensuring Millie n Me’s online presence matched the warmth and accessibility of their in-store experience.

Empathise: What are our users saying and not saying?

Usability Testing:

The first step was to gage how our users interacted with the website and how they felt about it through usability testing.

Qualitative data is invaluable to understanding the user. Solid quantitative data can provides a more concrete way to analyse an experience. Together? They make the dream team! Users were asked to find and purchase two items for a friend’s party.

Here’s what our users had to say about their experience purchasing an item on Millie n Me.

“I need filters to streamline my search”

“I want to see what other customers think of the product”

“I want the images to correspond with the options.”

Here’s what the quantitative data revealed about our users.

On average users took over 7 minutes and 20.25 clicks to find and purchase 2 items

On average our users gave a 2.75 satisfaction rating

From this research recommendations were summarised to give us an idea of our solution:

  • Improve Product Image Display - reduce the number of repetitive images for each product to enhance user experience. aim for a more concise and informative presentation, such as limiting to 3-5 key images that showcase different angles and details.

  • Optimise Checkout Process - modify the checkout process to prevent the page from automatically redirecting to the cart upon adding an item. Allow users the option to continue shopping or proceed to the cart, enhancing user autonomy and shopping experience.

  • Implement Model Information - provide clear and easily accessible information about the model's height for each product to assist customers in making better-informed decisions regarding size and fit.

  • Enhance Filter Options - add more filter options such as colour and length for dresses, and ensure they are easily accessible to users to streamline the shopping experience.

  • Review Section Accessibility - ensure the review section is easily accessible, possibly by allowing users to click on the review summary and automatically scroll to the detailed reviews section to enhance trust and provide additional information to potential buyers.

  • Accessibility Check - perform an accessibility check to ensure the website complies with WCAG standards, focusing on contrast issues and navigation clarity.

Sizing up the Competition:

Competitive research was instrumental in grasping the layout of the land. Always bearing in mind; what can we understand from the way these companies direct their users? We did this through an element analysis.

Competitor research highlighted that the primary navigation and product page layout differed the most between companies depending on product favourites and demographic.

Define: nailing the dilemma

User Spotlight: Who Are We Designing For?

“I work from home so a separate Chrome window with a full cart is never far...”

Nina Brooks is a 29 year old living in Melbourne CBD, Australia. She works remotely from home but goes into the office once a month for her team meetings. Nina’s job involves a lot of emailing and calling distributors so she is at her desktop all day. When there is a lull at work Nina finds herself browsing her favourite clothing websites

  • Nina values the convenience of online shopping, especially since she’s a remote worker. She expects a smooth shopping experience.

  • While she doesn’t shop frequently she does browse often, Nina likes to stay up-to-date with the latest trends and products.

  • Nina can feel overwhelmed by too many options and needs filters to narrow down her choices.

  • Nina aims to streamline her shopping process, finding what she needs without spending excessive time browsing.

  • Customer reviews and ratings significantly influence her purchase decisions.

Whats the key problem?

Users need a way to streamline their search for products, so they do not waste time scrolling through other products.

How do we go about solving this?

How might we provide features that personalise the shopping experience to make it more efficient?

Site Map: plotting the adventure

Now we had our mission, we needed to see what we were working with. Site navigation was assessed through card sorting and site mapping. Card sorting allowed us to gain insight into the most logical form of organisation for our users. Our users had mixed agreement rates within the categories save for 5 main categories; tops, bottoms, accessories, dresses and children. We simplified the global navigation yet left no room for confusion.

Ideate: imagining possibilities

User flow: pathways to success

We created a simple user flow to demonstrate how a user browses the site, selects an item, and completes the payment. From the first click to the final action, the user’s story unfolds step by step.

Annotation station: the sketches behind the app

Possible design solutions were mapped out with sketches and reiterated to refine the end product.

The main solutions emphasised simplicity and customisation, guided by the design principles of visibility and clear mapping.

Test: rough draft, real insights

Lo-fi wireframes:

Usability test insights:

We conducted usability tests on the lo-fi prototype to evaluate improvements in the user experience.

Heres what we found:

On average our users gave a 4.3 satisfaction rating

On average users took just over 2 minutes and 10 clicks to find and purchase a dress.

The results show a significant improvement in both satisfaction rating and number of clicks to find, select and purchase a dress using the low fidelity prototype.

Streamlined search processes such as filters and bread-crumbing increased user satisfaction on average.

Prototype: blueprint of the vision

Clean navigation and product listing using Don Norman's feedback and mapping principles for clear user interaction and location awareness.

  • Personalised filters with bold feedback, checkboxes, and sliders streamline the experience, while collapsible menus keep product details accessible yet organised.

  • Pop-up cart feedback enhances user control, white space emphasises product focus, and a "You might like" section boosts personalisation.

  • Checkout process includes a separate page, a visible timeline for clarity, a persistent order summary for transparency, and a clear confirmation message.

Takeaways

In design, accessibility is paramount, shaping experiences that reach all users. Through a continuous cycle, user research and site evaluation fuel one another, building insights that refine the product. Clear, intuitive site architecture makes all the difference, often tipping the scales for business success.

Next steps? Testing the mid-fidelity prototype with diverse users in varied contexts, with room to expand on quantitative methods like eye-tracking to deepen insights.

Interested in how our redesign improved the online shopping experience?

I'd love to connect if you want to chat about the project! tayabaginai@gmail.com