Quick Summary
My Role: UX/UI Designer
The Problem: The original site was built in the 90s and it still looked like it.
The Solution: Redesign the entirety of the site for desktop, tablet and mobile.
The Results: Stock prices rose 300%, monthly subscriptions rose 40%, and revenue increased every quarter by 10%.
High Level Summary
The original Nature’s Sunshine homepage was built in the 90s and it looked like it. Even without using new technologies it grew to an 80 million dollar company in need of a massive overhaul. Constantly broken photos, confusing pricing structures, links that never went anywhere and a product catalog with 600+ products was overwhelming. Working hand in hand with the graphic design group (who was handling the new brand identity/product packaging and the dev team (obviously in charge of coding it all) the images below show the drastic improvement between old and new. My role was to handle site architecture, navigation and the product experiences for my users.
Product Page Redesign
As stated before the site was built in the 90s, it looked the part and was incredibly clunky. The system was so old that there was little to no support for mobile. Elements often loaded offscreen and prevented users from even checking out. To make things worse product pages had mediocre product information, basic imagery and no ability to subscribe.
Most of the users at Nature’s Sunshine had to come back monthly and purchase the product they liked but data showed that it was inconsistent and after the third time re-ordering users did not come back for a fourth. Companies like GNC, Vitamin Shoppe and Gaia offered easy to use subscription plans. Seeing what needed to be done the executive team approved my idea to implement a subsription model.
I took models from e-commerce giants such as Amazon, Walmart and Target used to inform design. After completing a feasiblity workshop with the dev team and with new brand brand assets from the graphic design team I took my designs to the executive team for approval. A couple key components of the new design that I designed:
Subscription Model
Most of our users purchased a monthly supply of our products three times before abandoning the process. We didn’t have the ability to save payment information or set a delivery schedule so my first design goal was to get that going. I gave users the option to select between a one time purchase and starting a subscription. This wording gave users immediate clarity into our pricing structure with benefits of each.
Engaging product imagery
The graphic design group worked with the science team to provide a comprehensive Nutrition Label for all 600 products. User research showed that people wanted an easy way to see the nutritional information and those teams really came through. People loved the new styling and the easy to read information helped new users to understand the products.
For our more elderly users (a significant demographic of ours) I added a button that said “View supplement facts” that in addition to a large format nutrition label could give them helpful information on whichever product they were looking at.
I took all of the new brand elements and incorporated them throughout the product page, highlighting items like Key Ingredients and Quality Testing. Nature’s Sunshine products had a reputation of being higher quality than most and the product pages finally reflected the quality of the supplements.
Mobile Considerations
Years of disappointment had users apprehensive of anything mobile from Nature’s Sunshine so there was nowhere to go but up. Mobile was actually the first thing I designed for this project because there is always room to add more on desktop.
Imagery used a calculated size to make sure the side images would be scrollable even on small devices while maintaining the largest possible photo impression.
Reviews had never been used by Nature’s Sunshine with the mentality that word of mouth would be enough to drive sales. This didn’t make sense at all so I advocated that we begin collecting them to display on every page.
Some products had multiple variations so I designed buttons to have a minimum width of 44px to avoid selecting the incorrect size. Directly featured below that was the option to purchase once or subscribe. If the user made a selection it would automatically take them to the next input ending with the Add to Cart Button.
More Featured Projects
Hydrojug
Simplifying product pages with science
Health Topics
Increased engagement and clarity
