I Built an App for the Overwatch League Community

Aman Jaiman
6 min readJan 17, 2022

--

OWL Grand Finals 2018

If you aren’t familiar with the Overwatch League (OWL), it’s the official Esports league for the game Overwatch. It’s the first video game I really got into, and it was all thanks to staying at home during the pandemic. And ever since I started watching the league, it was just another sport for me to get hooked onto.

If you know me, you know I love working with technology in areas of interest to me. I’ve dabbled in political research with NLP, analyzed NFL data, but now that I got into Esports, I kept looking for any side project I could do.

Well after watching two weeks of Season 4 of the Overwatch League, I finally had my idea.

See, the Overwatch League runs in tournament cycles. Each tournament, teams play four qualifying matches. Then based on their ranking, half the teams go into a knockout bracket before a final double elimination bracket to crown a tournament champion.

As someone who loves playing with hypotheticals, I always wonder, “What’ll happen if so-and-so team wins this game? And what if the score is 3–1 instead of 3–2?” And after watching one of my favorite teams, the Atlanta Reign, go 0–2 in their first matches, I thought to myself, “How can they make the knockouts?”

The options:

  • I make an excel spreadsheet and test out a bunch of results in hundreds of cells
  • I build a new web app where you can test out results and get instant ranking updates

Obviously the choice was clear.

Actually, before the season even started I created another app: OWL Pick’em. It was supposed to be like any other sports Pick’em app, but the Overwatch League didn’t have one… until the day I launched my app. That’s right, we launched on the same day. So naturally my app faded into the background after getting a few hundred signups, but it was still a cool experience nonetheless.

The Stack

Since I’d used Django for the OWL Pick’em website, I decided to work with it again for the backend of this website. There wouldn’t be much data to handle: just the team data (logo, name, etc.), and the games (teams, date, score, etc.). The data was stored in a PostgreSQL database.

For the frontend, I realized I had to learn something new. In the past, all of my web dev had been done in ASP.NET (which I still love), and I hadn’t really worked with dynamically changing elements on a webpage. I was between React and Vue, but settled with React since one of my roommates had worked with it before and recommended it. I also used Bootstrap for frontend styles and Javascript.

Deployment was done using Heroku. To be completely honest I would’ve gone with Azure or AWS, but since I really needed to rush the project I went with the option that seemed to have the smallest barrier to entry. I found a “Deploy your Django+React app on Heroku” guide and rolled with it.

Time Crunch

I came up with the idea right after the matches finished for Week 2 on Sunday. Since Week 3 was the last week of qualifiers for the first tournament, and it started on the following Friday, I only had four days to finish this website unless I wanted to delay the launch by another 3-ish weeks.

So what’d I do? Well I didn’t want to do school work anyway, so my schedule for the next 4 days looked like this:

  • 10:00am: Wake up
  • 11:00am: Start working
  • 4:00am: Sleep

Seems like hell, but man was it fun. Shout out to my roommates for cooking food for me that week. And yes, I did shower, don’t worry.

I think I finally wrapped everything up just before the games on Friday started. I didn’t have a custom URL yet, and there were a few things on the website that aesthetically looked poor, so I decided to wait until the next tournament (June Joust) to post about the website. I used the games that week to test all the logic for the website and got a custom URL.

Introducing: OWL Standings!

As you put in scores on the right panel, the standings on the left updates in real time.

The Launch was a Success

The week that the June Joust was slated to start, I made a post on r/CompetitiveOverwatch about the site, which was pretty well received. I also tweeted it out and got much greater traction than I thought when Mitch “Uber” Leslie, a caster for OWL, retweeted it! It was exciting to see the viewers and usage stats climb in such short time.

I’ll admit, I was being a bit annoying by telling a bunch of other folks at OWL about my website. Most people didn’t get back to me, not surprising, but I did hear back from a few people at OWL saying they were using my website internally. Pretty sweet.

I also started making weekly posts of the tournament rankings on r/CompetitiveOverwatch, since the official OWL website and app had no way to view the tournament rankings. I believe they added the feature near the end of the season, maybe after looking at my site 😛.

Then finally I got my big break during the third tournament, the Summer Showdown. The usually elite San Francisco Shock were struggling. At 2–2 and no more games to play, they were on the verge of being knocked out of the tournament.

I had previously reached out to Cory, VP of the Shock, about OWL Standings, but I was still surprised to hear that they wanted to use it. They wanted to make a social media post about how the Shock could still make it to the knockouts of the Summer Showdown, and wanted me to use my website to figure it out. Sadly, the Shock missed out on the knockouts anyway, but we did make a kickass social media post.

In the last tournament, I worked with the Shock once again to make their playoff scenarios post. The website also received two shoutouts on the Plat Chat Podcast; it was cool to see analysts using the website live. Overall, the website was used by thousands of fans around the world.

The Plat Chat Podcast

Outcomes

The final result: an amazing experience and weeks of school work to make up. I was able to learn a new tech stack, deployed my first app to the public, and saw it being used by thousands of people, even within the league. It also made me more passionate about Esports, especially seeing how it could bring people across the world together. During my internship at Microsoft, I was able to show the Esports team the website I had created, and they loved it. Moving forward, I actually requested a team change to the Esports team at Microsoft.

I also had the chance to meet so many cool people in the Overwatch League community through making and promoting the site. And speaking of the Overwatch League community, we’re working on another community app for this upcoming season 👀 so stay tuned for that.

Thanks for reading! I’d love to hear what you thought about this post! Send any questions or comments to amanjaiman@outlook.com.

--

--

Aman Jaiman

CS Grad Student @ UMD | Incoming MSFTie | Data Enthusiast