This is an unofficial, fan-made web application developed to mimic the attributes and skills page from the critically-acclaimed RPG called Disco Elysium. You can use this app to edit a visual mimic of the player's stats.

I hope players of the game find this app to be fun to use, and that it inspires more people to play the game.

You can visit the live version of this app here.

The features listed below were implemented to replicate Disco Elysium's attributes/skills page as close as possible:

Attributes

• Each of the attributes (Intellect, Psyche, Physique and Motorics) can be leveled up, though they cannot go below 1.
• The skills in the same container as the attribute are modified by the attribute score — for example, if Intellect is 3, then all Intellect skills will have a +3 modifier applied.

Skills

• The score for each skill can be found on the bottom right of its portrait.
• Each of the skills represent character traits and can be leveled up.
• Each skill appears with a grayscale filter until it is leveled up.

Signature Skill

• You can choose one of the skills as your "signature skill", giving it a crown icon and a +1 modifier.

Here are the technologies used to build this app:

• Next.js
• React.js
• Redux
• TypeScript
• Tailwind CSS

Although it was not necessary to use Redux or Next.js for this project, and it would have been just as possible to develop the project using only React.js and useState hooks, I wanted to take this as an opportunity to familiarize myself with Next.js, TypeScript, and Redux.

If you are planning to work on a project with a similar scope, remember that Redux is most practically used for large projects and teams — prioritize learning the fundamentals first.