Jump to content
  • Advertisement

Search the Community

Showing results for tags 'HTML5'.

The search index is currently processing. Current results may not be complete.


More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Categories

  • Audio
    • Music and Sound FX
  • Business
    • Business and Law
    • Career Development
    • Production and Management
  • Game Design
    • Game Design and Theory
    • Writing for Games
    • UX for Games
  • Industry
    • Interviews
    • Event Coverage
  • Programming
    • Artificial Intelligence
    • General and Gameplay Programming
    • Graphics and GPU Programming
    • Engines and Middleware
    • Math and Physics
    • Networking and Multiplayer
  • Visual Arts
  • Archive

Categories

  • Audio
  • Visual Arts
  • Programming
  • Writing

Categories

  • Game Dev Loadout
  • Game Dev Unchained

Categories

  • Game Developers Conference
    • GDC 2017
    • GDC 2018
  • Power-Up Digital Games Conference
    • PDGC I: Words of Wisdom
    • PDGC II: The Devs Strike Back
    • PDGC III: Syntax Error

Forums

  • Audio
    • Music and Sound FX
  • Business
    • Games Career Development
    • Production and Management
    • Games Business and Law
  • Game Design
    • Game Design and Theory
    • Writing for Games
  • Programming
    • Artificial Intelligence
    • Engines and Middleware
    • General and Gameplay Programming
    • Graphics and GPU Programming
    • Math and Physics
    • Networking and Multiplayer
  • Visual Arts
    • 2D and 3D Art
    • Art Critique and Feedback
  • Community
    • GameDev Challenges
    • GDNet+ Member Forum
    • GDNet Lounge
    • GDNet Comments, Suggestions, and Ideas
    • Coding Horrors
    • Your Announcements
    • Hobby Project Classifieds
    • Indie Showcase
    • Article Writing
  • Affiliates
    • NeHe Productions
    • AngelCode
  • Topical
    • Virtual and Augmented Reality
    • News
  • Workshops
    • C# Workshop
    • CPP Workshop
    • Freehand Drawing Workshop
    • Hands-On Interactive Game Development
    • SICP Workshop
    • XNA 4.0 Workshop
  • Archive
    • Topical
    • Affiliates
    • Contests
    • Technical
  • GameDev Challenges's Topics
  • For Beginners's Forum
  • Unreal Engine Users's Unreal Engine Group Forum
  • Unity Developers's Forum
  • Unity Developers's Asset Share

Calendars

  • Community Calendar
  • Games Industry Events
  • Game Jams
  • GameDev Challenges's Schedule

Blogs

There are no results to display.

There are no results to display.

Product Groups

  • Advertisements
  • GameDev Gear

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


About Me


Website


Role


Twitter


Github


Twitch


Steam

