NatureWell Website Design
← Back to Work

Product Design

NatureWell Website Design

Product

NatureWell website

I designed a visual refresh of a skincare brand, NatureWell's e-commerce website, to align the brand with a new season. The work focused on elevating the online shopping experience through updated layout, typography, and product presentation while keeping the site easy to browse.

Details

E-commerce website
surface
Visual / UI designer
role
1 designer and 2 software engineers
team
Visual design · UI design · Layout · Art direction
scope
Season concept · Collection pages · Skin guide · About · Blog
deliverables

Context

Ready for a new season

NatureWell's existing site needed a visual update to match a new seasonal direction. The brand's product range had grown, and the online experience needed to feel as considered as the packaging on shelf.

Visual direction

Cleaner, more considered

I refreshed the site's layout, typography, and photography treatment to feel warmer and more editorial. Product grids, filters, and supporting pages share a consistent system so the experience feels cohesive from homepage to checkout.

Outcome

A refreshed storefront

The result is a full set of page designs ready for the new season: collection browsing, skin guide, about, and blog templates that present NatureWell as a modern, accessible beauty brand online.

Goals

I wanted the site to feel aligned with a new seasonal campaign while making product discovery easier. The goals were to simplify visual hierarchy on collection pages, give filters a clearer structure, and extend the refreshed look across supporting content pages without losing the brand's approachable tone.

Process + Key Insights

I started with a seasonal concept board, then applied the direction page by page. The landing page came first to establish the refreshed visual language, then I moved to the collection page where most product density lives. The skin guide followed as a way to help shoppers navigate by concern. Keeping spacing, type, and photography consistent across templates mattered more than redesigning every component from scratch.

Reflections + Takeaways

This project reinforced that a seasonal refresh is as much about editing as adding. Restraining the palette and giving products room to breathe made the site feel more premium without changing the underlying e-commerce structure. Strong page templates scale better than one-off screen designs when a catalog keeps growing.

Design

NatureWell landing page design

Landing page

The refresh started with a seasonal concept that set the tone for the entire site. I wanted NatureWell's e-commerce experience to feel warmer, more editorial, and closer to the brand's in-store presence.

Visual mood: Soft neutrals, warm photography, and generous whitespace give the site room to breathe. Product packaging colors stay visible without competing for attention.

Layout direction: Full-width hero moments alternate with structured grids so the site feels lifestyle-led at the top and functional when shoppers start browsing.

NatureWell collection page design

Collection page

The collection page is where most shopping happens, so I focused on making product discovery feel calm and scannable. Filters stay accessible without dominating the layout.

Sidebar filters: Price, skin concern, routine, and scent filters are grouped clearly so shoppers can narrow results without losing context of what they are browsing.

Product grid: Consistent card sizing, legible pricing, and color-coded product labels help the grid stay organized even with a wide range of packaging.

NatureWell skin guide page design

Skin guide

The skin guide helps shoppers choose products by concern and routine, and recommends specific products based on skin concerns by highlighting key ingredients and the effects each product is designed to deliver. I designed it as an educational layer that supports browsing without feeling like a separate experience.

Guided browsing: Concern-based categories and routine steps give structure to a large catalog, so visitors can move from learning to shopping in a few clicks.

Brand voice: Copy and imagery stay approachable and informative, matching NatureWell's accessible wellness positioning.

NatureWell about us page design

About & blog

Supporting pages extend the same visual language across the site. About and blog templates carry the seasonal refresh into brand storytelling and content.

About page: A clear hierarchy introduces the brand story with photography and short sections that feel editorial rather than corporate.

Blog: Article layouts use the same type scale and spacing as the rest of the site so content pages feel native to the storefront.