Skip to content

Latest commit

 

History

History
99 lines (69 loc) · 3.86 KB

README.md

File metadata and controls

99 lines (69 loc) · 3.86 KB

🎮 Tic-Tac-Toe

Welcome to the Tic-Tac-Toe game! This project features a modern and sleek UI, with two gameplay modes: Play against AI and Play with a Friend. The game is built using HTML, CSS, and JavaScript, offering a responsive and interactive experience.

✨ Features

  • 🎲 Single-Player Mode: Play against an unbeatable AI using the Minimax algorithm with heuristics to ensure optimal and fast decisions.
  • 👥 Two-Player Mode: Play with a friend and track player names.
  • 🖼️ Dynamic UI: Modern, responsive design with hover effects and animations.
  • 🎉 Endgame Popup: Displays the result of the game (win, lose, or draw) in a stylish popup with a restart option.
  • 🔄 Reset and Home Navigation: Easily reset the board without losing initial selections or navigate back to the home screen.

🤖 Algorithm

The game leverages the Minimax algorithm for its AI in single-player mode. The Minimax algorithm is a recursive strategy used in decision-making and game theory. It ensures that the AI makes optimal moves by simulating all possible game outcomes, minimizing the possible loss in a worst-case scenario.

To speed up the decision-making process, heuristics are applied to prune unnecessary branches in the decision tree, making the AI fast and efficient.

🌐 Live Demo

The game is hosted and can be played online at: Click To Play

🎮 Gameplay

Single-Player Mode

  1. Choose Your Symbol: Select X or O.
  2. Choose Who Goes First: Decide whether you or the AI makes the first move.
  3. Make Your Move: Play the game with visual feedback and AI moves.
  4. Endgame Popup: The result will be displayed in a popup when the game ends.

Two-Player Mode

  1. Enter Player Names: Customize your names or use the default (Player 1 and Player 2).
  2. Play the Game: Alternate turns and enjoy the hover effects showing whose turn it is.
  3. Endgame Popup: The result will be displayed in a popup when the game ends.

🗂️ Project Structure

📁 tic-tac-toe/
├── 📄 index.html      # Main HTML file
├── 📄 style.css       # Stylesheet for the game
└── 📄 script.js       # JavaScript logic for the game

🚀 How to Run the Project

  1. Clone the Repository: 
    git clone https://github.com/aminshahid573/Unbeatable-Tic-Tac-Toe.git
  2. Navigate to the Project Folder: 
    cd Unbeatable-Tic-Tac-Toe
  3. Open index.html in Your Browser: Just open the index.html file in your preferred browser and start playing!

🖼️ Screenshots

Home Screen

[Insert Image Here]

Gameplay Screen

[Insert Image Here]

Endgame Popup

[Insert Image Here]

🛠️ Technologies Used

  • HTML5: For structuring the content of the game.
  • CSS3: For styling, hover effects, and responsive design.
  • JavaScript: For game logic, AI implementation, and interactivity.

🔮 Future Improvements

  • Difficulty Levels: Add multiple difficulty settings for AI.
  • Score Tracking: Implement a scoreboard to track wins and losses.
  • Mobile Optimizations: Further improve the responsiveness for smaller devices.

🤝 Contributing

Contributions are welcome! If you’d like to improve this project, please fork the repository and submit a pull request.

  1. Fork the Project.
  2. Create your Feature Branch (git checkout -b feature/AmazingFeature).
  3. Commit your Changes (git commit -m 'Add some AmazingFeature').
  4. Push to the Branch (git push origin feature/AmazingFeature).
  5. Open a Pull Request.

📜 License

Distributed under the MIT License. See LICENSE for more information.

📧 Contact