Found 37 results

  1. Hey GD.net community! We're excited to have joined and be whipping up a first blog post to announce release of our Dots and Boxes game. A little background about us, gametable.org. We're a non-revenue side project game site created by a few friends honing their game development skills. We don't show any ads and don't have any intention to in the near future. Most of our games will likely be parallels of classic real world games or modernizations of simple old school computer games. Now on to Tabletop Dots and Boxes- This is one of our favorite childhood games. When we learned that we'd all played it on pen and paper as kids, we figured it would be fun to take it digital. We kept the UI and SFX relatively simple, stealing the overall look-and-feel from our previous two games. Where we stretched our legs with this game is artificial intelligence. We poked around on the web and found a number of existing dots and boxes games, the best of which offered play for up to four players. We thought this was a nice touch and decided to tackle it ourselves. 4 player pass and play was easy, but creating an intelligent AI that wasn't overly paranoid and ran in a relatively small amount of time was difficult. We tried a number of classic approaches using minimax, then negamax, then negascout. All three suffered from acute paranoia. After way too much time hunting we found an extension of minimax, Hypermax, that solved the issue. To our surprise this algorithm was employed in a 90's NES game called "Spot." Spot is based on the 1990's 7-UP mascot and is 2+ player connect four style game. Playing it is on our todo list. Hypermax is so similar to minimax with ab pruning that we had a little trouble implementing at first. We kept making assumptions about how it works. When we eventually landed on a working version of the AI, the solution was stunningly simple and elegant. If you want to talk about it, shoot us a message. Even with Hypermax, getting the AI to hit deep evaluation depths with limited evaluation time was still a challenge. The game state search space for even a small dots and boxes board is massive. Toss 4 players into the mix instead of 2 and the evaluation overhead just goes up. The first thing we did to overcome this was move all of our AI code out to a web worker to take the load off the rendering thread. Next, we spent weeks identifying intelligent move generation, ordering, and culling rules to dramatically reduce the search space. If you give the game a go on a larger board size with 4 players you will still see it take a moment to generate an AI move when game is about 1/2 complete, but its well within tolerable levels for a player. We're super stoked about the AI we came up with for Dots and Boxes. Its a heavily studied problem and a number of excellent AIs exist but not many that run in real time and pose any real challenge. We believe ours does and haven't seen a better one out there yet. Give it a shot and let us know what you think. Looking forward, we'd eventually like to add multiplayer support, but that is a ways down the line. More new games first! What classic games should we build next? Cheers, Gametable.org
  2. Hello, As the title says, looking for a SMM / Promoter for my hobby project. Project is nearing completion, your job would be to start generating buzz & bringing in views via Twitter, Instagram, Facebook, Forums, etc. Lots of material for screenshots and screen-recordings. Twitter account currently has > 50 < 100 followers IG sitting over 1,500 If interested, please DM and I will share project website more details. Looking for someone who can post minimum 4-7x week across main social platforms.
  3. EchoCell

    2D Engine Advice

    Hello folks! I’m looking for advice on which engine I should go with for a 2D game I want to make. The goal is to make a side-scrolling beat’em up/2D fighting game hybrid where the main levels are in beat’em up mode, but the boss battles are in 2D fighter mode. The combat controls (combos, special moves, etc) would be the same in both modes, and the game would include a tournament mode that is entirely in 2D fighter mode. I have minimal game developing experience, and am essentially a noob. I am mostly familiar with RPGMaker, but have also experimented lightly with Unity. I have zero programming knowledge, and thus am partial to engines more accessible to complete beginners. What engine(s) would be best suited to this kind of game? I am interested in both M.U.G.E.N and OpenBOR, but I don’t think either would allow the kind of genre-crossing I want to accomplish without significant programming skills that I don’t have. Also - and I realize I’m thinking too far ahead - I would like to be able to release this game via HTML5 and just host it online somewhere if possible. Otherwise I am okay with it being PC only. Thank you for your time and input! -Autumn
  4. PlayCanvas, an HTML5 games engine, has just seen the release of version 1.23. The new features in 1.23 include availability on NPM and official typescript definitions for the API. Improves from its last iteration are as follows: Post effects now use MSAA render targets with WebGL 2, Grab pass being able to be used alongside post effects and the WebVR Polyfill dependency being removed. GameFromScratch released a video on the basics of PlayCanvas if this engine piques your interest.
  5. grelf

    Before DOOM

    The August 2019 Challenge on GameDev.net has been announced and it is about recreating DOOM with current technology. I missed the original DOOM craze in the 1990s although I had developed some computer games in the decade before that. So I first had to look at the Wikipedia entry on DOOM to see what it was all about. What a coincidence that the story, created in 1993, begins in 2019! Mars is supposed to be colonised by now with experiments being done on teleportation between Mars and its two tiny moons, Phobos and Deimos. One interpretation of the plot is that the teleportation machines are subverted so that they spew out horrible creatures from some unknown origin - hell? The creatures are determined to attack us and they must therefore be exterminated, which forms the action of the game. As I have not seen the original DOOM I am not qualified to respond directly to GameDev.net's challenge but it set me thinking tangentially. What about a prequel to DOOM, where the teleporters are being tested before being installed on Mars and its moons? Let us imagine that the testing was not thorough enough, leaving vulnerabilities to be exploited by hackers. Pre-DOOM is thus about the laboratory in which 3 teleporters are to be tested before being set up in their intended locations. The player will try each machine out and complete a test report. If all seems satisfactory we then have to consider what could still be wrong. Perhaps there is something outside the testing lab? My little game is written in JavaScript with an HTML5 front page. It is entirely client-based. It uses the HTML5 2D graphics context but no other libraries or frameworks. I have adapted it from another HTML5 game of mine, The Forest, an explanation of which can be found here. Pages after that describe the history (from 1982) and programming details. Pre-DOOM uses my own photographs for some of the graphics, just like The Forest. The game is basically complete and available completely free here: https://www.grelf.net/predoom There are just a few untidinesses to be addressed. www.grelf.net August 2019
  6. AlienplayGames

    Reap | Devlog #3

    Hi everyone! I'm close to completing Reap. So, to make sure that everything works fine, I'll do some closed testing for it. If you're interested in participating contact me here: https://twitter.com/alienplay_games https://gamejolt.com/@alienplay or just comment on this devlog / send me PM. I'll leave you with a couple of GIFs from Reap: Thank you for reading this devlog!
  7. Greedy Goblin

    Making a map (editor)

    When it comes to populating the game world with objects I didn't want to have to spent months building a map editor, I only need something fairly simple and creating a feature-rich editor with a whizzy GUI seemed like such a waste of time and effort. I've been down that road before and ended up building (and selling) a visual scripting framework but ultimately never finished the game I was working on at the time. So how did I decide to approach this without having to create a GUI for placing and transforming objects in the scene. Well, since this is a browser based game I have the Chrome debug console to hand... yep, with a few keyboard short-cuts and manual input in the debug console is how I decided to proceed; it's simple, unobtrusive and gets the job done without hassle. One requirement is that I have an editor "class/module" that I can drop right in to my project and remove with ease when I want to push the project to a live environment. To make it independent of the game as such (i.e. I don't have to include a reference to the editor in any of the game code), I keep the instantiation of the editor separate from the main game and force it to wait (asynchronously) for the game to load (that's when the editor can do the rest of it's own initialisation). e.g. async function theGameHasFullyLoaded() { await new Promise( resolve => setTimeout( async () => { if ( game.gameTime ) { resolve( true ); } else { await theGameHasFullyLoaded(); resolve( true ); } }, 2000 ) ); return true; } I use a few keyboard shortcuts to rotate (R key), translate (T key) and scale (Y key... I'm already using S for player movement and R, T, Y are next to each other on the keyboard). While using rotate or translate I can switch between X, Y and Z axes by using the corresponding keys. To place an object in the scene I hop over to the console and type... game.editor.selectModel("aircraft02").spawn() This spawns the selected model a little way in front of the camera. The newly spawned object then becomes the currently selected model which I can manipulate using my rotate, translate and scale keyboard shortcuts. Once I've done editing I can save my changes by going back to the console and typing... game.editor.save() This essentially just calls an action on my Node API which does the actual saving of data to a file. I feel like I need a picture to liven up this blog post... And that's about it for now. I need to add in basic collision meshes for these static objects yet. I'll probably just keep it simple and stick to cuboids and spheres for the sake of simplicity and performance. When it comes to loading these static scene objects when the game starts, this is handled by a MapContentService which only loads the objects that exist within the required quadrants (i.e. dependent on where the player is on the map) - I won't call it a quadtree 'cos... well, it's not (nothing as sophisticated as that!) and would probably be overkill for my needs.
  8. Step-by-step instruction of Snake 2D using JavaScript/ES5, Canvas API Let's make a very simple classic snake game. For example, if we have a snake head with 10x10 pixels then we will move our snake by a step with 10 pixels using timer. This is the result of our work: Sandbox Note. I take ideas from this tutorial: Python Snake Game We need to get a canvas context from the canvas element. The canvas context is an object that have methods for working with graphics. Lets' create a script element inside of "index.html" file, get the canvas element, get the canvas context and set a clear color to black: Sandbox !DOCTYPE html> <head> <title>Snake</title> </head> <body> <canvas width="200" height="200" id="gameCanvas"> Your browser does not support HTML5 Canvas. Please shift to a newer browser. </canvas> <script> var canvas, ctx; canvas = document.getElementById("gameCanvas"); ctx = canvas.getContext("2d"); // Clear the canvas element ctx.clearRect(0, 0, canvas.width, canvas.height); // Set a clear color ctx.fillStyle = "black"; // Fill the canvas element with the clear color ctx.beginPath(); ctx.rect(0, 0, canvas.width, canvas.height); ctx.fill(); </script> </body> </html> Write a function for drawing a rectangle and call this function for test: Sandbox <!DOCTYPE html> <head> <title>Snake</title> </head> <body> <canvas width="200" height="200" id="gameCanvas"> Your browser does not support HTML5 Canvas. Please shift to a newer browser. </canvas> <script> var canvas, ctx; canvas = document.getElementById("gameCanvas"); ctx = canvas.getContext("2d"); // Clear the canvas element ctx.clearRect(0, 0, canvas.width, canvas.height); // Set a clear color ctx.fillStyle = "black"; // Fill the canvas element with the clear color ctx.beginPath(); ctx.rect(0, 0, canvas.width, canvas.height); ctx.fill(); // Call a drawRectangle() function drawRectangle(0, 20, "green", 20); function drawRectangle(x, y, color, size) { ctx.beginPath(); ctx.rect(x, y, size, size); ctx.fillStyle = color; ctx.fill(); } </script> </body> </html> Each game must have a game loop that will be called by timer. I created the GameLoop method that just prints "Hello, World!" to the debug console every 500 ms: setInterval(gameLoop, 500) function gameLoop() { console.log("Hello, World!"); } For a while our GameLoop will have only two called methods Update() and Draw(). The Update() method will have updates for snake cell coordinates and etc. The Draw() method will have only draw methods for game entities. function gameLoop() { update(); draw(); } function update() { console.log("update"); } function draw() { drawSnake(); drawFood(); } function drawSnake() { console.log("draw snake"); } function drawFood() { console.log("draw food"); } List data structure is ideal for keeping snake cells coordinates: // Snake list of (x, y) positions var snake = [{ x: 10, y: 10 }]; Create a function for clearing the canvas: function draw() { clearCanvas("black") drawSnake(); drawFood(); } function clearCanvas(color) { // Clear the canvas element ctx.clearRect(0, 0, canvas.width, canvas.height); // Set a clear color ctx.fillStyle = color; // Fill the canvas element with the clear color ctx.beginPath(); ctx.rect(0, 0, canvas.width, canvas.height); ctx.fill(); } Draw the snake: function drawSnake() { snake.forEach(cell => { drawRectangle(cell.x, cell.y, "green"); }); } Sandbox For moving the snake we need to create the "snakeDir" variable: // Snake movement direction var snakeDir = { x: 10, y: 0 }; The snake moving is very simple. Please, read comments: function update() { // Calc a new position of the head var newHeadPosition = { x: snake[0].x + snakeDir.x, y: snake[0].y + snakeDir.y } // Insert new position in the beginning of the snake list snake.unshift(newHeadPosition); // Remove the last element snake.pop(); } Sandbox I will explain eating food later. But you can read comments in the code. The result code: Sandbox <!DOCTYPE html> <head> <title>Snake</title> </head> <body> <canvas width="200" height="200" id="gameCanvas"> Your browser does not support HTML5 Canvas. Please shift to a newer browser. </canvas> <p>Click on this window to activate keyboard handlers to control the snake by WASD and arrow keys.</p> <script> // Canvas element and context var canvas, ctx; // Snake list of (x, y) positions var snake = [{ x: 10, y: 10 }]; // Snake movement direction var snakeDir = { x: 10, y: 0 }; // Snake step var cellSize = 10; // Food var food = { x: 0, y: 0 }; canvas = document.getElementById("gameCanvas"); ctx = canvas.getContext("2d"); // Field size var fieldWidth = canvas.width; var fieldHeight = canvas.height; // Generate an initial random position for the food generateFood(); // Set a key handler document.onkeydown = (event) => { switch (event.keyCode) { case 38: // Up case 87: // W snakeDir.x = 0; snakeDir.y = -cellSize; break; case 37: // Left case 65: // A snakeDir.x = -cellSize; snakeDir.y = 0; break; case 39: // Right case 68: // D snakeDir.x = cellSize; snakeDir.y = 0; break; case 40: // Down case 83: // S snakeDir.x = 0; snakeDir.y = cellSize; break; } }; // Run Game Loop setInterval(gameLoop, 200) function gameLoop() { update(); draw(); } function update() { // Calc a new position of the head var newHeadPosition = { x: snake[0].x + snakeDir.x, y: snake[0].y + snakeDir.y } // Insert new position in the beginning of the snake list snake.unshift(newHeadPosition); // Remove the last element snake.pop(); // Check a collision with the snake and the food if (snake[0].x === food.x && snake[0].y === food.y) { snake.push({ x: food.x, y: food.y }); // Generate a new food position generateFood(); } } function draw() { clearCanvas("black") drawSnake(); drawFood(); } function clearCanvas(color) { // Clear the canvas element ctx.clearRect(0, 0, canvas.width, canvas.height); // Set a clear color ctx.fillStyle = color; // Fill the canvas element with the clear color ctx.beginPath(); ctx.rect(0, 0, canvas.width, canvas.height); ctx.fill(); } function drawSnake() { snake.forEach(cell => { drawRectangle(cell.x, cell.y, "green", cellSize); }); } function drawFood() { drawRectangle(food.x, food.y, "orange", cellSize); } function drawRectangle(x, y, color, size) { ctx.beginPath(); ctx.rect(x, y, size, size); ctx.fillStyle = color; ctx.fill(); } function generateFood() { food.x = 10 * getRandomInt(0, fieldWidth / 10 - 1); food.y = 10 * getRandomInt(0, fieldHeight / 10 - 1); } // Returns a random integer between min (inclusive) and max (inclusive) function getRandomInt(min, max) { min = Math.ceil(min); max = Math.floor(max); return Math.floor(Math.random() * (max - min + 1)) + min; } </script> </body> </html>
  9. Okay, it's been a busy couple of weeks, I've been playing with shaders and retouching meshes and all kinds of fun things. Aiming/Shot Camera is now right-click, it orients to your current facing/throwing direction, and changes if you do. I've eliminated the reverse camera angle for now(former right-click), I might move it to another button. I re-used the fixed angle reverse camera code, added an IF that swaps it from a rear facing camera to a front facing camera depending on direction of travel and there you have it, a camera that snaps to an angle of your shot/thrust direction on a mouse-click. It's also excellent for surveying while airborne. I've re-instituted the single mesh collider for the terrain, so no more bumps on seams. I may solve this some day.. not yet.. haha UI clicks should no longer throw snowballs, so reloading fuel during a race is easily done, toggling the mini-map is easily done, and anything else involving the UI. New(old) Toon shaders for almost all of the moving parts. Going for super-simple and performant. I've touched every game object that has a texture at least once or twice in this last week(hopefully.. lol).. I've been trying to optimize and simplify where possible, as well as make sure I'm only using the shaders I intend to. I spent quite a bit of time revisiting lighting and setting up a super simple ultra-low definition baked lighting arrangement. I created a new ground texture, and.. SNOW!! haha, I've added a snow particle effect and hopefully it will play well for you, still tuning it though. This is the third day in a row I've tried to upgrade the WebGL build to the latest version only to be confronted by various bugs and strange issues. Now, most of those were of my own creation, naturally. However I've stumbled on some strange behavior that I thought might be noteworthy for anybody else who is working with Audio in Unity for a WebAssembly (WebGL) build target. Somewhat applicable outside Unity land though.. Somewhere between the last build and this build I updated Unity and it seems they changed the way that their WebAssembly build target interacts with audio files because my clumsy assortment of .mp3s and .wavs and .oggs worked just fine on both FireFox and Chrome previously. After updating to 2018.3, or some assortment of changes I made to the settings(I can't be sure if I updated Unity before the last build or after..), either way, all sorts of errors were cropping up in the web console, and no sound at all.. I finally found the following error and that led me down some more alleys that were mostly unrelated to the Unity incarnation of this problem.. "the buffer passed to decodeaudiodata contains an unknown content type" After some reading I discovered that the new Unity+WebAssembly way of dealing with audio seems to be to just let the browser handle it, and that gets a little more complicated.. Each browser has a dislike of various common formats for one reason or another, so I found what seems to be a least common denominator... At least for FireFox and Chrome.. Long story short, I re-encoded all of my sound effects into 16bit PCM .ogg's.. And now things seem to be sounding appropriately again, at least there are sounds, and no more errors. So, SlingBot Boarding v0.4.2: https://www.kongregate.com/games/WilliamOlyOlson/slingbot-boarding Let me know what needs fixin next!!
  10. Awoken

    Shadows & Ocean Sky-box

    Hello GameDev, This blog entry will cover new visual features added to the project. They are in no particular order: - Shadows - A reflective ocean sky-box - Vertex color noise for vegetation. - Preliminary client GUI But before I get to that I'd like to mention that I'm still plugging away on dynamic assets. If you haven't had a chance to check out that blog you can view it here I decided to spice up the look of the project. I thought it needed more juice, more oomph. It's been over a year since I've done anything visually significant. I am limited with what I can do but I enjoy working within those boundaries. Shadows A common observation that people would make about the look of the simulin was that it appeared as though they floated above the ground ( because there were no shadows ). I've toyed with Three.js shadows before but was never fully satisfied with the result. In a way I kinda think the Three.js shadows betrayed the visual look of the project; however, I certainly don't want people to be under the impression the simulin are floating. The problem I had was the shadow map size needed was too large. The fps dropped. My approach to resolve this issue is to update the shadow map's position relative to the camera's. This way the shadow map size can be reduced to a level that doesn't hinder performance. For a more thorough explanation: Ocean Sky-box After I added shadows to the world I noticed that the water was look pretty flat. It just didn't pop. I quickly scrapped together squarish looking clouds and made a sky box for the ocean. All a did was snag a sky-box texture off google and used a filter to pixelate the image with large overlapping pixels. The ocean looks way better now. Color Noise for Vegetation Aaand the vegetation seemed boring. Seeing as all the models were made with the same color palette I decided to spice up each tree by slightly adjusting the RBG color channel for each vertices. This happens on the client side and so each time the game loads so do the slight color variations. It gives subtle character to the vegetation. Preliminary GUI I offset the center of the world to the right of the screen to make way for a left menu GUI. This GUI will hold information that is most important and crucial to winning. I already know of the first and most important thing that will be displayed, but I'll talk more about that in later blog. ( On a side note: I'm always conflicted as to what to write about in my blogs. A part of me wants to wait to unveil certain things, and another part of me is like who cares, just put it out there ). Final note about the performance. The world build I am demonstrating in this blog is home to about 30,000 individual trees and 10,000 simulin. When a user registers they can select their own shadow and ocean quality settings before the world is loaded. This allows for each user to achieve the best possible performance/look for their system. On my system: The simulation server uses ~2 Gb of ram The data server uses ~750 Mb of ram With the highest quality settings Chrome uses ~750 Mb of ram at ~60 fps. While writing this blog I have a game session open to take screen shots and am also trying to record my desktop and I think that's maxed out my system. So the videos I'm recording are choppy. I'm gonna try to close out this blog and try recording again. If the chop goes I'll post the results. I might also change the shadows so the land doesn't cast shadows. edit: as soon as I start record my desktop the fps drop to ~40 , ahh well, here's the video anyways. In the past I've reached out the members of this community for critique and feedback and that has always worked out handsomely. So please, if you see anything that you think might look better if done differently, please don't hesitate to mention it.
  11. The first implementation of DRTS came in form of a windows application. While the windows app did its job, I felt uncomfortable with the bottleneck resulting from depending on windows as a platform. To lower this barrier, I started developing a version to run in web-browsers. The web app has come a long way since then, offering an interactive tutorial and playing with bots. The update released today expands the web app by support for playing with other people online. To play the game, head over to play.drtsgame.com Starting today, the web app there also offers to join another player for a game. The video below demonstrates the new feature, using two different web-browsers: Under The Hood - Rendering Efficiency And Visibility Changes Also with this update, visibility of the game world is changed in several ways: The computation of visibility is reimplemented using a new algorithm to be more efficient in common scenarios. This change drastically improved frame rates in Firefox, Edge, and Chrome. Symmetry for view propagation along edges: With the new algorithm, visibility is changed for symmetry between pairs of nodes. This means that viewing along an edge always works in both directions, regardless of the travel direction of the edge. When the game is over, the complete game world is revealed to all players.
  12. Greedy Goblin

    State Changes

    Games usually (if not always) require some way to manage state changes... and I'm sure most of you (if not all of you) know far more about State Machines than I do. And I'm certain that I could learn a heck of lot from reading up about the subject to build a state machine that works beautifully and makes my code look amazing etc etc. Pfft.. never mind all that... I'm building this game 'off the cuff' as it were, making it up as I go along and following the principle of 'I build what I need when I need it and only insofar that it adequately fulfils the requirements at that time'. I don't try to plan ahead (not in any granular sense anyway), I'm not building a reusable one-size-fits-all game engine, I'm not trying to make the code beautfiul, or win any awards or even make any money from the darn thing. It just needs to perform well enough for what I want it to do. So my immediate requirement is that I have a way to manage the player switching from walking to running to whatever. If I can use it elsewhere for other things then great... and I'll be honest, I do like reusable code so I tend to naturally sway toward that. What I'm trying to avoid is getting myself stuck in a rut, spending weeks/months deliberating over the smallest details because it's got to be 'perfect' and then realising I've still got 99.5% of the game to build! Quick and dirty is OK in my world. I often approach things from a top-down perspective. This boils down to: 'How do I want to instruct the computer to do x, y or z?' So for this particular requirement, how do I want to instruct the game that the player can change from walking to running and running to walking, or walking/running to falling (assuming I make that a player state - which I do), but not from sleeping to running for example? Hell, I don't even know all the states that I want yet, but these are the ones I have a feel for so far: Walking Running Skiiing Driving Falling Drowning Sleeping Eating Introducing 'When' I thought it might be nice to be able to write something like this in my player setup: // Configure valid player state transitions When( this.playerState ).changes().from( PLAYER_STATES.WALKING ).to( PLAYER_STATES.RUNNING ).then( function () { } ); When( this.playerState ).changes().from( PLAYER_STATES.RUNNING ).to( PLAYER_STATES.WALKING ).then( function () { } ); When( this.playerState ).changes().from( PLAYER_STATES.WALKING ).to( PLAYER_STATES.SKIING ).then( function () { } ); When( this.playerState ).changes().from( PLAYER_STATES.SKIING ).to( PLAYER_STATES.WALKING ).then( function () { } ); When( this.playerState ).changes().from( PLAYER_STATES.WALKING, PLAYER_STATES.RUNNING, PLAYER_STATES.SKIING ).to( PLAYER_STATES.FALLING ).then( function () { } ); There's probably a library for something like this out there, but heck, where's the fun in that?! So I create a new 'Stateful' object that represents a state (in this case the playerState) and it's allowed transitions and a 'When' function so I can write the code exactly as above: const Stateful = function () { } Stateful.isStateful = function ( obj ) { return obj.constructor && obj.constructor.name === Stateful.name; } Stateful.areEqual = function ( v1, v2 ) { return v1.equals ? v1.equals( v2 ) : v1 == v2; } Stateful.prototype = { constructor: Stateful, set: function ( v ) { let newState = typeof ( v ) === "function" ? new v() : v; for ( let i = 0; i < this.transitions.length; i++ ) { let transition = this.transitions[i]; if ( transition && typeof ( transition.callback ) === "function" ) { let fromMatch = Stateful.areEqual( transition.vFrom, this ); let toMatch = Stateful.areEqual( transition.vTo, newState ); if ( fromMatch && toMatch ) { // We can only change to the new stat