Four in a Row - Connect 4 Classic Board Game

Seele01-Flash
By
Four in a Row is the classic Connect 4 strategy game where players take turns dropping colored checkers to connect four pieces in a row. Play for free online against friends or computer AI.

Prompt

MODEL: Seele01-Flash
Please use Three.js to generate a **mobile-first game** with the theme "**Classic 3D Four in a Row**". Please read the following detailed game design requirements first, and then generate the code accordingly: ### 1. Assets & Environment * **Visual Style:** A polished, semi-realistic 3D aesthetic similar to a high-quality physical plastic board game. The camera should be positioned in a fixed perspective (slightly angled top-down or direct front view with a slight perspective tilt) to clearly show the 7x6 grid. * **Board Model:** A glossy blue vertical board with circular cutouts. It should look like molded plastic with slight bevels around the holes to catch light. * **Game Pieces (Chips):** Distinct Red and Yellow discs. They should have a simple indented pattern or ridges on the face (like a poker chip) to add texture depth. * **Lighting:** Soft, studio-style lighting with a key light from the top-left to create subtle shadows inside the empty slots and distinct specular highlights on the plastic surfaces. * **Background:** A blurred, neutral room environment or a soft gradient background (e.g., warm beige or cool grey) to keep the focus entirely on the blue board. * **Optimization:** Use low-poly cylinders for the chips and simple geometry for the board. Use `MeshStandardMaterial` for realistic plastic reflection but keep shadow map resolution moderate for mobile performance. ### 2. Audio Requirements * **BGM:** A light, jazzy, or "elevator style" acoustic track. It should be relaxing and unobtrusive, encouraging thinking. * **SFX - Chip Drop:** A satisfying "clack" or plastic impact sound when a chip lands in its slot. If a chip falls on top of another, the sound should be slightly higher pitched. * **SFX - UI:** Soft "pop" or "click" sounds for menu buttons (Restart, Pause). * **SFX - Win:** A cheerful jingle or applause sound when a player connects four. * **SFX - Turn Indicator:** A subtle "whoosh" or soft chime to indicate whose turn it is. ### 3. Gameplay Loop * **Core Mechanic:** Standard Connect 4 rules. The game takes place on a 7-column x 6-row vertical grid. * **Turn-Based System:** * **Player 1 (Red)** vs **Player 2 (Yellow)** (or AI). * Players alternate turns. * A player selects a *column*, and the chip physically falls to the lowest available empty slot in that column (simulate gravity animation). * **Win Condition:** The first player to align four chips of their color either horizontally, vertically, or diagonally wins. * **Draw Condition:** If the board fills up completely (42 chips) without a winner, the game ends in a draw. * **End Game:** When a win is detected, highlight the four winning chips (e.g., make them glow or pulse) and display a "Player [Color] Wins!" modal overlay with a "Play Again" button. ### 4. Mobile Controls & Interaction * **Screen Orientation:** Portrait mode is preferred for mobile to maximize the vertical board visibility, but the layout should be responsive to fit width. * **Touch Controls:** * **Column Selection:** Instead of clicking specific slots, the user taps anywhere within a vertical column's touch zone to drop a piece. * **Phantom Piece (Hover):** If the user touches and holds (drags) across the top, show a semi-transparent "ghost" chip above the column to indicate where the piece will drop. The drop happens on `touchend`. * **UI/UX:** * Display a prominent "Current Turn" indicator (e.g., a large Red or Yellow circle at the top or bottom of the screen). * **Restart Button:** Place a clearly visible Refresh/Restart icon in the top corner (min size 44x44px). * **Feedback:** * **Haptic:** Trigger a light vibration (haptic feedback) when the chip hits the bottom of the board. * **Visual:** A subtle screen shake or board bounce animation when a heavy stack of chips lands. Do not ask for clarification. Do not request confirmation. Directly execute the generation task based on the given instructions.

Game Introduction

About the Game

Four in a Row is the beloved classic strategy game also known as Connect 4 or Connect Four. This timeless board game challenges players to be the first to connect four of their colored checkers in a row - horizontally, vertically, or diagonally. With its simple rules but deep strategic gameplay, Four in a Row has entertained families and strategy enthusiasts for generations.

The game features a vertical grid where players take turns dropping their colored checkers (typically red and yellow) from the top. Gravity pulls the pieces down to the lowest available space in each column, creating an exciting tactical challenge where every move matters.

Core Features

Classic Strategic Gameplay

Experience the pure strategy of the original Connect 4 game with authentic rules and mechanics. Plan your moves carefully while anticipating your opponent's strategy.

Multiple Game Modes

  • Two Player Mode : Challenge friends locally on the same device
  • AI Opponent : Practice against computer opponents with different difficulty levels
  • Online Multiplayer : Connect with players worldwide for competitive matches

Perfect for All Ages

Four in a Row is easy to learn but challenging to master, making it perfect for: - Children learning strategic thinking - Families seeking quality time together - Adults who enjoy tactical board games - Anyone wanting a quick mental challenge

Cross-Platform Compatibility

Play seamlessly across all devices - desktop computers, tablets, and smartphones. The game automatically adapts to your screen size for optimal gameplay experience.

How to Play

Basic Rules

  1. Take Turns : Players alternate dropping their colored checkers into the grid columns
  2. Gravity Effect : Pieces fall to the lowest available position in each column
  3. Win Condition : Be the first to connect four of your pieces in a row (horizontal, vertical, or diagonal)
  4. Draw : If the grid fills completely with no winner, the game ends in a tie

Strategy Tips

  • Control the Center : The middle columns offer more winning opportunities
  • Think Ahead : Plan multiple moves in advance and anticipate opponent responses
  • Block Opponents : Watch for their potential winning moves and block them
  • Create Multiple Threats : Set up situations where you can win in multiple ways

Game Controls

  • Mouse/Touch : Click or tap on any column to drop your checker
  • Visual Indicators : Hover effects show where your piece will land
  • Game Status : Clear display shows whose turn it is and game results

Why Play Four in a Row

Mental Exercise

This classic game provides excellent brain training, improving: - Strategic planning abilities - Pattern recognition skills - Critical thinking development - Spatial awareness enhancement

Social Connection

Whether playing with family members, friends, or online opponents, Four in a Row creates meaningful social interactions and friendly competition.

Instant Accessibility

  • No Download Required : Play immediately in your web browser
  • 100% Free : Enjoy unlimited games without any cost
  • Quick Sessions : Perfect for short breaks or extended play sessions
  • Educational Value : Great tool for teaching strategy and logical thinking

Nostalgic Appeal

Relive childhood memories or introduce younger generations to this timeless classic that has remained popular across decades.

Frequently Asked Questions (FAQ)