Tapatan
Tapatan
YAY!
Player 1 wins!
What is Tapatan?
Tapatan is a two-player strategy game played on a 3x 3 grid. While it bears a surface-level resemblance to Tic-Tac-Toe, it is significantly more complex because the game does not end once all pieces are placed. Instead, it enters a dynamic "movement phase" where pieces are shifted across the board until someone secures a three-in-a-row alignment.
Technical Highlights of Version 0.1
The version provided in the code, titled Tapatan Pro, features several modern web enhancements:
Responsive Design: Built using Tailwind CSS, the game scales perfectly for mobile and desktop play.
Dual Game Modes: Players can choose between Vs Robot 🤖 (an AI with heuristic logic) or Vs Friend 👦👧 (local multiplayer).
Animated UI: The game uses CSS animations for "floating" selected pieces and bouncy transitions, giving it a polished, tactile feel.
Heuristic AI: The built-in "Robot" doesn't just move randomly; it calculates winning moves, blocks the player from winning, and prioritizes the center node.
How to Play: A Step-by-Step Guide
The game is won by being the first to align three pieces in a straight line (horizontally, vertically, or diagonally).
Phase 1: The Drop Phase
At the start of the game, each player has three pieces in their inventory.
Turn-Based Placement: Player 1 (Red Circle) and Player 2/Robot (Green Square) take turns clicking on any of the 9 empty nodes on the grid.
Strategy: In this phase, your goal is to set up a win or, more importantly, prevent your opponent from getting three-in-a-row immediately.
Completion: Once all 6 pieces (3 for each player) are on the board, the game automatically switches to the Move Phase.
Phase 2: The Move Phase
This is where the real strategy begins. If no one won during the Drop Phase, the game continues:
Selecting a Piece: Click on one of your pieces to select it. It will start to "float" to indicate it is active.
Sliding: You can move your selected piece to any adjacent empty node connected by a line.
Adjacency Rules:
The Center Node is the most powerful because it connects to all other 8 nodes.
Corner Nodes connect to three other nodes (two edges and one diagonal).
Side Nodes connect to three other nodes (two edges and the center).
Drag and Drop: In this 0.1 version, you can also drag your piece directly to a valid node for a more fluid experience.
Winning Combinations
To win, you must occupy one of the following eight lines:
| Type | Combination Nodes |
| Horizontal | Top Row, Middle Row, or Bottom Row |
| Vertical | Left Column, Middle Column, or Right Column |
| Diagonal | Top-Left to Bottom-Right, or Top-Right to Bottom-Left |
Strategy Tips for Beginners
Control the Center: The middle node (Node 4) is the "king" of the board. Holding this spot gives you the most movement options and allows you to block almost any win attempt by your opponent.
Don't Get Trapped: In the Move Phase, it is possible to be "locked in" if all adjacent nodes to your pieces are occupied by your opponent.
The "L" Formation: Try to position your pieces in an "L" shape during the drop phase. This often creates multiple potential paths to a win, making it harder for the AI or a friend to block you.
Patience is Key: Since pieces are never removed from the board, Tapatan can sometimes result in a long tactical battle. Look for ways to force your opponent to move away from a node they need to defend.
