+ CHROME HEARTS MEMBERS MOBILE APP +

My Role:

UX Designer

Client: Chrome Hearts
Primary User: Chrome Hearts Enthusiasts
Secondary User: Casual fashion consumers

My primary focus for this product was
to translate Chrome Heart's "we do what
we want"
ethos to a mobile platform.
Course & Timeline:

Thesis Project Part 1
at the University of Colorado Boulder
Primary Advisor - Aileen Pierce
External Advisor - Jack Dille

Jan - Feb 2022
Tools:

Illustrator, Photoshop, Figma, Miro

Foti image

My Story with Chrome Hearts

  • My interest in Chrome Hearts began with my brother in law introducing me to the appointment only, high end, exclusively brick and mortar fashion brand in 2020. The basic philosophy of the brand is "we do what we want." This ideology not only applies to the fashion industry as a whole, but to their customer base as well. This esoteric posture is the reason the brand has historically decided against partaking in building up a digital presence, and is why I chose to take on the challenge of building a digital platform for them.

Two phones with users screens

Project Background

  • Chrome Hearts Business Scenario
  • Chrome Hearts is an international brick and mortar retail-only boutique with locations in New York City, Los Angeles, Miami, Malibu, Las Vegas, Honolulu, Aspen, London, Manchester, Paris, and Beijing. The stores are edgy, highly curated, and feature a variety of custom products from clothing, jewelry, and eccentric accessories all the way to stuffed animals and hand crafted furniture.

    Overall, Chrome Hearts is an incredibly successful company relying solely on brick and mortar revenue. With that being said, they are leaving hundreds of millions of dollars on the table by avoiding the e-commerce market (ecommercedb.com). The success of a digital platform for the company will come down to how their brand and philosophy is translated to a mobile experience. i.e. Maintaining the intimate shopping experience, limited access to merch, and creating allure through an obscure marketing campaign.

  • After completing a competitive audit of direct competitors such as Balenciaga, Rick Owens, Dior, Tiffany, and Bulgari, it became apparent that Chrome Hearts is leaving hundreds of millions of dollars in e-commerce revenue on the table. Creating a mobile e-commerce platform is not a top priority to the company, but providing global accessibility to Chrome Hearts gear is something owner, Richard Stark, has desired since the inception of the company.

So then, the question becomes;

“How can Chrome Hearts develop & design a mobile app that maintains the ethos of the brand while also boosting the eCommerce revenue stream?”

Long game innovation diagram

Long Game of Innovation

  • Chrome Hearts is notorious for rebelling against the fashion norms of seasonal line releases, scheduled "drop" dates, and marketing their new products. The release of the app should be no different.

    Holding true to the brand, the app should be released slowly to individual stores over time. The app will then be accessible via discrete QR codes placed in the store's windows or display cases.

    Once the user downloads the app, they will be able to link and share the app with friends and family. The slow release of the platform will allow the company to adjust to inventory needs as well as fine tune mass fabrication for mobile orders.
In store qr code
Mock up of discrete QR code under a display shelf

Chrome Hearts adheres to a very direct and "in your face" ideology;

"We don't have any seasons. I make things when I wanna make them, because I wanna make them."
+ Richard Stark +

Richard Stark - Founder of Chrome Hearts

  • The brand's signature trademark F*CK YOU is printed, engraved, embedded, and stamped into almost every piece of merchandise available at Chrome Hearts.

I distilled the ethos of Chromes Hearts down to

Intimate Shopping Experience

  • If customers want all the drawers to be opened and full inventory access, they have to book an appointment with the store.

Customer Acquisition

  • Chrome Hearts has gained a cult following through A-list celebrities sporting their Chrome Hearts gear on Instagram. This is their only means of marketing           

Minimalistic Digital Footprint

  • Chrome Hearts runs an Instagram page with 1.3 million followers. This is the only official platform hosting Chrome Heart's content with product images and videos.

No Location is the Same

  • On top of the general product shipments, each store gets custom shipments from the L.A. warehouse according to its geography.

“We Do What We Want” Philosophy

  • Chrome Hearts / Richard Stark is notorious for dropping products on a whim and shipping merchandise to stores without disclosing what is in the shipment.

Translating 5 core principles to a new

Intimate Shopping Experience

  • The "Your Eyes Only" virtual room will be an assortment of personalized items based on the users' interests, store location preferences, and XP level.

Customer Acquisition

  • Chrome Hearts has built an empire relying entirely on second hand celebrity star power and word of mouth.

Minimalistic Digital Footprint

  • "Chrome Connect" is a hyper simplified, members-only forum for users to share and explore other members' Chrome Hearts collections. This will feature serve consumers as an inspiration board for any custom orders.

No Location is the Same

  • The app hosts an “Unlock Location” feature which allows users to access items unique to virtual store locations.

“We Do What We Want” Philosophy

  • The app will fundamentally operate on the same principles the company was founded on; we do what we want, when we want.

  • By creating a mobile app, Chrome Hearts can finally provide its customers global access to the brand and a platform that allows consumers to purchase goods, follow exclusive brand updates, and connect / share their collections, all while capitalizing on e-commerce market. 

