Pregame

Created during the Riot Games API Hackathon 2018. An electron overlay window for the League of Legends Champion Selection that displays patch notes and champion statistics.

For the 2018 Riot Games Hackathon (36 hour time limit), my team and I made an overlay tool for the League of Legends champion select screen to show off three informational pieces: Champion ability/passive tooltips, recent patch notes on champion stats/abilities, and an enemy champion counter pick alert.

   1. Champion Ability/Passive Tooltips: We added icons for all currently selected champion abilities/passives; hovering over them shows a tooltip so that you can read up on everyone's champions in the lobby. This is nice for new and veteran players alike to read up on champions without having to leave the game client.

   2. Recent Patch Notes: We scraped the (then) four most recent patch notes and added colored borders around the champion abilities/passives. Green borders denote buffs, red are nerfs, and yellow are adjustments (reworks, bug fix, power redistribution, etc.). Hovering over these icon shows the recent patch note changes below the ability description.

   3. Champion Counter Pick Alert: Lastly (and as a stretch goal for our limited time), we added a warning indicator next to your team's champions if the enemy had one of their top 8 counters (based on general winrate from lolalytics). This part will need extra consideration, though, as providing information like champion counters can improperly discourage player innovation in creating team compositions, and we didn't have time to fully explore the ramifications. Our goal for this part of the project is to simply help you make a more informed decision, especially if you are a newer player and want some guidance on champions that tend to preform strongly against yours.

We built the application from scratch using Electron and the LCU API (to interface with the LCU API we used the library Rift Explorer), both of which none of our members had experience with before the hackathon. It was hard-coded to support just the one resolution for demo purposes at the hackathon, but we hope to add in a resolution selector for you to pick your own screen's resolution.

The thing we are most excited about is that, due to it being a stand-alone overlay that allows users to manually toggle it on and off, the application itself is compliant with Riot's rules and could be publicly released upon its completion - one of our highest priorities! And since we used Electron, it's compatible with Mac, Windows, and Linux - whatever platform you play League on.