Beauty Ecommerce Website

Project Background

This project is a self-initiated Case Study focused on designing a concept E-commerce website for a modern cosmetics brand. The primary focus was to step beyond basic layouts and challenge myself to build a structured, scalable digital shopping experience through a systematic design approach.

Project Goals

  • User Experience Goal: To design an intuitive, modern, and clutter-free online store that simplifies the buying process for cosmetics consumers.

  • UI & Design System Goal: To build a solid UI foundation from scratch by practicing core design principles, specifically focusing on typography, color architecture, and components.

Key Learnings & UI Framework

Through this project, I gained hands-on experience in building a cohesive UI system, focusing on:

  • Typography Hierarchy: Defining proper font scales, weights, and spacing to enhance readability and visual structure.

  • Color Architecture: Implementing a professional color strategy by defining Primary and Secondary colors for branding, Neutral colors for backgrounds and text, and functional semantic colors like Success and Warning for user feedback.

  • Component-Driven Design: Learning how to design reusable UI elements, such as customized Buttons, text fields, and product cards, to ensure design consistency and a unified workflow.

Design System
Example