Enclus Style

Project Overview:
Ecommerce Website for Online Style Magazine

Create an ecommerce-enabled, editorial-rich website which enhances the usual magazine shopping experience while matching shoppers with conscious and inclusive luxury designers.

Summary:

Enclus Style set out to create a mindful, inclusive luxury apparel website that presents shoppers with clothes by designers who make diversity and eco-consciousness a vital part of their business plans and practices.

Also at the forefront of product design was a desire to upgrade the luxury magazine shopping experiences by providing regularly curated outfit ideas wrapped in day-in-the-life vignettes.

The website's goal was to provide an engaging, easy-to-navigate platform that showcases mindful, high-end fashion products, with a focus on creating a welcoming space for all users. The design incorporated the motifs "Think Style Rather Than Fashion" for "Age-Free, Gender-Free, Colorful Shapes," aiming to render the user experience enjoyable and inspiring. The site features a user-friendly interface with multimedia content, personalized recommendations, and interactive elements to keep users engaged. The overall objective was to increase awareness, promote inclusivity, and provide a positive, luxurious online experience that aligns with Enclus Style's brand values.

I began by talking to a wide range of shoppers, style-conscious consumers, and industry insiders — people who care deeply about where their clothes come from and what they say about who they are. Those conversations revealed a consistent tension: the luxury fashion world talks a big game about values, but the online shopping experience rarely reflects them. Imagery feels performative. Sourcing information is buried. And the editorial voice — the thing that makes a brand feel like a point of view — gets flattened the moment someone clicks "shop."

That research informed every UX decision that followed, from how personas were framed to how the site architecture puts editorial content and the boutique in genuine conversation with each other.

The Process

Step 1

User Personas

Two primary personas emerged from stakeholder interviews and user research: Sofía, a Silver Lake brand strategist who treats her wardrobe like a portfolio and won't tolerate a landing page that doesn't match the editorial that brought her there; and River, a Brooklyn landscape architect and queer woman who wants clothes that move with her life — sourced with integrity, worn by real people actually doing things. Each persona defines goals, frustrations, behavioral tendencies, and the discovery channels that actually reach them.

Step 2

Journey Map

The journey map traces Sofía's full experience arc — from an Instagram save through post-purchase advocacy — across five phases: Discovery, Exploration, Evaluation, Purchase, and Post-Purchase. Each phase surfaces her actions, the touchpoints she engages, what she's thinking, and where friction kills the deal. The map made clear that inconsistent photography, buried sourcing information, and forced account creation were the three most decisive drop-off moments — and where design had the highest leverage.

Step 3

Site Map

The information architecture distinguishes between editorial and transactional page types — a distinction that drives the entire navigation logic. From the Home page, content-first destinations like Curated Outfits, Fresh Distillations, Spotlight, and Conscious Luxury live alongside the Boutique and Style as a Service. The Boutique branches into both occasion-based and category-based browsing, with retailer hand-off nodes clearly marked as external. The map keeps hierarchy to two levels and surfaces Wishlist and Login/Account as utility-level pages — navigated directly, never buried.

Step 4

User Flows

Two flows cover the site's most critical conversion paths. Flow 1 maps a new visitor becoming a newsletter subscriber — tracing the moments when editorial content earns enough trust to prompt a sign-up, and the sidebar and Encompass section serve as ambient conversion nudges for visitors who aren't ready yet. Flow 2 follows a conscious shopper arriving with a specific need — a party outfit — and shows how the editorial-first and shop-first paths eventually converge at the product detail page, with the Conscious Luxury section serving as a credential check before the "Buy Now" click.

Step 5

Wireframes

Low-fidelity wireframes establish the structural logic of the homepage before visual design enters the picture. The desktop layout leads with a bold editorial hero and horizontal mosaic scroll, moves through Conscious Luxury, Editor's Pick, and Enliven feature sections, and closes with a Latest Articles grid alongside a persistent newsletter prompt — the IYKYK sidebar that keeps conversion ambient rather than interruptive. The mobile wireframes compress the mosaic to a peek-and-scroll format, stack sections cleanly, and bring the Encompass newsletter block to the surface rather than relegating it to a footnote.

Step 6

Style Guide

The style guide codifies Enclus Style's visual language: a foundation of warm neutrals anchored by Slate as the primary action color, with Terra Cotta for success states and eco themes, and Twilight as an informational accent. Typography pairs Poppins for editorial headings with Raleway for body text — a combination that reads authoritative but never stiff. The guide defines button variants by use case (primary Shop/Buy, secondary outline, dark for emphasis, green for sign-up and eco actions), card and image proportions, an 8px spacing grid, and border-radius tokens that keep the UI grounded and tactile rather than clinical.

Summary:

A luxury style magazine pop-up where guests experience the future of fashion consultation through AR-powered virtual try-ons. Attendees are scanned onto a large screen using advanced AR mirrors, allowing Enclus stylists to outfit them for any occasion. All looks are sourced exclusively from mindful, sustainable luxury platforms, catering to the conscious couture clientele.