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 Strategy 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 “Strategy” Games
4Core “Strategy” Game Construction
- 4.1The Goal
- 4.2Game Recipe™ Featured Ingredients
- 4.3Game Mechanics
- Digital Strategy Games Are Broken!
- Historical background?
- Strategy Game Characteristics
- Advantages and Disadvantages of Decision Trees
- Disadvantages of decision trees:
- Types of Strategy Games
- Game Mechanics (GM): Logic & Rules
- Game Mechanics (GM): Data Structures
- 4.4Design Considerations
- Deeper Dive: Putting Stories in the Wrong Place
- Seven Deadly Sins of strategy game design
- Pre-Battle Preparations
- Terrain and Unit Symbols
- Historical Military Symbols Usage
- Battle Narratives
- Deeper Dive: Multi-Player versions
- Following the herd? - Using expected “Convention”
- 4.5Step 3: Create “Play.js”
- 4.6Step 4: Create Supporting functions.
- 4.7Inside each Game Phase
5Phaser v3.16+ Code Review
- 5.1Main.js - Stage 1
- Phaser III Config
- “Stage 1” Game Mechanics
- 5.2Strategy Core Game Mechanisms
- Stage 1 Play.js - “Battle Plans”
- Finite State Machine (FSM) Summary:
- Stage 1 Play.js - “Pre-Battle Intelligence”
- Stage 1 Play.js - “Conduct the Battle”
- 5.3Stage 2 - Artwork Themes Substitutions
- 5.4Stage 2 - battlefield Terrain
6Phaser v2.x.x Integrated CMS Code Review
- 6.1“p2a” Main.js: Stages 1 & 2 consolidated
- 6.2“p2a” Boot.js & Load.js: Stages 1 & 2 consolidated
- Cross-Origin Requests
- 6.3“p2a” story.js: Stages 1 & 2 consolidated
- 6.4“p2a” menu.js: Stages 1 & 2 consolidated
- When to use “switch” versus “if-else” statements.
- 6.5“p2a” demo.js: Tutorial Game
- “p2a” demo.js Overview
- 6.6“p2a Battle Plans” with sprinkles
- “p2a” play.js Overview
- “p2a” play.js Battle Plan UI
- “p2a” play.js Drop Zones
- “p2a” play.js “btnOver” function
- “p2a” play.js “
doUnitDrop” function - “p2a” play.js “
doAssignReset” function - 6.7“p2a Pre-Battle Intelligence” with sprinkles
- 6.8“p2a Conduct the Battle” with sprinkles
7Phaser III Game 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)
8Plug-in Enhancements
- 8.1Twitter Plugin
- 8.2Gameboard Plugin
- IIIWhat’s next?
- 8.3Game Distribution & Marketing
- “How to publish a game on the web??”
- Introduction: 8-Step Deployment Method.
- Shareably (SBLY) looking to rent your Phaser games
- 8.4Book Review Protocol
- 8.5Tell 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: