Case Study/Shopify Rebellion

mockup of macbook and iphone showcasing the shopify website
mockup of macbook and iphone showcasing the shopify website

Website Revamp for Shopify's E-Sports Team - Case Study

Brief

Shopify Rebellion is Shopify's official esports organization. What began as a small team with just three players and one manager rapidly expanded into a multi-division esports powerhouse with dedicated teams competing in Rocket League, Starcraft, Valorant, and Halo. This growth created the need for a more sophisticated web presence that could properly showcase their expanding roster and competitive achievements.

Challenge

Shopify Rebellion's original website was severely limiting their online presence as they scaled. The site was restricted to a single page design that couldn't accommodate their growing number of teams and players. Technical issues were prevalent, including a poorly designed navigation menu that overlapped with text content. The site lacked accessibility features, offering only a dark mode with no alternative viewing options, and provided a frustrating experience for mobile users—a significant portion of their gaming audience.

before screenshot - website mockup

Solution

We stepped into the project, taking over both design and development responsibilities. Our comprehensive approach included implementing a dark/light mode toggle to improve accessibility and user preference options. We developed dedicated team pages for each division (Rocket League, Starcraft, Valorant, and Halo) to properly showcase their growing roster. The navigation system was completely redesigned to eliminate overlapping issues and improve site architecture. We also enhanced the mobile experience with responsive design elements and established a continuous improvement cycle, delivering monthly updates and feature additions to keep pace with the organization's growth.

To complete this web development project, we used the following tech stack:

  • Shopify Liquid

  • Twitch API

  • JavaScript

  • HTML, CSS

website mockup - wireframe designs

Result

The transformed website now properly reflects Shopify Rebellion's status as a premier esports organization. The addition of dark/light viewing modes significantly improved accessibility for all users. The expanded site architecture with dedicated team pages allows fans to easily find information about their favorite players, complete with professional photos, real names, gamer tags, and integrated social media profiles. The redesigned header and footer menus provide intuitive navigation throughout the site. The mobile-friendly design ensures fans can stay connected with Rebellion teams regardless of device, supporting the organization's continued growth and fan engagement across multiple esports divisions.

after screenshot - website mockup

Biz Owner

Ready To Improve Your Website Results?

Book a free strategy call to see how we can help.

Biz Owner

Ready To Improve Your Website Results?

Book a free strategy call to see how we can help.

Biz Owner

Ready To Improve Your Website Results?

Book a free strategy call to see how we can help.

Other Projects

mockup of computer and phone - showcasing ecommerce shopify project

3x revenue boost for glassware company

See Case Study

We helped Remark Glass triple their conversions by redesigning their website and focus on user experience and conversion rate optimization. Plus we made it easy for their non-technical team to manage, so they don't have to rely on us for content changes.

mockup of computer and phone - showcasing ecommerce shopify project

3x revenue boost for glassware company

See Case Study

We helped Remark Glass triple their conversions by redesigning their website and focus on user experience and conversion rate optimization. Plus we made it easy for their non-technical team to manage, so they don't have to rely on us for content changes.

mockup of computer and phone - showcasing ecommerce shopify project

3x revenue boost for glassware company

See Case Study

We helped Remark Glass triple their conversions by redesigning their website and focus on user experience and conversion rate optimization. Plus we made it easy for their non-technical team to manage, so they don't have to rely on us for content changes.

mockup of computer and phone showcasing web design project

New brand for healthcare company

See Case Study

Revival Health and Wellness had extensive experience in healthcare space, but they didn’t have their own brand online. That’s where we came in. We helped them with their brand, logo, and website that included over 20 pages of content.

mockup of computer and phone showcasing web design project

New brand for healthcare company

See Case Study

Revival Health and Wellness had extensive experience in healthcare space, but they didn’t have their own brand online. That’s where we came in. We helped them with their brand, logo, and website that included over 20 pages of content.

mockup of computer and phone showcasing web design project

