The story of mood.gg: how in 4 months I went from knowing nothing about web development to 3 million hits and one of the most successful third-party League of Legends apps of all time

Farza
11 min readSep 14, 2017

--

Note: I’m going to be talking about this game called “League of Legends” a lot! If you’ve never played it before that’s fine. All you need to know for this post is that within the game the player can control a champion. The game features over 135 of these champions each with their own unique powers, histories, and personalities.

The most important part is not going insane.

I just wanted to give a little prelude here.

None of this was easy. It was all new territory. It was all really fucking hard to accomplish. I became obsessed with finishing.

At one point during development I was facing an issue that was taking me weeks to fix. My list of “bugs” and “new features” had grown to over 100 different things. On top of all this, I was getting emails from fans daily asking me “when the site would be up”. A combination of all this at once actually caused me to throw my MacBook on the ground really hard out of frustration/ fear of never finishing.

Thankfully, Apple makes a durable product so my laptop ended up being fine :).

Obsession with a project is an awesome power. On one hand it brings out dedication you didn’t even know you had from within you. On the other hand, it kills your brain and the project becomes all you ever thinking about. Burnout/insanity becomes very real and that’s what happened to me that day I threw my laptop.

I learned a lot from this project, apart from all the new technologies/ programing languages, about the importance of work ethic, consistency, and how to not go insane when working on something you’re very passionate about.

Hope you enjoy the story!

The Idea

Back in late 2016 (yes a very very long long time ago) I used to play a lot of League of Legends (I’m going to abbreviate it as LoL) since I had a ton of time and always had the habit of listening to my own music while playing the game. My playlist, made up of heavy metal, electro pop, and alternative rock, always kept me motivated no matter what I was doing, from cooking to working out.

real video of me jamming to my fav songs

At the time, college was easy, my tech internship was boring, and I was really looking for something new and creative to do. I wanted to take this idea of “motivating music” into the world of League of Legends but with a little twist. My goal was to build a playlist for every single champion in the game where all the songs would relate back to the champs’s theme, personality, and play style. This way when a person went to play a champion, they could also listen to that champions custom playlist to help them really get in the zone so they could truly feel like the champion they were playing.

Enter LeagueMood

A bit after I came up with this idea, I created a site called LeagueMood (which no longer exists) that I made really fast in 3 days for fun. It was an MVP. I had never done web dev before so it was a bit of an adventure. I pretty much took this starter express.js “Hello World” tutorial and then just slowly started adding features on to it. A button + some css here, an image there, and soon I had a functional page. Why did I choose a JS backend you ask? Well, because my friend told me “node.js is cool”.

Because I was learning about web dev while actually creating the website, it ended up being hella ugly and buggy. For example, if you didn’t view the site in fullscreen mode or if your monitor was to small the formatting of the page would be completely destroyed. You’d have the “next” button where the “contact” button was and it was all just a mess.

screenshot from the original, bad LeagueMood

LeagueMood was a very barebones version of my idea and it had custom playlists for 40 of the 136 champions in the game. The music for the site was made in collaboration with Reddit users /u/tylertoon2 and /u/aihonen. I was very lucky to discover these two because they had been working on a similar idea on/off for about a year. Without them I may have never kept pursuing the idea because it would mean I would have to make all the playlists myself. That would have been terrible because my music tastes weren’t nearly as diverse as theirs. But, not many people knew about their work because they just put their playlists on Spotify. I made LeagueMood to deliver their playlists in a more accessible package.

When I released LeagueMood it got a ton of traction on Reddit and I managed to get frontpage of r/leagueoflegends with 2.8k up votes which greatly surprised me considering how ugly/buggy it was.

original LeagueMood Reddit post.

On top of this, the site servers also crashed every 5 minutes because of a bug in my code (note: don’t use global variables on a node server). Turned out most people didn’t care about all this and really just really loved the idea of listening to music their favorite champ would listen to.

some comments from the LeagueMood Reddit post

While LeagueMood was really simple, I had implemented one very important feature: the ability for users to submit song suggestions for champions that had playlists and champions that didn’t have playlists.

I received over 9000 song suggestions from site users. Remember, LeagueMood only supported 40 of 136 champs. The goal was to build a site that supported all 136.

The Music

This was the hardest part of the entire project. I had to create a playlist for all 136 champions in the game and each champion’s playlist had to have 15–20 songs minimum. This means, I’d need at least 2040 songs. Luckily, I had over 9000 songs requests and 40 playlists from the original LeagueMood.

Then begun the process of actually going through all the song requests. Let me take you through some of my logic for actually choosing the music for a champion.

