Matthew Bomberger

UX/UI Design

Ecommerce Website Redesign

The Problem

E-commerce retailer, LuckyVitamin, had two websites; one for desktop and one for mobile (mDot). Both were dated and needed a redesign. Even more pressing, however, was the need for one adaptive site that shared the same code base. As site traffic migrated to mobile LuckyVitamin was in danger of losing its hard-earned SEO value as Google shifted its search results based on mobile content.

Old mDot Site

The mobile site was busy and overwhelming. Content had been stripped away, hurting the retailer’s SEO rankings.

Old Desktop Site

The desktop site was cluttered and unresponsive. This made for poor UX on larger monitors and tablet devices.

The Solution

Working collaboratively with UX/UI designers, front and back-end developers, QA, SEO specialists and content teams, I planned and executed a fully adaptive website redesign, with an emphasis on mobile-first. The final result preserved LuckyVitamin's high SEO ranking and drove 40% increased revenue (combined with omnichannel marketing and personalization efforts).



The Process

We did an analysis of each page to determine what was working vs. pain points and areas of confusion. Where did users click? Where is there drop-off and abandonment? After that, we created low fidelity MVP wireframes to quickly iterate solutions. Below are example wireframes we developed.

MyAccount | Low Fidelity Wireframes

Expanded Order Details & Tracking

From UX to UI

Once we were confident in our wireframes, we worked in Sketch and built component libraries to design high fidelity prototypes. We conducted user testing to further optimize and validate our designs.

Wellness Circle Rewards

UX/UI Case Study

The Problem


LuckyVitamin's old rewards program was a confusing and frustrating experience. The point system was hard to understand and even harder to redeem. Once you reached a certain point-level, you were emailed a promo code, which couldn't be stacked with other promos and quickly expired.

The Solution

I led an effort to overhaul the rewards program, from the branding down to the way you redeem and apply your rewards. Here are some key enhancements.

Wellness Circle Rewards

New Branding, Tiers, & Messaging

"Spreading the wellness has never been more rewarding."


"Obsessed with your health? You're in luck. As a Wellness Insider, you'll enjoy free 2-day shipping and earn 1 Wellness Point for every $1 you spend. You can cash in your Wellness Points to redeem exclusive Wellness Rewards like first access to new products, free samples, or even a trip to the spa. And during exclusive Happy Wellness Days, you'll have a chance to earn up to 4X Wellness Pointsan added bonus that could help boost your Wellness Status to unlock even more rewards."



Rewards Landing (signed out user)


This page introduces the loyalty program, having the primary message to sign up or sign in. This is followed by featured rewards, tier benefits, and other ways to earn points.

Dashboard (signed in user)


An existing guest is presented a dashboard with relevant bank points, status, and marketing messaging around points.


Your Benefits

Fly-out


All Ways to Earn Points

Fly-out


Your Activity


This page gives guests the ability to see their dashboard of bank points against their current status within the loyalty program. All recent activity keeps track of earned points.