Little Feminist

Optimizing their E‑commerce experience

RESPONSIVE WEB

Little Feminist is a subscription service providing parents with books for raising conscious kids, helping to share stories about diversity and inclusion.

Little Feminist mockup on mac desktop and iphone

Overview

Challenge

In preparation for the upcoming holiday season, the founder wanted a redesign of the landing page, store page, and checkout form to increase conversion and generate more sales.

PROBLEM STATEMENT

Amongst a crowded market of products for kids, how might we make Little Feminist’s products more appealing? How might we reach more customers?

MY ROLE

Product Designer

  • User Research
  • UI/UX Design
  • Visual Design for Store Page

TIMEFRAME

2 weeks

Outcomes

Problem: Unorganized Store

Little Feminist’s store page lacked clear messaging and a polished look and feel. To reach more users, we also needed to optimize it for a mobile experience.

Store Page Before Redesign

Solution: Polished Gift Shop

Due to our limited timeline and the constraint to be mindful of brand and style guidelines, we focused on improvements that would have a significant impact but were also relatively easy to implement. On the store page, these improvements included clarifying copy, adding filters, and implementing a grid.

Store Page After Redesign

Solution: Responsive Layout for Mobile

Responsive Layout Mockups of Landing Page, Store Page, and Checkout

Results: Thrilled Client

We delivered high-fidelity mockups for responsive web to the client, which she was thrilled with and immediately implemented.

“ The team of designers was creative, nimble and fast working. They created a more beautiful, functional, and lucrative site design, done in just 2 weeks.”

– Brittany Murlas, Little Feminist Founder

RESEARCH

Learning from the competition

To better understand how subscription services and e-commerce sites market and organize their products, we analyzed 20+ competitors and comparators. As our client wanted to expand her product range to include books for older kids as well as non-book items, we were particularly interested in how products were categorized.

A few insights from our research included:

Design

Lo-Fi Sketches

Based on the insights gained from research, we each sketched ideas for the landing page and store page. We then discussed each design and voted on the best four, two versions of each page, to be presented to the client for review.

Lo-Fi design sprint and dot-voting
Low Fi Design Sprint Dot VotingDot Voting for Mobile Sketches

Hi-Fi Mockups

As this project required a quick turnaround, we went directly into creating hi-fi mockups after receiving feedback on our lo-fi sketches. Below are a few versions of the store page:

Version 1

Subscribe CTA + Age Group Filters + Grid

As most e-commerce sites incorporate filters to allow shoppers to quickly find the item/s they're looking to buy, we considered the implementation of filters carefully.

We noticed that in the children's book subscription market, 'Age group' filters are a common pattern. For alignment with our client's current product line, we had recommended 4 age groups: Ages 0-3, Ages 3-7, Ages 7-9, and 9+.

Store Page Hi-Fi Mockup version 1

Version 2

Gift Shop + Category Filters + Product Card

Although our client was expanding her product line, she felt that there was not enough product currently for the age group filters to be useful.

For this iteration, we decided on high-level product category filters for gift cards, apparel, one-time gift boxes, and subscription.

Store Page Hi-Fi Mockup version 2

Version 3 (Final)

All Filter + View Details CTA on-hover

In our final iteration, we changed from a rectangular 'Clear Filter' button to a pill-shaped 'All' filter for visual consistency.

Store Page Hi-Fi Mockup version 3

reflection

Having worked in education, I was excited to contribute to a business that is promoting learning, acceptance, and empathy through books for kids.

Due to the project’s short timeline, we had prioritized improving messaging and content organization. Although our client was thrilled with the designs we delivered, I felt that we could have done a better job of ensuring that our designs met accessibility standards.

During the hi-fi phase of our project, we had split the hi-fi mockups among different designers. Even though we were using established brand colors from Little Feminist’s style guide, I noticed that some of the foreground and background color combinations, in our resulting mockups, may not have had enough contrast.

Given more time, I would have done a more thorough check and advocated for the use of other colors that would be more accessible.