Above is a champion named Jinx. She is known as “The Loose Cannon” and is a psycho who lives to wreak havoc without a care in the world. Oh and that thing she’s putting on her back is giant rocket launcher/ mini-gun combo she named fishbones and pow-pow. So even if you didn’t know Jinx before, you now probably have a pretty good idea of what she’s like. The next thing I asked was, what kind of music would Jinx listen to? Then I would go through all her song requests from users as well as my own songs and try to figure out which songs would best fit her. Popular champions like Jinx actually had over 400 songs requests which made it a bit easier. I then repeated this process for every single champ. Here’s one song I chose for Jinx! Psycho, by Muse.

It took about 7 full days for me and two of my friends to create playlists for all the champions and to got through all 9000 requests. 7 days full of music, Red Bull, and headaches. It was actually a pretty fun experience but by the end of every single day we’d just be braindead. But we powered through!

The music team! Maru, Me, Dax (left to right)

Scrap LeagueMood, we need to do better!

While doing all the music stuff, I was also busy coding up the new site. Remember how disgusting/buggy LeagueMood was? Well, I threw all the code away. I learned a lot from making LeagueMood and but also made a ton of mistakes. I decided that I would learn from them and just start over. I also made this decision because the new site would be way more complicated.

I kept track of all the bugs and all my new ideas for features using GitHub Issues. At one point I had over 100 of these.

Some of the main features that I wanted were mostly inspired by feedback I got from Reddit and emails I received from fans.

  • A brand new song submission system that would also allow users to “vote” on songs submitted by other users with like/dislike system. This way I wouldn’t ever have to manually go through songs again and the site would grow on its own. I decided to store all this data using mongodb.
  • A downloadable desktop application built in Electron that would allow people to control the music while in game using special, custom keyboard commands.
  • A favoriting system that would allow users to easily go back to their favorite playlists. I used localStorage for this.
  • Development of a much cleaner UI with assets (buttons, logo, etc) created by an actual designer.

And another core idea I actually got from the two Reddit comments below. Why not try and support multiple games? Why constrain myself to just League?

old LeagueMood logo that was never used

I actually made the decision to support multiple games much later in development. I even had my new LeagueMood logo ready to go. Look how dope it looks!

But, things change. My designer was very mad at me (sorry, Awais) and we ended up having to do a whole new logo with a new name. I spent days thinking of a new name and went through every possibility like GameMood.com, MoodyGames.com, GamerMood.com, and I finally ended on mood.gg. I was actually surprised it was even available. I quickly bought the domain, got the new logo, and was almost ready to go!

Actually Making the Website + Desktop App

I’m going to skip all the tech-y things I did when developing this application and I may make that into a separate post one day. The main thing I wanted to talk about here is how I stayed sane when I had a giant list of GitHub Issues and a bunch of technologies I had to quickly learn to actually implement those features.

Here are Farza’s Top 3 Tips to Not Going Insane:

  1. Find someone to support you. A parent, a friend, a partner, anyone. You’ll find that having someone to relate with your issues or at least let you vent is extremely beneficial.
  2. Eat healthy, drink lots of water, and go to the gym. Your mind WILL NOT and CAN NOT work efficiently when you barely sleep and work off Red Bull. Don’t kill yourself.
  3. Stay consistent and work on a schedule. Even though this it’s just a personal project dedicate a specific time frame to the project ex. every Saturday 11AM-5PM. You’ll find that working on a project like this will help you stay focused and will prevent the project from taking over your life.

Enter mood.gg: Release Day and Going Viral

So, spoiler alert, I got everything done! Release day had arrived. I posted the site on r/leagueoflegends and actually had my post deleted and almost got banned because I had sent the post to my friends and one of them actually gave me gold. Apparently, sending your post to friends is against the rules (it isn’t)!

After begging the mods for forgiveness, they gave me a second chance and let me post the site again. Two days later, I had one of the highest up-voted posts of all time on the subreddit (18.6k upvotes) , 2.7k comments, and was gilded 3 times.

What really caught me off guard were compliments from some of my idols like Marc Merril, the founder of Riot Games. Just imagine how awesome I felt.

These three words from someone I respected so much made everything worth it. On top of that, all the positive comments and fan mail I received over the next week was amazing.

So here are the all-time user + pageview stats for the website:

Making/releasing such a successful application is every programmers dream. All those late nights and weekends dedicated to the project were worth it.

On top of all this, some people from Riot Games liked my site and I got the opportunity to tour Riot Games HQ and play some Leag-ue of Legends there! It was awesome how so many Rioters knew me! It was an absolutely breathtaking and unforgettable experience. I only have a few pictures since pictures weren’t allowed most places!

RIOT GAMES HQ WOOOOOO

Thanks for reading my story and feel free to follow me on Twitter. To end, I’m going to put a bunch of my favorite Reddit comments from the mood.gg post below :).

--

--

Farza

deep learning engineer. follow me on twitter @farzatv.