Web UI & Identity Design | Agency: AKOS Web

Skin Actives Scientific

A simple yet comprehensive online store and consumer information hub for a skin health company

We created an online buying experience that dramatically reduced bounce rates, increased page views and increased order totals.

The old Skin Actives eCommerce website was archaic, messy and crashed often. The CEO and marketing department of the company came to us to create an informed online shopping experience for their skin health conscious customers. By revisiting the customer journey, defining new paths, and re-establishing specific customer personas we were able to create a digital eCommerce experience that got customers where they wanted to go quickly, informed them and played to their ingredient curiosity. We even created a step-by-step skin regimen quiz that helped people find the right products for their skin.

Skin Actives Regimen Quiz

Sometimes you aren’t sure which types of products to use with your specific skin type, especially when you’re new to the brand. We created this quiz to point customers in the right direction to alleviate overwhelm and help them find products that they and their skin will love.

Iconography

We wanted to accentuate the shopping experience and the Skin Regimen Quiz by created custom iconography that fit within the clean and bright brand feel. The inspiration for the iconography lay in clean digital illustration and time, both elements at play when talking about your skin.

This icon set was helpful in creating easy to see product sections within the “shop by concern” method and it was key in bringing a tangible, visible, brand-centric element to the various choices inside of the Skin Regimen Quiz.

Branding & Packaging

Working with the core Skin Actives creative team, we helped shape the new logo, color scheme and product labels to work hand in hand with the new digital shopping experience. Product lines were consistency color coded from mega-menu to physical product label, making the visual experience cohesive at all touch points.

UI Highlights

Top Left: The mega menu brings the full extent of customer persona segments into focus. Whether you’re a DIYer, a Newbie, a Quick Shopper, or a Skin Curious person, there is a way for you to get just what you need in this big, beautiful menu.

Top Right: We wanted an online shopper to get where they wanted to go within 3 steps or less, so we built a place for the collections to stand out whether that be in the mega menu or in a visual page section.

Bottom Left: By organizing 180+ products into segments and assigning them a visual navigation tab structure, we were able to get customers where they wanted to go faster.

Bottom Right: With so much information for each product, we wanted the product cards themselves to stand out, yet maintain a visual simplicity to curb visual overwhelm. The key was to only show the most important information and then reveal additional detail upon hovering over the product card.

Awards

  • Best Ecommerce Website 2019, Spectrum Awards

  • Best Innovation Award, CSS Design Awards

  • Best UI Award, CSS Design Awards

  • Best UX Award, CSS Design Awards

View the live site

Thanks for checking out the Skin Actives project.

If you’d like to discuss an upcoming project, get in touch.

Previous
Previous

MindUP

Next
Next

Mary Michelle Inc.