New brand for healthcare company

See Case Study

Revival Health and Wellness had extensive experience in healthcare space, but they didn’t have their own brand online. That’s where we came in. We helped them with their brand, logo, and website that included over 20 pages of content.

mockup of computer and phone showcasing the cleaning website

Fully booked cleaning company

See Case Study

Reset Cleaning was hesitant about getting a website because they doubted if it was worth it. But within a couple of months after the website launch, they added thousands of dollars to monthly recurring revenue. Their new business problem is hiring help because they are overwhelmed with work.

mockup of computer and phone showcasing the cleaning website

Fully booked cleaning company

See Case Study

Reset Cleaning was hesitant about getting a website because they doubted if it was worth it. But within a couple of months after the website launch, they added thousands of dollars to monthly recurring revenue. Their new business problem is hiring help because they are overwhelmed with work.

mockup of computer and phone showcasing the cleaning website

Fully booked cleaning company

See Case Study

Reset Cleaning was hesitant about getting a website because they doubted if it was worth it. But within a couple of months after the website launch, they added thousands of dollars to monthly recurring revenue. Their new business problem is hiring help because they are overwhelmed with work.

mockup of macbook and iphone of webflow website for law firm

New law firm builds online trust

See Case Study

When Hedrick Law was starting their own practice, they knew they needed an online presence. But they didn't have the know-how or the time to create their website. We helped them build a site that showcases their expertise and positions them as a trusted law firm.

mockup of macbook and iphone of webflow website for law firm

New law firm builds online trust

See Case Study

When Hedrick Law was starting their own practice, they knew they needed an online presence. But they didn't have the know-how or the time to create their website. We helped them build a site that showcases their expertise and positions them as a trusted law firm.

mockup of macbook and iphone of webflow website for law firm

New law firm builds online trust

See Case Study

When Hedrick Law was starting their own practice, they knew they needed an online presence. But they didn't have the know-how or the time to create their website. We helped them build a site that showcases their expertise and positions them as a trusted law firm.

mockup of macbook and iphone showcasing prepory custom form

Multistep form for consulting website

See Case Study

Prepory is a college admissions consulting firm that helps students navigate the college application process. We helped them with a custom web application feature to streamline the inquiry process.

mockup of macbook and iphone showcasing prepory custom form

Multistep form for consulting website

See Case Study

Prepory is a college admissions consulting firm that helps students navigate the college application process. We helped them with a custom web application feature to streamline the inquiry process.

mockup of macbook and iphone showcasing prepory custom form

Multistep form for consulting website

See Case Study

Prepory is a college admissions consulting firm that helps students navigate the college application process. We helped them with a custom web application feature to streamline the inquiry process.

mockup of macbook and iphone showcasing barbershop website

Custom barbershop website

See Case Study

We helped The Gentlemen's Barbershop revamp their online presence with a professional website that helped them attract new clients.

mockup of macbook and iphone showcasing barbershop website

Custom barbershop website

See Case Study

We helped The Gentlemen's Barbershop revamp their online presence with a professional website that helped them attract new clients.

mockup of macbook and iphone showcasing barbershop website

Custom barbershop website

See Case Study

We helped The Gentlemen's Barbershop revamp their online presence with a professional website that helped them attract new clients.

mockup of macbook and iphone showcasing website for ecom fashion brand

Custom website for fashion brand

See Case Study

Hommewrk launched a new sneaker brand in partnership with Saucony. We helped them by designing a custom website and developing it on Shopify.

mockup of macbook and iphone showcasing website for ecom fashion brand

Custom website for fashion brand

See Case Study

Hommewrk launched a new sneaker brand in partnership with Saucony. We helped them by designing a custom website and developing it on Shopify.

mockup of macbook and iphone showcasing website for ecom fashion brand

Custom website for fashion brand

See Case Study

Hommewrk launched a new sneaker brand in partnership with Saucony. We helped them by designing a custom website and developing it on Shopify.