Opening Knowledge - Stardance

Ship #1

@stashm10 on Opening Knowledge · 1 day ago

I made a fun chess game, specifically, a chess opening game, Chession. How it works is simple. A position from a famous chess opening is shown on the board, and you have to guess which opening it is. The opening is selected from a list of 25, and the board renders the position after move 10 (20 plies). You type a guess or pick from a list that filters as you type. If your guess is wrong, the board steps back two plies (one full move) and shows an earlier position as a hint. You get 5 guesses total. Each wrong guess reveals more of the position's history, making the next guess easier.

The cool part is that there are so many openings (well, 25 for now), so you can have multiple attempts. Unlike Wordle or other guessing games, you dont have to wait 24 hours to play.

It was difficult setting up the chess board, the pieces, and piece animation, however I made it work. The trickiest part was animating between positions when going back, since each wrong guess jumps the board back two plies rather than one. I solved this by stepping through each half-move individually and animating the piece slide for every step, rather than animating directly from the start position to the end position. This keeps the motion readable even when skipping multiple moves.

I hope in the future I can add more openings, and vartions of popular openings, that way I can make it more difficult :)

The idea is just a simple game for all types of chess players, a chess version of Wordle... if that makes sense.

Enjoy!

1 devlog
2h

Try project → See source code →

Open comments for this post

@stashm10 on Opening Knowledge · 1 day ago

2h 12m 56s logged

Chession

Devlog #1

I built a chess opening guessing game.

The idea: a position from a famous chess opening is shown on the board, and you have to guess which opening it is.

How it works
A random opening is selected from a list of 25, and the board renders the position after move 10 (20 plies). You type a guess or pick from a list that filters as you type. If your guess is wrong, the board steps back one move (one move for black and one move for white) and shows an earlier position as a hint. You get 5 guesses total. Each wrong guess reveals more of the position’s history, making the next guess easier.

What I’ve built so far

Static board rendering using FEN-style positions generated from chess.js

Move validation and position-building logic using chess.js

-An animated piece-slide transition when navigating between hint positions, instead of just snapping
Autocomplete with keyboard navigation (arrow keys, enter to select)

-A guess history display showing correct/wrong attempts

-Navigation buttons (and arrow keys) to move between all hint positions you’ve unlocked, not just the latest one

-A welcome modal explaining the rules
A reload-confirmation dialog so accidental refreshes don’t wipe progress mid-game

Animating the hints
The trickiest part was animating between positions when going back, since each wrong guess jumps the board back two plies rather than one. I solved this by stepping through each half-move individually and animating the piece slide for every step, rather than animating directly from the start position to the end position. This keeps the motion readable even when skipping multiple moves.

What’s next
I want to expand from 25 openings to 100+, including variations of openings that are already in the game (e.g. multiple lines within the Sicilian Defense, not just one).

I also think the hinting system could be reworked. Stepping back through earlier moves might be too easy a hint, since recognizable patterns persist even a few moves back. I’m considering alternatives, like instead revealing partial information (e.g. only the pawn structure, or only the piece types without full positions) rather than rewinding the whole position.

In short, this is a very rough draft, and simply a fun project for me. If anyone here knows chess and has any ideas or comments, please let me know. Thanks!!

live at: https://stashm10.github.io/Chession/