Existing Digital Interface

  • There are three main issues the current digital interface needs to address.
  1. The current user interface does not inspire the user to explore. Rather, the web page looks like an unfinished web page for random products the user does not want.
  2. Users’ should not feel as if they are navigating through a dysfunctional website; they should feel as though they are getting access to exclusive content and products, inspiring them to continue coming back.
  3. Ideally, users’ should feel that they are exclusive members of the Chrome Hearts family when they use the website. 
  • The new mobile app platform addresses these three key points and more through intentional design decisions, curated user interaction design, and a cohesive visual identity that reinforces the Chrome Hearts brand.

Developing Use Cases & Prototyping

Big Picture Story Board
UX Design Story Board

  • I began with sketches and paper wireframes to finally developing a high-fidelity Principle prototype. I went through some use cases and personas to make a list of big picture features to include. I also did some quick thumbnails of screens to help me understand the user flow and get a rough understanding of structure. I looked at different functions, like the ability to create inspo boards for custom designs, following other users, as well as unlocking virtual store locations using XP. I decided to focus on a comprehensive brand experience rather than strictly focusing on e-commerce.

After extensive brand research, the Chrome Hearts brand and experience can be broken down into THREE principal categories:

Wireframing -> HiFi Prototype

The Chrome Hearts app headlines three main shopping features; General Collection, Featured Designer (Matty Boy), and Your Eyes Only. Each shopping experience allows users to browse Chrome Hearts products in a mobile first experience.

All three shop pages share a similar interface. General Collection is the only shop page that will not rotate content based on the 48hr revolving timer. Instead, both Your Eyes Only and Featured Designer (Matty Boy) pages will have a running timer on the page. The timer lets users know how much time is left before the room flips the content. The page allows users to brows targeted products based off of their interests. In this card swiping experience, users can buy, save, share, and like Chrome Hearts products. 

Each purchase the user makes will build up their member XP. Over time, the user will build up their XP levels and receive special rewards, perks, and access as they ascend the ranks.

Every shopping page uses either a card swiping experience or grid view to allow users to buy and save products on a revolving 48hr window. As the user likes and purchases items, the algorithm will be better at curating specific items on the Your Eyes Only page.

The UI seen was chosen based off of 5 user tests with ages ranging from 22-43 years. Various UI’s were mocked-up, and with user feedback and affinity mapping, the current solution was built. User testing determined that the initial shopping pages were text heavy and navigation was unclear.

SHOP // General Collection Mapping & Demo

General Collection // User Mapping

  • The user first needs to install the Chrome Hearts app and log in. After this, the app launches to the “Home” page, allowing users to decide which shop page to navigate to. To view more information on a product, the user can select any individual item. General Collection will not have a 48hr flip cycle, but will rotate products however and whenever Chrome Hearts chooses to do so. Once the user completes their checkout, the completed purchase animation will then automatically send the user to the current orders page listing tracking numbers and delivery estimates.

General Collection // User Demo

SHOP // Featured Designer Mapping & Demo

Matty Boy // User Mapping

  • The next shop flow is the Featured Designer page. The Featured Design page will always host video content at the top of the page, and the user will have to decide if they want to unlock individual items to see the price. The caveat is that the user will have one hour after opening the product to decide whether or not to purchase the item. After that hour has expired, that item will be removed from the shop-able items listed in the featured designer pages.

Matty Boy // User Demo

SHOP // Your Eyes Only Mapping & Demo

Your Eyes Only // User Mapping

  • The General Collection and Your Eyes Only pages have almost identical user flows. The difference is that the Your Eyes Only page is curated according to the users preferences, favorited items, past purchases and XP level. The more the user favorites, purchases, and updates their interests page, the better the algorithm will be at listing desirable products to the user 

Your Eyes Only // User Demo

                                   

Wireframing -> HiFi Prototype

Chrome Hearts has retail storefronts located all the way from L.A. to Beijing. The excitement of visiting a specific storefront location is that customers have access to items available only in that location. 

The Unlock Location page follows the general flow of the shop pages, but has a few key differences. Each virtual location hosts items that are unique to that store front only. Once XP has been used to unlock the location, the user will have 24 hours to access the items available in that specific store location. However, much like in real life, the content of each virtual location is not revealed until the user unlocks or “travels” to that page. 

Though, accessing virtual locations comes at a price. Once the 24 hour window expires, the location will return to its locked state, requiring the user to spend XP to unlock it again.The XP cost to unlock the door to virtual locations will vary according to the amount of items available in that virtual store.

However, the location rooms are not purely for shopping, each location will also have teaser content at the bottom of the room. This is the closest thing to a drop date that Chrome Hearts will get with any of its products. Product descriptions are slim to none and with no indication of when the products will be released.

The Unlock Location feature allows members to experience this same excitement on a mobile interface. Designed as a secondary action button, the user will discover the ability to access and shop any virtual location.

