Artificial Intelligence in Game Development- Tic Tac Toe AI

Video description

The author made this course as easy to understand as possible. The author structured it in such a way that each section will handle one major part of the course.

Introduction: This is where we'll explain how the game works, it's various features and what we'll be using to achieve the same results.

Module 1: We'll explain the basics of artificial intelligence and it's various terminologies. We'll put the ground work you'll need to understand the further concepts explained in this course.

Module 2: We'll explain what the MiniMax alrogithm is and how it's implemented. We'll use pictorical and graphical representation to explain the concept with 2 detailed examples. We'll also explain the Pseudocode of the algorithm.

Module 3: We'll explain how the MiniMax algorithm can be implemented in creating an artificial intelligence based player (computer player) for a Tic Tac Toe game. We'll explain the concept with another pictorial representation of the entire process.

Module 4: We'll delve into Javascript and HTML5 canvas concepts that are related to the project we'll be creating.

Module 5: We'll be teaching you how to create the bare bones of the app with HTML5. The result will be a page with all the elements we need in our game, devoid any colors or design elements. After that, we'll "beautify" our app. We'll be using CSS elements to give our game colors and styles. At the end of this module, we'll have a Tic Tac Toe web game that'll look like the final result, albeit one that is not playable yet.

Module 6: We'll introduce a step by step algorithm that explains what we'll be doing while creating the Javascript part of our code.

Module 7: We'll be delving into Javascript & HTML5 canvas code of our game in this module, and we'll teach you how to make the game playable (let the user draw on the canvas and display the game results) in here. In this part, we'll create the necessary code to make the human player play the game on the app.

Module 8: This would be the meat of the course. In this module, we'll be applying the MiniMax algorithm with relevant Javascript code to create an artificial intelligence that can play against the human player (the web user).

What You Will Learn

  • Create a complete dynamic Tic Tac Toe game app with an unbeatable AI with Javascript, HTML5 canvas and CSS
  • Improve your web app development, web game development & javascript skills
  • Improve your front end design and development skills
  • How to design the game logic for the game and implement it as code
  • Learn HTML5, CSS3 and much more while developing your game
  • Add artificial intelligent to your resume with this project as proof of your knowledge

Audience

This course is for programmers who want to get into artificial intelligence. Web developers and programmers who want to add artificial intelligence to their websites, software, and apps.

About The Author

Aarthi Elumalai: Aarthi Elumalai is the founder of DigiFisk. At DigiFisk, they aim to make programming fun and interactive. If you are tired of endless theories, you have come to the right place. Starting with beginner-level courses in any programming language or field, they guide you to advance with several real-world project-based classes to equip you to thrive in the real world. Their lectures tend to be detailed and leave nothing out, so beginners and advanced programmers alike can learn something from each course. Be sure to enjoy your journey into the fascinating world of programming with DigiFisk.

Table of contents

  1. Chapter 1 : Introduction
    1. Introduction
  2. Chapter 2 : Artificial intelligence basic terms explanation
    1. Artificial intelligence - an introduction
    2. What is an AI on intelligence
    3. Intelligent agents
    4. Driving problem
    5. Floor cleaning problem
    6. Types of environment
    7. Types of environment part 2
  3. Chapter 3 : MiniMax algorithm explanation + Pseudocode
    1. What is MiniMax?
    2. Technicalities MiniMax tree
    3. MiniMax number game
    4. MiniMax number game part 2
    5. Win, lose, draw example
    6. Win, lose, draw example part 2
    7. Win, lose, draw example part 3
    8. Technicalities Terms used in the algorithm
    9. MiniMax Pseudocode
  4. Chapter 4 : MiniMax for Tic Tac Toe - Explanation + Pseudocode
    1. MiniMax algorithm for the Tic Tac Toe game
    2. MiniMax algorithm for the Tic Tac Toe game part 2
  5. Chapter 5 : HTML and CSS code with explanation for the game
    1. Create skeleton of the HTML5 code
    2. Meta tags of the HTML5 code
    3. Create the header and the result heading
    4. Create the game and rule sections' skeletons
    5. Create the game canvases and new game button
    6. Create the rules section's paragraphs and heading
    7. Connect HTML and CSS files
    8. Set background and more on colors
    9. Set default styles and style the header
    10. Style the headings
    11. Style the canvases
    12. Style the entire game area
    13. Style the Divs that hold the canvases and rules area
    14. Style the paragraphs and headings
      1. Style the New Game button
      2. Create hover effects on the canvases and new game button
      3. Design enhancements to the game part 1
      4. Design enhancements to the game part 2
      5. Design enhancements to the game part 3
    15. Chapter 6 : [OPTIONAL] JavaScript HTML5 Canvas Basic Concepts (related to this project)
      1. Connecting HTML and script/JS files
      2. An introduction to variables and assigning values
      3. Mathematical operators and alerts
      4. Conditional statements - if else statement
      5. Conditional statements - Switch case
      6. Loops - For loop
      7. Arrays - 1 dimensional arrays
      8. Arrays - 2 dimensional arrays
      9. An introduction to functions (function definition and calls)
      10. Intro to DOM - getElementById and InnerText
      11. Intro to DOM - adding click events to buttons
      12. JavaScript Objects part 1
      13. JavaScript Objects part 2
      14. JavaScript Objects part 3
      15. Step 1 2 - Getting the canvas and creating the drawing object
      16. Drawing a line (also explanation on canvas dimensions and pixel points)
      17. Drawing coloring a shape with poly lines (a path)
      18. Drawing coloring a circle and arcs
    16. Chapter 7 : Step by step algorithm for the JavaScript code
      1. Step by step algorithm for the JavaScript code part 1
      2. Step by step algorithm for the JavaScript code part 2
    17. Chapter 8 : Coding the Tic Tac Toe AI in JavaScript
      1. Window onload function
      2. Initial states
      3. Initial states part 2
      4. Initial states part 3
      5. Making the new game button work
      6. Canvas click event + retrieving the clicked box's number
      7. Drawing the X
      8. Drawing the O
      9. Winner check function
      10. Box click function - code to let the human player play
      11. Box click function - code to let the human player play part 2
      12. Box click function - code to let the human player play part 3
    18. Chapter 9 : MiniMax algorithm in JavaScript
      1. Finding the empty boxes
      2. Making the AI play
      3. Making the AI play part 2
      4. Applying the MiniMax algorithm
      5. Applying the MiniMax algorithm - terminal tests
      6. Applying the MiniMax algorithm - recurring conditions
      7. Applying the MiniMax algorithm - recurring conditions part 2
      8. Applying the MiniMax algorithm - working out an example
      9. Applying the MiniMax algorithm - calculate scores of intermediate states
      10. Applying the MiniMax algorithm - calculate scores of intermediate states part 2
      11. Analyzing the final output

Product information

  • Title: Artificial Intelligence in Game Development- Tic Tac Toe AI
  • Author(s): Aarthi Elumalai
  • Release date: February 2019
  • Publisher(s): Packt Publishing
  • ISBN: 9781838644772