Ian Lamb

Problem

Stolen Realm is a turn-based dungeon crawler RPG. One of my favourite things about the game is the deep, classless skill trees that allow for endless build combinations. There's a lot of satisfaction to be had just from playing around with them and figuring out what your next character build will be. As with many RPGs, the game interface can make it challenging to do this and many people also like to be able to share builds with their friends or get ideas from other people in the community.

Solution

This project aims to be a web-based replica of the in-game skill trees. The trees are mostly data-driven, based on a dataset I have in a spreadsheet which I convert to JSON and use directly in the project. All of the skill tooltips are as close of a match as I could get to what you see in the game client, including damage calculations.

Build Sharing

Sharing builds is as easy as copying and pasting the URL. I didn't want to have to store anything on a server, so build data is cleverly encoded into a query string parameter every time you make a change. When the app is loaded with a build in the URL, it unpacks it and displays the build exactly as it was when it was shared.

Technologies

This React app was bootstrapped with create-react-app and uses emotion for the styling system. It gets deployed to Github Pages as a static site. I also use SheetDB as a way of converting the spreadsheet data to JSON.