View Live Site︎︎︎
Lead Digital Designer
Market Research, Interaction Design, User Interface Design, Brand development, Design system, A/B Testing, Visual Quality Assurance, Low-fi and High fidelity Prototyping
Amika is a haircare company that focuses on creating effective products for every hair type. Their brand ethos is to bend the rules while being a friend to your hair and planet. As the sole digital designer, my role was to create a design system from scratch. Collaborate with eCommerce managers, brand team, and third-party developers to bring this vision to life.
The goal was to reimagine the Amika experience on a digital platform. Layouts and typography are extensions of iconic product packaging with vibrant colors and graphic shapes. I created micro-interactions that capture the essence of the company. The strategy was to create an end-to-end shopping experience while thinking about potential customers and the back-end CMS, where projects could be scaled with fewer complications.
Before landing on the current homepage structure, I tested different layouts through heat maps and other user metrics.
The page consists of several content blocks. It has a modular framework so that eCommerce managers can restructure the modules based on higher user engagement.
Product cards have a default and hover state. The user can choose product size and sign-up for out of stock products.
Product Display Page with subscription integration.
A modular collections landing page with playful moments like scroll-triggered animations.
The brief was to make a landing page for each collection that was deeply informative. A place where storytelling, campaign imagery, video, clinical testing stats, reviews, ingredient details, and so much more come together.
View Page Live ︎︎︎
Mobile designs for collections landing page.
I designed a templatized system for all eleven collections and seasonal content like a holiday landing page. A modular approach allows each page to be created based on available content.
View Page Live ︎︎︎
Cart Design incorporates a progress bar, offers, account login, recommended products, subscription integrations, samples section and disclaimer text.
The cart has a modular approach. It adds subscription integration to the cart design as a second layer.
The challenge was to fit extensive information within the existing design system. I also needed to consider long product names, descriptions, sizes, and sale price indications.
It is a bold moment where the Amika wordmark comes front and center. The cursor interaction triggers the logo to go back to the navigation bar and vice versa.
A two step Search Optimization
It starts with a micro-interaction. Having a dropdown that is prominent but doesn’t take up the entire page was crucial. Some user feedback included feeling trapped when the search takes up the whole screen.
After the user starts typing in the search field, results dynamically appear. Only if the user presses the enter key, it takes them to a separate results landing page.
404 Error Page
The error page is usually an unexpected moment. Through playful interaction, I added an element of delight to bring back brand expression. The banner module and a back-to-homepage CTA allow users to resume their journey.