Building at Speed and Scale: For YETI’s New Bag Launch, the System is the Strategy
By Graham Ameron and Melissa Belongea
As a digital product and innovation agency, velocity defines our timelines. We are most often hired when experience is a metric, impact is non-negotiable, and, in the case of the YETI bag collection — launch needs to happen immediately.
Working on an eight-week timeline, content, strategy, design and development were being created in parallel across the YML and YETI teams — which meant we needed an approach that allowed us to quickly deliver designs that still met the high standard of YETI's prestigious brand.
Our strategy? Create a system built to scale. YETI, known for coolers and drinkware, as well as their ability to unite recreationists of all kinds, engaged YML to help launch a new line of travel bags. In addition to creating a new product page template, YML’s designs also informed other areas of YETI's global e-commerce experience. Spoiler alert: the designs were delivered on time, and the bags sold out within 24 hours of launching the new site.
How did we do it?
Pressure makes diamonds
Fast turnarounds force prioritization. As our Chief Creative Officer Stephen Clements likes to say, “pressure makes diamonds.” Each hour is an exercise in creating impact. At times it can feel unnerving and disorganized, the to-do list getting buried in the dust.
More often, when the pressure is on, we train ourselves to relax around the unknowns and focus on building the pieces we can control. Each day we evaluate what new information is available, reset toward our KPIs (key performance indicators), and ground our workflows to this end.
For the YETI project, one of the biggest challenges was embracing and optimizing the design and development teams' five different timezones for maximum output and efficiency. While some may see this as a bottleneck, we used it to our advantage to continue working around the clock. Between consistent daily meetings and frequent team jam sessions, the established rapport and connection meant one team in one timezone could pick up where the other left off seamlessly.
Holistic systems building
In the case of YETI, the true strategy was in creating a scalable design and communication system. Our design task was to deliver a website application that the YETI team would develop internally, but in order to see the designs reach success, we also needed a clear way of communicating them to the development team.
Below are a variety of early prototype explorations
Since the YETI team handled development, we needed a clean process for passing designs over. We worked intentionally within their dev environment and leveraged the tool ProtoPie as our nonstatic communication layer. Providing static screens for a design system can create gaps in the execution, so using prototyping tools (ProtoPie, Figma and After Effects) to communicate through animation and interactivity helped us think through the design system as a whole.
We designed a custom experience the cross-functional YETI team could use to build and specify content according to consistent guidelines. Instead of designing for a single product collection, we considered the entire product catalog in the process.
Laith Azzam, YML's Design Technologist on the YETI work shared, "Integrating progressive tooling like ProtoPie & Storybook into our workflow allowed our design team to collaboratively validate ideas into documented interaction models as well as usable code-snippets for development."
The result was a set of modular components and infrastructure that could accommodate the full e-commerce experience. This meant that any and all component combinations we designed would function powerfully and still look amazing. With such a flexible system, YETI could then mix and match or turn on/off any design elements while maintaining aesthetic integrity — ultimately giving them the modularity and ability for variations needed to scale.
And it worked — see the work and impact in our case study.
Co-Creation and the power of shared thinking
When building quickly, it's vital to remove friction. Working across an integrated agency and client team, co-creation goes beyond collaboration to help establish ownership and excitement for both teams.
We're all here to build an exceptional product, so curiosity and open dialogue delivered with kindness are fundamental to the process. When the whole team is laser-focused on great product outcomes, we are able to quickly build and narrow in on the best path forward.
With the YETI project, we experienced this firsthand. Throughout the process, we each had our own space to ideate, coming together to challenge each other's thinking and stretch our collective brain with new creative ideas. As it goes, when collaboration is high, sometimes this shared thinking would extend outside the working file. Between Denim Tuesdays, that one time Amit and Andrew showed up wearing the same flannel, and a casual Wednesday when we all wore wild prints—it seems a good mind meld shows up in all kinds of ways.
As a unified team across client and agency, both sides enjoy a sense of pride and excitement for the work that has been done together. Bringing the YETI and YML teams together was essential for effective communication and strategy. With the right balance between creative ideas, rapid iterations, and builds, we were able to produce a world-class experience that scaled from the start.
This is only the beginning of our relationship with YETI, and we look forward to what’s next.
Resources
Figma:
ProtoPie:
Interactivity / Motion Documentation
“Source Of Truth” for QA
--
About the Authors:
Graham Ameron is a Toronto-based Creative Director leading initiatives for various high-profile brands including Ally Bank, Purpose Financial and YETI. Motivated by craft, his passion is bridging technology and design with experiences that push boundaries, excite customers, impress clients, and drive value. Throughout his career, Graham has designed experiences for some of the most well-known global brands including: FCA Automobiles, Hyundai, Harley-Davidson, BMW, Xbox, Microsoft, Gillette and Nike.
Melissa Belongea is a creative and strategic thinker specializing in systems thinking, macro movements, subcultural awareness, storytelling, brand building, and content strategy. She draws inspiration from anthropology and wild outdoor spaces, and has worked with independent creatives, small businesses, large companies and startups including Apple, Airbnb, Athleta, Chris Burkard, and Tres Birds Workshop, a sustainable architecture firm in Denver, Colorado.