A responsive website redesign for Oluna—building a new content strategy and information architecture to boost brand clarity and trust.
![](https://static.wixstatic.com/media/77e453_bf3fd303127843f48bf46fdc7b2e3138~mv2.png/v1/fill/w_980,h_349,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/77e453_bf3fd303127843f48bf46fdc7b2e3138~mv2.png)
Team: Carolyn McQuillan, Kathryn Elias, and Bora Yuh; founders Emmy Hancock, Ali Aston
Timeline: 3 week sprint
My role: Researcher, Content Writer, Lead Visual Designer
Tools: Figma, Zoom, Miro, Optimal Sort, Google Suite, Trello, Slack, Whiteboard/Markers
What I did: Competitive analysis, interviews, synthesis, card sorting, prototyping, copywriting, UI design, usability testing
The brand
Oluna is a social impact fashion brand founded during the pandemic that sells soft, flowy pants for all body types. With a passion for menstrual equity, founder Emmy Hancock built the brand based on a one-for-one model, donating a year's worth of period supplies to a woman in need for every pair of pants sold. Additional profits go towards research and education. The company is proudly 100% women run end-to-end, and made in the U.S.A.
The opportunity
The founders asked for a new website design to strengthen the brand narrative, including:
A flow to help users see and shop the products, while understanding the mission
A site structure that would allow for adding other merchandise, such as candles and dresses
Highlighting the three pillars of their brand
Compatibility with the Shopify platform
Mobile and desktop design, since 63% of visitors to Oluna access on mobile
From usability testing and research, we further defined strengthening the brand narrative as:
Revising the content and copywriting to reduce confusion about the purpose of the product
Clarifying the social cause, and quantifying Oluna's impact for better understanding and trust
Current site usability
To dive into understanding issues with the current website experience, we tested 5 potential customers, giving them each a couple of tasks based on the most important functions of the site:
Testing the mission Look through the site and see what information you can find about their cause.
Testing conversion You are looking to buy a pair of pants and a ball cap. Please locate these items and add them to your cart.
Findings:
![](https://static.wixstatic.com/media/77e453_68afe78c96db41beaf8b433216f0416f~mv2.png/v1/fill/w_980,h_479,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/77e453_68afe78c96db41beaf8b433216f0416f~mv2.png)
![](https://static.wixstatic.com/media/77e453_9de78e241aa0491b97f7570de99b19c2~mv2.gif/v1/fill/w_600,h_289,al_c,pstr/77e453_9de78e241aa0491b97f7570de99b19c2~mv2.gif)
While most of the information about Oluna’s mission was easily discovered and understood, more than half of our testers were confused about whether the pants themselves were a period product. The founders confirmed this to be a frequent misconception.
We also found that the spinning pants GIFs used in the product grid detracted from the experience. Testers said they were distracting, moved too fast to be helpful, and that they prefer still images.
Lastly, we discovered that users had difficulty navigating the site. It was unclear to them which items would be found in each section, especially the way the mission tab was broken into several sub-categories. User also expressed confusion about the collections page.
Competitive and comparative analysis
We reviewed 9 lifestyle and leisure brands to see what information they had on their mobile and desktop sites, how they were organized, and what design trends we could find. Companies included TOMS, Everlane, Lululemon, Bombas, and Warby Parker. Some key findings were that:
100% had full information about their mission or impact on one dedicated page
100% of the websites were responsive for mobile and desktop, reinforcing the need to solve for both during our sprint
80:20 was the average split of information on the homepage about the products for sale versus the social impact
![](https://static.wixstatic.com/media/77e453_0cb643feb1d445bd8cc608b154da2a63~mv2.png/v1/fill/w_980,h_517,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/77e453_0cb643feb1d445bd8cc608b154da2a63~mv2.png)
Currently Oluna's site skewed the opposite, with about 80% of the homepage content about the social cause, and 20% about their products.
Interviews and synthesis
Our next stage was to uncover more holistic information about the users' habits. We interviewed 5 women in their late 20s to early 30s who had purchased from social impact brands in the past. We asked questions to understand what their experience was like purchasing from these companies, and why they chose to shop there. We sought to discover:
Why they were interested in the companies and their products in the first place.
What ultimately guided their decision to buy? Was it more because of the product, or because of the company mission?
We also wanted to know how the pandemic affected their fashion choices, since that’s one of Oluna’s major marketing points.
We made an affinity map to gather all the responses in one place and see what they had in common.
![](https://static.wixstatic.com/media/77e453_3c6bd4b512024e2683f9b8cb8c19e6f9~mv2.png/v1/fill/w_980,h_612,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/77e453_3c6bd4b512024e2683f9b8cb8c19e6f9~mv2.png)
![](https://static.wixstatic.com/media/77e453_737ed47bd03644bebf0e50a5e16eb670~mv2.png/v1/fill/w_980,h_919,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/77e453_737ed47bd03644bebf0e50a5e16eb670~mv2.png)
We found several trends:
Users choose to buy a product from a social impact brand based on how much they need and like the product. They consider the positive social impact of their purchase more like a bonus rather than a driving factor in their decision making.
They also like "voting with their dollars" by supporting brands whose values match their own.
Users also reported researching the product and the mission so that they could trust the product they’re buying and the company they’re buying from.
As for their pandemic fashion choices, comfort is a top priority—users want loose-fitting, stretchy clothes for hanging out or working from home.
Our persona
Based on our findings, we created our persona, Tanya—a 29 year old woman who purchases from social impact brands. She wants to buy quality products, and likes when her purchases support a mission that she values. She’s frustrated by companies that use social values as a marketing ploy, or when she can’t easily find information about a company’s impact. Tanya needs comfortable clothes for working from home, but she also wants them to be stylish enough to wear in public.
![](https://static.wixstatic.com/media/77e453_1b62d102945c4135aea766b314d81203~mv2.png/v1/fill/w_980,h_651,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/77e453_1b62d102945c4135aea766b314d81203~mv2.png)
This persona enabled us to keep the users’ needs and frustrations as the main focus throughout the rest of the design process. To summarize her needs, we created a problem statement for her, as well as Oluna to ensure business goal connectivity:
Tanya's problem statement
Tanya wants to purchase attractive and versatile loungewear from a social impact brand that she trusts, so that she can work from home comfortably and feel like she’s directly impacting the world for the better.
Oluna's problem statement
Oluna wants to improve customers' understanding of their products, brand, and social impact mission, so that they increase conversions and make a greater social impact.
User flow
The scope of our sprint would be to create pages along an e-commerce flow, as well as a page for the mission and impact linked from multiple entry points. The path below shows how Tanya could navigate the site as she browses the products, learns about the mission, and ultimately completes a purchase:
![](https://static.wixstatic.com/media/77e453_d69401af102d41329265daf6ea4c1246~mv2.png/v1/fill/w_980,h_335,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/77e453_d69401af102d41329265daf6ea4c1246~mv2.png)
Card sorting
![](https://static.wixstatic.com/media/77e453_c2a8a8c338754676b7628bb8b3e246bf~mv2.png/v1/fill/w_484,h_1024,al_c,q_90,enc_avif,quality_auto/77e453_c2a8a8c338754676b7628bb8b3e246bf~mv2.png)
To determine naming conventions on the site, we conducted an unmoderated, open card sort exercise, providing 5 users with pictures of the products and other information on the site for them to sort into categories and label in ways that make sense to them.
Findings:
All clothing (dresses, pants, hoodies) were bucketed under “Apparel”
Stickers, candles, hats were placed under “Merch” or “Accessories”
“Impact,” “mission,” “cause,” “social issue” were all terms users generated, which helped inform language we used in the information architecture
Site map
Based on the card sort, research, and competitive intelligence, we created this site map outlining the sections of the site. In green are the pages in scope for us to create:
![](https://static.wixstatic.com/media/77e453_e1f3ce59d65f4ae8a8997b284b818857~mv2.png/v1/fill/w_980,h_1044,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/77e453_e1f3ce59d65f4ae8a8997b284b818857~mv2.png)
Low to mid-fidelity prototypes
![](https://static.wixstatic.com/media/77e453_f6030bb541e042c79fb84380c29886ef~mv2.png/v1/fill/w_808,h_1270,al_c,q_90,enc_avif,quality_auto/77e453_f6030bb541e042c79fb84380c29886ef~mv2.png)
To get our general layout and hierarchy established, we put our ideas together into a visual system.
Visual design direction
Bold yet soft and feminine look and feel—mimicking the pants
Large images—crisp and young, but studio quality and bright
Clean, aligned blocking—but also breaking into asymmetry and overlaps to encourage exploration
This helped us account for all content before investing time in exact phrasing, imagery, fonts, or colors, and get user feedback before proceeding.
![](https://static.wixstatic.com/media/77e453_8809dcf3bf1b460e838f046efd3d1e99~mv2.png/v1/fill/w_980,h_378,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/77e453_8809dcf3bf1b460e838f046efd3d1e99~mv2.png)
Mid-fidelity usability testing
We conducted usability tests with 6 more users to find points for improvement. For consistency, we asked the same set of questions as the usability test of the current Oluna site.
First, users still felt that on the main page, the product was not featured as much as the mission, leading to at times confusion between the features of the product and the brand mission. Because we knew that users prioritized product desirability and then assess the social impact, as well as the 80:20 ratio uncovered in our competitive analysis, we adjusted the content on the website accordingly.
![](https://static.wixstatic.com/media/77e453_77e68672314e414ea513959e8a0e81aa~mv2.png/v1/fill/w_980,h_524,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/77e453_77e68672314e414ea513959e8a0e81aa~mv2.png)
Next, we found that some users still needed help knowing where to find information on the brand’s mission. We decided to rename what we had originally called the "Impact" page to “Our mission,” resulting in zero participants confused about where to find this information.
![](https://static.wixstatic.com/media/77e453_6a7b5932e474491a968bbafd9a2874bf~mv2.png/v1/fill/w_980,h_488,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/77e453_6a7b5932e474491a968bbafd9a2874bf~mv2.png)
We also added interactive elements that highlighted sub navigation links upon hover.
High fidelity prototypes
Homepage
Bold header reinforcing feminine brand and what the product is (not period pants!)
(80%) Call to actions to shop products from the header, best sellers, or seasonal collections
(20%) Graphic highlighting the three pillars of Oluna's mission
Quote from the CEO and displayed logos of press endorsements to increase trust and legitimacy
Mission > Impact page
Diverse images pertaining to the cause and the people affected by it instead of product shots
Definition of period poverty and statistics of its prevalence in the United States
Infographic visually explaining which product sales go to which aspects of the cause
Quantification of Oluna's donations and partner organizations for full transparency
Testimonial pulled from Oluna's Instagram for user confidence of impact
Other ways to get involved with the cause, reinforcing brand is not mercenary
Link to "See Our Story" to learn more about the founders and their manufacturing process
Shopping for pants
Showcase of different collections
On desktop—video of a model wearing the pants to show how the fabric moves, where the slits are, and how comfortable and effortless they are to move in
Robust but intuitive filtering
Multiple ways to get to and explore different shopping sections and product types
Reminder of the brand's social impact
Viewing pants and reviewing cart
Multiple bold, bright, studio product shots
Addition of features, length, and "true to size" information
Recommendations based on what the user has looked at previously and other Oluna product ideas to "complete the look"
Indication and praise for how many American woman are directly being helped with this purchase on product page as well as in the cart to increase motivation
Results
Compared to the original website, our high fidelity prototype created no confusion between the product and the mission—moving the score from 5.3/10 to 0/10 on confusion.
The final prototype also scored significantly higher on customer trust, at 9 out of 10. Additionally it was praised by all users for clear display of how individual purchases directly impacts the mission.
All of this underscored that we met the project objective on communicating a clear and strong brand narrative, as well as increasing motivation for customers to choose Oluna.
Next steps
With more time, there are a number of future recommendations to take this design further and measure success:
Research and create a secondary persona for mothers/mother figures who visit Oluna. Some questions we have are whether they are drawn to the youthful design of Oluna. Are they buying the pants for themselves as well as their daughters? What specific qualities make them think that the pants are suitable for their child?
Add a sense of community on the website rallying Oluna's customers around its mission by building out the account page.
Take additional product shots using models with larger body sizes.
Measure success by monitoring Oluna's traffic and sales analytics for improved cart abandonment rate and AOV (average order value) suspected by better integrating their pants and other merchandise during the shopping experience.
Hand off the Figma files to a developer who is familiar with theme customization (custom coding) in the Shopify platform.
Comments