sbc_mobilebackup.png

Barstool Sports - November 2022

Senior UX / UI Designer - User Experience, Visual Design, User Flows, Research

My Role

The Team

Tucker Borgman, PM

Kat Gowin, PM

Joe Bona, SWE

Nick Morrison, SWE

Timeline & Status

Designed and built in 8 weeks, launched November 22’

In September 2022, Barstool launched Stella Blue, a direct-to-consumer coffee brand with Dan "Big Cat" Katz and his dog, Stella, as the face of the company.

I led the strategy and design of the eCommerce website, surpassing the annual revenue target by an impressive 300%.

My approach was rooted in user-centered design, data-driven decisions, and seamless collaboration with stakeholders to conceive, design, and develop the website.

Overview

Competitive Analysis & Research

My journey began by delving into comprehensive competitive research, where I meticulously examined coffee and DTC eCommerce landscapes, uncovering noteworthy trends, patterns, and key competitors.

  • The online coffee market is fiercely competitive, favoring vibrant, personalized brands.

  • Subscriptions and bundles boost Average Order Value and revenue compared to selling individual coffee bags.

  • Some eCommerce experiences are overly complex; our aim is simplicity and user-friendliness.

Key Insights:

Designing User Pathways

For Stella Blue, we designed multiple coffee purchase paths. I created UX flows to identify gaps concurrently with wireframe development using FigJam.

Brainstorming & Wireframing

Daily meetings with stakeholders involved brainstorming and refining ideas to chart the website's direction. We formulated key questions to guide our design:

  1. How can we amplify Dan's appeal for users in an engaging manner?

  2. What strategies can simplify user entry into the subscription funnel?

  3. Balancing a light and fun vibe with a polished eCommerce experience, how can we achieve this synergy?

With these questions, we initiated low-fidelity wireframe ideation for page functionality and flow.

Visual Exploration & Brand Identity

While pinpointing eCommerce needs, we collaborated with stakeholders to envision the brand's imagery for the website. I developed mood boards featuring coffee-related visuals that aligned with the site's direction and crafted a style guide that harmonized with both the coffee packaging art and modern web design standards.

As we moved to the project's final stages, which included high-fidelity mockups, prototypes, and early development, our focus shifted from UX to UI. We had discussions on promoting our Coffee Club Subscription, improving our UI to highlight value propositions for better conversions, and other enhancements. As the experience evolved, we collaborated closely with developers to provide feedback as needed.

Putting It All Together

  • Engaging Video Header: Featuring a looping video of Dan, this header quickly captured users' attention and conveyed the brand's identity.

  • User-Friendly Subscription Flow: a straightforward build-your-own subscription experience, minimizing friction for seamless checkout.

  • Balancing Cartoon and Real Photography: Seamlessly integrated lighthearted cartoon branding with impactful real-world photography. We made sure to Infuse humor into the user experience for less serious elements, delighting users.

Key Website Successes:

A Phenomenal Launch and Charitable Impact

The Stella Blue website launched in mid-November 2022, achieving the year-end revenue goal within 48 hours – a testament to combining great personalities, brand, design, and engineering.

By the end of 2022, Stella Blue Coffee tripled its annual revenue goal, exclusively through the website, live for just a month and a half

Stella Blue has garnered outstanding reviews and maintains its strong performance. Personally, I take great pride in our partnership with PAWS Chicago, contributing a portion of our proceeds to support local dog adoption efforts in Chicago.