Serving Millions of Users on the New MrBeast Storefront

Case Study

October 21, 2022 Jose Rago


When MrBeast called, we answered. Tasked with creating a high-performance, fun-packed storefront for one of the largest fanbases on the planet, we brought our A-game. From engaging mini-games to seamless e-commerce, we crafted a digital experience worthy of the Beast himself—designed to delight, built to perform, and ready for millions.

Serving Millions of Users on the New MrBeast Storefront

It was a hot summer day in Mar del Plata, Argentina. AC running full steam at the basement HQ.

We got a call from MrBeast. It was big, they said, they were to lead a new merchandising campaign, and we were to design and develop the storefront where his immense fanbase would shop.

We knew we could handle traffic, but we had never handled as much as MrBeast would bring.

Mrbeast Brand figure asset
"Slap to Win" Game figure asset

Of course, keeping the site up was not an accomplishment in itself. We needed to give every visitor a delightful shopping experience. An experience that was top-notch in terms of design and performance, with fun mini-games to make it feels like a MrBeast video, and most importantly, direct users to buy.

We Took It To The Lab

While designing the site, we had both concrete requirements and more abstract ones. The client proposed us a sitemap and content structure., but we had to come up with fun stuff: “we want people to have fun on the site”, they said.

We added a layer of entertainment while keeping the BUY flow as the star of the show.

Mateo Zaragoza

Designer

After sessions of brainstorming, Lambo Jump was born: an infinite runner with similar mechanics to Google’s famous "No Internet Connection T-REX Game", but with MrBeast style.

We also knew that we couldn’t compromise the site’s performance because of this, so we loaded Lambo Jump’s JavaScript right when the user pressed the “PLAY” button.

An arduous task; from development, testing, debugging, and solution architecting; each feature worked on a required prior analysis to assess its impact on performance. Having the MrBeast team with strong QA helped us achieve greatness.

Nacho Mandagaran

Developer

The game was a huge success, with MrBeast fans sharing their scores on Twitter, and some of them even shooting YouTube videos about their experience playing it. What’s your high score, btw?

While Lambo Jump was a good idea, we wanted something more. Inspired by the “Cookie Clicker” game, we came up with “Slap to Win”: a game where visitors would “slap” members of the MrBeast crew. They loved it; in fact, they suggested the rewards could be actual products! This was a perfect way to engage visitors: a fun little game that had real rewards to redeem.

We had a big concern: tech-savvy folks could hack it (which they did), but we were giving away real products! We couldn’t just give away real stuff to hackers. We raised this issue to the MrBeast team and suggested putting in some rules to the game: prizes would only be redeemable alongside other purchases, and you would be able to redeem only one prize per purchase.

We solved the game’s logic server-side. With the help of Shopify’s Admin API, we created discount codes for the products that users redeemed, and luckily for our developers, Shopify’s Discounts API has fine-grain controls that allow us to set rules exactly as we wanted to.

Mr Beast's webiste

Development & Pre-launch

Vercel, Shopify, Axiom. These tools were the heroes of this story.

Vercel not only helped us iterate faster and deliver the site to all of our users; their Customer Success team worked alongside us to make sure everything was set up correctly from our side and theirs. MrBeast's team asked us if we’d be able to keep the site up despite all the traffic (and the unpredictability of it), and we relied on Vercel to do so. We actually set a record on the Vercel platform for the most requested site in the span of a week. Scary stuff, but still, a great achievement!

Mobile

Shopify is our go-to e-commerce provider, and their wide range suite of features covers all our needs. We leveraged their Storefront API, with a library built by us to connect to it in a type-safe manner: react-dropify. They served all of MrBeast’s traffic just fine!

Axiom is a newcomer to “the basement stack” ™. They provide observability at scale, which allowed us to monitor everything that was happening on the site at all times. We created a “Launch Dashboard” which observed different metrics and errors and gave us the confidence to know everything was fine.

The Beast & 100 Million Subscribers

Nerves? Nah, we’ve got nerves of steel. Remember that thing we say about making cool sh*t that performs? This wasn’t any different; we were ready, but let's not talk too much and allow our work to speak for itself.


October 21, 2022 Jose Rago