Design System & Brand Implementation for an Ecommerce Experience
Translated brand elements into repeatable UI patterns, creating a scalable and consistent experience across pages and components.
Applied the MET-Rx brand across the website by translating visual identity into reusable UI patterns, layouts, and components. The resulting design system established a consistent user experience and became the foundation for the subsequent Pure Protein website redesign, demonstrating how the system successfully scaled across brands.
Role & Focus Areas:
-
UI Design (Figma & Photoshop)
-
Brand implementation across web
-
Layout and component consistency
-
UX exploration for Athlete page
Goal
Create a scalable design system that translated the new MET-Rx brand into a consistent ecommerce experience.
Layout & Structure Exploration
Focused on translating brand elements into repeatable UI patterns, ensuring consistency across layouts, components, and page structures.
Before
After New Direction
Final Site
Athlete Page UX Exploration
Focused on translating brand elements into repeatable UI patterns, ensuring consistency across layouts, components, and page structures.
Takeaway
This project demonstrates my ability to translate brand direction into a consistent UI system while exploring targeted UX solutions for specific user needs.