JavaScript learning project
The Pig Game
A two-player dice game about when to keep rolling and when to hold. A compact exercise in connecting rules, state and visual feedback.
- Role
- JavaScript implementation
- Stack
- HTML · CSS · JavaScript
- Focus
- Rules & application state
- Year
- 2024
The brief
Translate a turn-based game into a dependable interface. The current player, temporary score and accumulated scores must stay in agreement with every roll, hold and restart.
A JavaScript learning project. The gallery preserves the original gameplay image; additional device captures are not available.
Design decisions
Explicit state changes
Rolling changes the turn score, holding banks it, and restarting returns the game to its initial state. Keeping those operations distinct makes the rules easier to follow in the code.
Make the turn visible
The active-player treatment, die image and score displays give immediate feedback. A player can see both what changed and whose decision comes next.
What I learned
A small game is a useful test of event handling and conditional logic. The screen must reflect the current state after every action, including the end of a game and a fresh start.
A useful next iteration
Add explicit tests for turn changes, score resets and winning states, then revisit keyboard access and small-screen play. The original demo remains available as a record of the learning project.