UI/UX DESIGNWEB DESIGN2026

Auramé

E-Commerce Experience for Beauty, Fashion & Local Artisans (UMKM)

Auramé is a beauty and fashion web platform designed to combine editorial visual elegance with an inclusive shopping journey. Built around product clarity, intuitive curation, and a dedicated spotlight for local UMKM creators.

ROLEUI/UX Designer
RESPONSIBILITIESUser Flows · Figma Design System · Prototyping
TOOLSFigma · Auto-Layout · Design Tokens
FOCUS AREASBeauty E-Commerce · Local Artisans (UMKM)
aurame.com / showcase-overview
Auramé Website UI Screens Overview
01 / CONCEPT

Elevating the beauty e-commerce experience.

The core challenge in designing Auramé was creating a digital space that feels simultaneously high-end and welcoming to local business initiatives. Traditional luxury beauty websites can feel cold or overwhelming, while community marketplaces often lack visual polish.

Our design direction balances generous whitespace, rich editorial imagery, and structured product taxonomy to guide users effortlessly from inspiration to checkout.

Refined Aesthetic

Soft rose tones and deep burgundy accents complement clean white surfaces.

UMKM Curation

Dedicated storytelling banners highlighting Indonesian local artisan craft.

Intuitive Browsing

Streamlined category filters, flash deals, and persistent wishlist access.

Frictionless Checkout

Minimal forms and clear bill summaries designed for modern shoppers.

02 / VISUAL IDENTITY

Design System & Brand Language

Every element was crafted to reinforce trust, elegance, and product readability.

Auramé

Elevate Your Look. Empower Your Style.

Exclusive Brand Serif: Merriweather
TYPOGRAPHY HIERARCHY
Brand Logo / WordmarkMerriweather Bold

Auramé

Headings & Section TitlesPoppins SemiBold / Medium

Elevate Your Look

Body Text, Labels & NavigationOpen Sans Regular / Light

Discover the latest trends in fashion and beauty curated just for you.

COLOR PALETTE
Deep Burgundy#800A38 · Primary Accent
Soft Rose#F5EBEB · Surface Tint
Charcoal Dark#121212 · Deep Background
Pure White#FFFFFF · Content Surface
UI COMPONENTS & BUTTONS
40% OFFUMKM SPOTLIGHT
03 / KEY INTERFACES

Selected Interface Screens

Curated views showcasing the landing experience, local creator stories, and wishlist management.

01. HOMEPAGE & CATEGORY DISCOVERY

Featuring hero editorial video, category tabs, flash sale carousel, and UMKM narrative banner.

Auramé Homepage Interface Screen
02. UMKM PRODUCTS & SPOTLIGHT

Dedicated portal celebrating local creator craftsmanship and curated lookbooks.

Auramé UMKM Products Screen
03. WISHLIST & DISCOVERY GRID

Clean product catalog with price tags, rating counters, and quick add-to-favorites.

Auramé Wishlist Screen
04 / INTERACTION

The User Journey

Guiding customers through discovery, storytelling, and purchase with minimal friction.

01

DISCOVER

Engage via editorial hero banner & seasonal trend highlights.

02

EXPLORE

Filter by fashion, beauty, or local UMKM artisan collections.

03

SELECT

Review product details, save to wishlist, or check size charts.

04

PURCHASE

Transparent billing summary & express payment options.

05 / ADAPTABILITY

Responsive Across Devices

From desktop widescreen browsing to mobile quick shopping, the design system scales seamlessly while maintaining typographic harmony and tactile interaction states.

  • Fluid typographic scaling using CSS clamp
  • Touch-optimized product card touch targets
  • High-contrast image accessibility
Auramé Mobile and Desktop Multi-Device View
Auramé

“Designed to feel as refined as the brand itself.”

Explore the complete interactive prototype, component library, and design files directly in Figma.