EXPLORE // Unlock Location Mapping & Demo

Unlock Location // User Mapping

  • Once the user is on the home page, they can find the Unlock Locations Button in both the Your Eyes Only and General Collection (GC) shop pages. The unlock button is intended to be an easter egg function the user stumbles upon while exploring the app. If the user decides to unlock a location, they can swipe left on the location tab to reveal the unlock button. Additionally, each virtual location will feature a coming soon teaser. Although, the teaser will not contain any drop dates or in depth details to stay on brand with Chrome Hearts product releases. 

Unlock Location // User Demo

EXPLORE // Inside Chrome Hearts

Wireframing -> HiFi Prototype

Currently, the operational aspects of Chrome Hearts are shrouded in mystery and allure, but not for the sake of secrecy. Richard Stark and family are more than happy to participate in detailed interviews of how they came to be, showing off the inside of the warehouses, or how they conduct their business and why.The mystery and allure come from Chrome Hearts having never invested in developing an official platform to tell its story.

That all changes with the Inside Chrome Hearts page on the app. The Inside Chrome Hearts page is not an in-depth muse on the company. Instead, a place for Chrome Hearts to curate and release small snippets of company history, fun stories from the Stark family adventures, and publish special employee stories and highlights.

The flow of Inside Chrome Hearts most resembles that of a mobile blog. There will only be four content cards available to view at any given time. Inside Chrome Hearts is the indirect channel for Chrome Hearts to communicate to its members. Whether it be history of the company, stories of how designs came to life, or employee and family highlights throughout the years. The posts will have video, image, and written content specially curated by Chrome Hearts.

EXPLORE // Inside Chrome Hearts Mapping & Demo

Inside Chrome Hearts // User Mapping

  • Navigating to the Inside Chrome Hearts pages of the app is a very straight forward and simple flow. The Inside Chrome Hearts card is at the very bottom of the home page. This page is the first official platform for Chrome Hearts to tell their story of how the company came to be what it is today, who Richard Stark is, or shed light onto fabrication methods such as metal smithing or the leather work. This feature will be the heart behind bringing account holders into the inner circle of the Chrome Hearts and Stark family.

Unlock Location // User Demo

Chrome Collections Wireframing -> HiFi Prototype

The newest feature to the Chrome Hearts business model is the Chrome Collections forum. The Chrome Collections platform is one of the most critical aspects currently missing from the brick-and-mortar business model. 

One of Chrome Hearts' essential services is its ability to custom design and make any product for customers. However, when asking for a custom piece, they require customers to send them detailed images and descriptions of what they want.

Chrome Collections is a platform for members to post items from their collections, save items other users post to their inspiration (inspo) board for future custom order ideas, and connect with other Chrome Hearts members across the globe. The minimal functionality and user flow of Chrome Collections is deliberate. The forum is a space for users to share their personal Chrome collections, gain inspiration for custom projects, and connect with other members.

The intent is not to create a fashion based instagram, but an interactive collection and sharing forum. The majority of privately owned Chrome Hearts products have never been seen by the general public before.

Post descriptions are limited to listing how long the user has been a member, what store location the item was purchased out of, and the name of the item. The messaging and commenting functionality has been removed so that the platform maintains a clean, simple, and aesthetic interface that doesn’t deter from the Chrome Hearts brand.

CONNECT // Chrome Collections Mapping & Demo

Chrome Collections // User Mapping

  • There are three main user flows within the Chrome Collections feature; browse, search, and profile. Each of these flows are interconnected through the expandable menu fobBrowse is the main home screen allowing users to view posts from other collectors they follow. Search is where users can type in key words such as denim or furniture and see what items others have posted. The last is profile, profile is where the user can access and edit their inspo board and manage what items from their own collections they would like to show on their page.

Unlock Location // User Demo

Matty Boy Shopping
App Home Page

Project Take-aways

I learned an incredible amount from this project. One of the most important lessons I learned was how to utilize an existing brand's ideology to design the UX and UI of the app. There are few opportunities to design an app for a company as unique as Chrome Hearts, who has built their success off of doing literally what ever they want. Uncovering the ethos of the company was one of the most fun yet challenging aspects of the project for me.

Creating a consistent visual design style I could utilize to highlight the company's ideology and designs proved extremely valuable.

The second most important lesson I learned is how to create undisclosed UI's. Chrome Hearts offers its members a plethora of experiences and access to goods, but the only way to find out about them is to either stumble across them incidentally, or actively look for their in-store "easter eggs." I wanted to create a similar undisclosed experience in the app where users may stumble across "are you feeling lucky" buttons or hidden unlocked doors to different stores around the world.

Considering the app as a wholistic experience rather than just a shopping platform was key to translating the Chrome Hearts ethos to a mobile expereince.

If I were to take this project further, I would focus heavily on the your eyes only and unlock location portions of the app. I think those two features have the highest potential of creating return users and mimicking that excitement users get when shopping in a brick and mortar location.

If you're interested in this project and want to hear more, or just want to chat, feel free to contact me!