Milk Studios
Achieving Cult Status Through Customer Obsession
Designing a fast, expressive e-commerce experience that mirrors the energy of Milk’s community.
Tags
Design Leadership
Business Strategy
Content Strategy
Information Architecture
USER EXPERIENCE
Prototyping
ECCOMMERCE
Role
Director of User Experience, Wondersauce
4.86%
Conversion Rate
$101M
Annual Revenue (2023)
$1.2B
Merger with Obagi
Overview
Milk Makeup, a direct-to-consumer beauty brand, had quickly gained a passionate following among ambitious, young creatives who valued clean, multi-functional beauty essentials. Founded by the visionary team behind Milk Studios—a photography studio known in New York City's fashion and art circles—the brand intentionally targeted the workers behind the scenes who needed makeup that endured long production days. Despite their founders' proven track record, launching and sustaining a new brand in a highly competitive beauty market posed significant challenges: more than 30,000 products launch annually, with a 95% failure rate.
Our objective was clear: create a seamless e-commerce experience that immediately communicated Milk Makeup’s unique value proposition, streamlined checkout, and strengthened community engagement. Ultimately, this digital-first direct-to-consumer strategy helped propel the brand toward a merger valued at $1.2 billion.
Affordance as Brand Strategy
One reason Milk Makeup felt so disruptive—and has remained so enduring—is that it was crystal clear who the brand was for from the very beginning: young creatives working in New York’s art, fashion, and music scenes. These were workers pulling long days in the studio and heading straight into the nightlife. In a sentence: art kids, high-concept/low-maintenance, clean beauty standards.
The anthem that announced Milk Makeup’s arrival and positioned the brand as a reflection of NYC’s art, fashion, and music scenes.
The brand spoke directly to this audience through everything from product formulation to packaging. Milk’s industrial design choices weren’t just functional—they carried built-in affordances, borrowing the visual and tactile language of artist tools to suggest how the products should be used: no brushes, no instructions, just hands, heat, and intuition. The first product line was designed to resemble tools you’d find in a downtown art supply store. Eye makeup came in squeeze tubes that looked like acrylic paints. Lip products were packaged in twist-top jars that recalled the containers artists use to mix or thin paint. The secondary packaging could’ve been mistaken for actual studio supplies. These products didn’t just look cool—they looked familiar.
The first product line was designed to resemble materials you’d find in a downtown art supply store. The packaging could’ve been mistaken for actual studio supplies. These products didn’t just look cool—they looked familiar.
In that way, Milk Makeup shared a philosophy with early versions of the iPhone—which famously shipped without a manual. The interface was so intuitive, so grounded in real-world metaphors, that people just knew how to use it. That same sense of immediacy and delight—of not needing to be told—was what we aimed for with Milk’s packaging and product experience.
We brought that same utilitarian, familiarity-first approach to the website design. Typography was stripped down to just two weights—Regular and Semi-bold. No italics. The color palette: white, off-white, gray, and a single accent hue for error states. Buttons and forms were unstyled, aside from state changes. The only color came from the pigmentation of the makeup itself.
We brought the same utilitarian, familiarity-first approach that shaped Milk Makeup’s industrial design and packaging to the design of the website.
Just as the packaging was designed to feel intuitive—something you could apply with your fingers and body heat—we wanted the digital experience to feel equally effortless. No learning curve. Just immediate clarity: browse, discover, shop.
Designing for Speed and Simplicity
The Milk customer leads a dynamic, fast-paced lifestyle. They expect products that seamlessly adapt from day to night—and demands an equally efficient online shopping experience. To meet that expectation, we embraced radical simplicity in the site’s design, streamlining navigation into just four clear categories: Eye, Lip, Face, and Skincare.
Navigation was constrained to just four categories: Eye, Lip, Face, and Skincare.
While conventional e-commerce wisdom tends to favor expansive «mega menus,» our minimalist approach intentionally reduced cognitive load, helping users focus instantly on the products that mattered most. But simplifying navigation introduced a new challenge: ensuring users could still find what they needed without friction.
To address the limitations of minimalist navigation, we introduced robust filtering tools on each category page—enabling shoppers to drill down by preferences like «vegan» or «multi-use.» This preserved relevance and ensured that users could quickly and confidently find what they were looking for, while also leaving room for product discovery.
To address the limitations of minimalist navigation, we introduced robust filtering tools on each category page—enabling shoppers to drill down by preferences like “vegan” or “multi-use” ensuring they could quickly and confidently find what they were looking for.
As a digital-first brand, Milk relies heavily on marketing individual products through social media. That means many first-time visitors land on the site with one specific item in mind—but are immediately faced with a broad catalog of offerings. Without effective filtering, this can lead to decision fatigue or choice paralysis. Our filtering system was designed to overcome that challenge by creating clear, intuitive pathways that supported both focused intent and exploratory behavior.
This approach was inspired a Human Computer Interaction theory I learned while pursuing a Masters in Interaction Design: the concept of «information scent,» developed by researchers at Xerox PARC, who observed that web users navigate digital environments much like our ancestors hunted for food—by following cues that suggest they’re getting closer to their goal. A strong information scent is achieved when design elements provide perceptible clues that guide users toward what they’re looking for. In this case, filtering became more than just a convenience—it was a critical tool for reducing friction, building confidence, and helping users move swiftly toward their intent, whether that was purchasing a known product or discovering something new.
To further enhance shopping efficiency, we designed an innovative «quick view» modal. Activated directly from category pages, this off-canvas interaction let users explore product variations and add items to their cart without losing their place or interrupting their browsing flow. At the time, this interaction pattern was novel—it didn’t exist in standard UI libraries—so we prototyped it from scratch using early versions of Framer and Adobe After Effects. Interestingly, a similar pattern was later codified in Apple’s Human Interface Guidelines when it was adopted for the Notification Center in macOS—an example of how emergent web UI patterns can influence broader platform standards.
A motion study of the "quick view" modal that let shoppers explore product variations and add items to their card without losing their place on a category page.
While I was at Wondersauce, six of the websites I led were featured as «Best Website» on Site Inspire—including our work for Milk Makeup. I believe that recognition came, in part, from our ability to design at multiple levels at once: strategic (Does this solve a real customer problem?), experiential (Is it useful and usable?), and emotional (Is it beautiful enough that someone’s willing to exchange value—time, attention, money—for it?).
One of the most important lessons I’ve learned—and relearned—throughout my career is that the quality of a screen-based experience often comes down to its micro-interactions. Dan Saffer defines these as «the functional, interactive details of a product.» Charles Eames put it even more succinctly: «The details are not the details. They make the design.»
Those details matter more now than ever. In 2007, the first iPhone packed 163 pixels into each inch of screen. Today’s flagship iPhones deliver more than double that density—460 PPI—far beyond the original Retina threshold. The result? Interfaces so crisp they dissolve into the physical world, raising the bar for every element of craft: typography, layout, motion, and especially micro-interactions.
A motion study exploring scroll behavior and transitions between sections in the category view.
For Milk Makeup’s website, we obsessively designed and animated the tiniest moments—adding items to cart, scrolling behaviors, video appearances, and loading states. Each of these lasts just milliseconds, but together, they shape how a user feels. They create emotional resonance and establish trust. When done well, I believe these details don’t just create polish—they create brand equity. They distinguish a brand from its competitors, build loyalty, and become a durable, defensible advantage in the market.
Content Strategy for Education and Inspiration
Milk Makeup customers are discerning and socially conscious. They value transparency, quality, and the ethical sourcing of ingredients—and they often research deeply before making a purchase. To support this behavior, we focused on meeting customers where it mattered most: in the moments of decision-making.
Knowing that 41% of makeup buyers consult YouTube tutorials before purchasing, we embedded product application videos directly on product pages.
We integrated rich, educational content throughout the site to build trust and confidence. A dedicated Looks section featured playful, informative videos with real users sharing beauty tips and inspiration—blending authenticity with brand storytelling. And knowing that 41% of makeup buyers consult YouTube tutorials before purchasing, we embedded product application videos directly on product pages. These not only demonstrated how to use each product, but also highlighted key ingredients and offered personalized usage tips.
While resource-intensive, this investment in content proved highly effective. It helped articulate Milk Makeup’s value proposition with precision and clarity—right at the point where customers were deciding whether to buy.
Connecting with the Broader Creative Community
Milk’s customers are deeply connected and crave authentic engagement with creative communities. Many are drawn to the brand not just for its products, but for its ties to New York City’s vibrant art, music, and fashion scenes—and they want to feel a part of that world.
The Looks section of the site told stories that deepened emotional resonance and directly supported in-session purchases by aligning Milk’s products with a broader cultural ethos.
To foster those connections, we created a dedicated section of the site featuring intimate interviews and documentary-style short films. These stories followed groups of young creatives as they navigated daily life in NYC, offering a window into the culture and community that inspires the brand. This storytelling approach did more than build brand equity—it deepened emotional resonance and directly supported in-session purchases by aligning Milk’s products with a broader cultural ethos. The result was a more immersive, meaningful experience that connected customers to something larger than the transaction.
Results and Impact
Upon launch, Milk Makeup gained widespread recognition for championing gender-fluid, creative «non-models,» challenging traditional beauty norms. The launch of innovative products like KUSH Mascara and Hydro Grip Primer quickly went viral, further solidifying Milk Makeup's reputation for product innovation and authenticity.
In its first year, the website achieved a remarkable 4.86% conversion rate, significantly surpassing industry averages (2.5–3%) and placing it within Shopify's top 10% benchmark for e-commerce performance. Morgan Fleming, Milk Makeup’s Director of E-commerce, attributed this success to three core strengths: passionate social media communities, a content-rich yet easily maintained website, and an intuitive user experience specifically optimized for high conversion.
Financially, Milk Makeup experienced exceptional growth, doubling its revenue annually for two consecutive years post-launch. Although growth naturally moderated as the brand matured, it continued to demonstrate strong and sustained market performance, increasing from $47.1 million to $100.5 million within three years.
In November 2021, Milk Makeup merged with skincare brand Obagi, forming a $1.2 billion beauty powerhouse. Today, Milk Makeup remains a leader in clean beauty, achieving 54% year-over-year growth in 2023 and securing its position as Sephora’s second-most popular clean beauty brand.
Lessons Learned
This project underscored the immense value of a focused, customer-obsessed strategy paired with intentional community-building. By prioritizing clarity, content-driven education, and authentic community connections, we helped Milk Makeup transcend traditional beauty norms and establish itself as a major player in a fiercely competitive industry.
❦