Distribution Permission
- Supporting website
Disclosures
Disclaimer
About this Workbook
- Links and References
- Workbook Content
- How to Read & Use this workbook:
- Viewing this eBook:
- Who should use this workbook?
Your newly obtained skills …
Game Design Resources
- Game Studio - Book Series
- Game Studio - Online Courses
- “Making Browser Games” - Books Series
- “Making Browser Games” Series - online Courses
- Programming Courses
- “Walk-Thru Tutorial” Series - Online Courses
- IMaking HTML5 Games
1Introduction to Game Design
- Approaching Game Development
- Focusing Your Game
- 1.1Game Genre Defined
- GG Interactive — Game Design Course
- 1.2Game Tools & Generators
- 1.3References From
2Standard Project Setup
- 2.1Standardized File Structure
- 2.2Barebones Set-up
- 2.3Web Server Required - Batteries not included!
3Starting a Game Project
- 3.1Step 0: Review your competition and their games
- Game Examples
- 3.2Step 1: Create your “front-door”
- 3.3Step 2. Create your “Game Shell” & Phases
- Critical Rendering Path
- Network Impact
- Gamer’s Local Activity
- D.R.Y. Speed Limit - 5 GPH (Games Per Hour)!
- 3.4Select a JS Format
- ES5 Format
- ES6+ Format as “FAT Arrow” Function
- ES6+ Format as “Phaser.Class”
- ES6+ Format as “Phaser.Scene”
- IIPart II: Making “Connect 4+” Browser Games
4Connect 4 — Core Game Construction
- 4.1Game Project Overview
- 4.2Our Goal
- 4.3Connect 4 Genre Description
- 4.4Historical background
- 4.5Game Mechanics (GM) - Logic & Rules
- Game Genre Commercial Components
- Rule Variations
- 4.6Game Mechanics (GM) - Data Structure
- 4.7Game Recipe™ Featured Ingredients
- Game Genre Components
- 4.8Design Considerations:
- Gameboard Development
- Game Disc-Tokens
- 2-player or “AI-bot”
- Using “AI Design”
- 4.9Doing the AI-thing!
- Sample Resources
- Deeper Dive: A.I. in Connect4 & Go
- 4.10Step 3: Create “Play.js”
- 4.11Step 4: Create Supporting functions.
- 4.12Conclusion
5Phaser v3.16+ Code Review
- 5.1
HUDRowinput Button functions - 5.2Creating the Game Grid
- 5.3Toggling Players’ Turn
- 5.4Game Over Testing
- Controller
- Horizontal Checks
- Diagonal Checks
- Vertical Checks
- 5.5HUD Banner Display
6Phaser v2.x.x Code Review
- 6.1Play.js Deconstruction
- 6.2
Play.createEssential Function - Line 43 to 130 - 6.3
Play.selectCol()- Lines 144 to 191 - 6.4HUD Mouse functions
- 6.5Validate “4-in-a-row” Winning Conditions
- 6.6Declaring a Winner
- 6.7Anticipation of Change - Play.js version 2
- Other problems for your bespoke solution?
- 6.8Conversion Process
7Game Shell - The CMS!
- 7.1Generic
- 7.2Generic Boot.js
- 7.3Generic Preload.js
- 7.4Generic Splash.js or Language.js
- 7.5Generic Menu.js
- Sample CMS page — Credits.js
- Deeper Dive: Using JAMStack as an SSG …
- Visit JAMStack http://jamstack.org
- Deeper Dive: Static Site Generators (SSG)
- 7.6Inside each Game Phase
8Plug-in Enhancements
9Conclusion
10Bonus Development Content
- IIIWhat’s next?
- 10.1Game Distribution & Marketing
- “How to publish a game on the web??”
- Introduction: 8-Step Deployment Method.
- Shareably (SBLY) looking to rent your Phaser games
- 10.2Book Review Protocol
- 10.3Tell the world about your game!
- Appendix
More Resources
- JavaScript Garden
- Additional Appendices
- Other resources:
- Selling your Game Assets
Appendix: Online Game Development
Appendix: Making WebXR Games!
Appendix: Phaser III Plugins
Appendix: “How to Start a WebSocket”
- Testing Your Browser
- Test sites:
- WebSocket Protocol Handshake
- Deeper Dive: WebSocket API
- Sample Source Code: Client-side WebSocket
- Step #1: Game
indexpage - Step #2: Generate Event handlers
- Appendix: OLOO - Safe JavaScript
- JS Objects: “TL;DR”
- 15.2.2 Inside the body of a class definition
- Deeper Dive: JS Delegation (aka “Inheritance”?)
- The old way
- “Object-Oriented JavaScript Pattern Comparison”
- ECMA-262 7th Edition / June 2016
- Objects Linking to Other Objects (OLOO)
- Compare your code
- Object.create
- Exercise Lesson 9:
- Exercise 1
- Game Singletons
- Deeper Dive: Object Manipulation objects in ES5/6
- Lesson Summary
- Resource References: