Topics and Outcomes
Course Outline by Topic
- Review - stuff you should already know from IGME-230/330:
- HTML/CSS, CSS Selectors, Absolute positioning, Web Fonts
- Putting file on people.rit.edu, setting permissions, creating folders
- JavaScript:
- Browser DOM - elements, attributes, events(onload, onclick), methods(document.querySelector(), document.querySelectorAll(), addEventListener(), element properties (.className, innerHTML), element methods (.setAttribute())
- Basic JS - variables,scope, closures, data types, writing functions, events and event handlers, arrays
- More JS - "use strict", Anonymous Functions, IIFEs, Closures, Block-level Scope/Hoisting
- JS OOP - Object literals, function constructors, .prototype, modules, value of
this
- Canvas2D API:
- Getting a pointer to 2D context - canvasElement.getContext("2d")
- Canvas drawing state attributes - strokeStyle, fillStyle, lineWidth, lineCap, lineJoin, miterLimit, shadowOffsetX, shadowOffsetY, shadowBlur, shadowColor, font, textAlign,textBaseline, globalAlpha, globalCompositeOperation
- Rectangles - clearRect(), strokeRect(),fillRect() in conjunction with applicable state attributes
- Text - fillText(), strokeText(), measureText() in conjunction with applicable state attributes
- Image drawing - drawImage(), createPattern()
- Drawing state stack management - save(), restore()
- Transformation methods - scale(), rotate(), translate(), transform(), setTransform()
- Transformation concepts - matrix, identity
- Compositing modes - set with globalCompositeOperation, possible values include: source-over, source-in, source-out and others
- Gradients - createRadialGradient(), createLinearGradient()
- Pixel Manipulation - createImageData(), getImageData(), putImageData(), canvas.toDataURL()
- Paths - beginPath(), closePath(), fill(), stroke(), clip(), moveTo(), lineTo(), quadraticCurveTo(), bezierCurveTo(), arcTo(), arc(), rect(), isPointInPath()
- Open Web APIs:
- jQuery or XHR with proxy server to load local or remote data
- Data Formats: plain text, CSV, XML, JSON, JSONP
- Timers and requestAnimationFrame for animation
- <audio> for sound
- Web Audio API (read only)
- JS Libraries:
- jQuery for ajax and UI effects
- SoundJS for playing multi-channel sound
- PreloadJS for pre-loading files
- Server Side Programming:
- ssh'ing to server using Terminal or PuTTY
- Basic Unix file manipulation - pwd, cd, mkdir, chmod, etc ...
- PHP - variables, functions, $_GET, querying a SQLite DB
- Debugging PHP - error log, running on command line, testing in browser
- Basic SQL - SELECT,INSERT,UPDATE,DELETE,WHERE,LIMIT,ORDER BY
- Blastem:
- Polling Keyboard
- SoundJS, PreloadJS
- Bullets, Bad guys, Bounding Box Collision Detection
- Score
- Particle System Object
- Sprite Sheet Object
- Friend Finder:
- PHP/SQLite Read/Write Web Service Triple Store
- User Location
- Casual Games Design Topics:
- Casual Games Definition, Characteristics and Examples
- Classic and Modern Casual Games
- Onboarding, Control and Usability
- Core Loop - action->reward->upgrade OR action->wait->reward->upgrade OR OR action->grind->reward->upgrade
- Sessioning
- Return Triggers
- Player Motivations- Socializers, Killers, Achievers, Explorers
- Social Games:
- F2P Concepts & Terminology
- ECMAScript 5 - stuff we didn't cover in 330: Object.create(), Object.freeze(), Object.seal(),composition pattern
- ECMAScript 6:
- let - block scope
- classes and inheritance
- destructured assignment
- arrow functions
- Maps and Sets
- Promises
- Game Engines:
- 3D With Three.JS
- Setting up a Scene
- Geometry and Mesh Objects
- Lights
- Text
- Particles
- Animation and Physics
- Projects:
- One or two "Game Jams"
- 2D Game using Framework
- 3D Game or your choice
- Other Assignments:
- Casual Games Group Presentation
- Facebook Game
- Readings
- Videos