Author: Emanuele Feronato
-
Continuous collision detection between a moving circle and one or more static line segments – vertex collision included
Complete HTML5 example of continuous collision detection between a moving circle and any number of static line segments, featuring vertices collision. Written in TypeScript and powered by Phaser, full source code available.
-
Continuous collision detection between a moving circle and a lot of other static circles – Complete example.
The journey into continuous collision detection continues. Moving circle Vs a lot of static circles trajectory prediction. HTML5 example powered by Phaser and written in TypeScript. Full source code available.
-
Understanding continuous collision detection between a moving circle and a static circle
Moving circle Vs static circle continuous collision detection explained without using any physics engine, only math. HTML5 TypeScript example powered by Phaser, full source code available.
-
Understanding continuous collision detection between a moving circle and a non axis aligned line – step 2: handling ball bounces
Moving circle Vs line continuous collision detection explained the easy way, now handling circle bounces, in only six steps with an interactive HTML5 example powered by Phaser. Physics has never been so much easy!
-
Understanding continuous collision detection between a moving circle and a non axis aligned line
Moving circle Vs line continuous collision detection explained the easy way, in only four steps with an interactive HTML5 example powered by Phaser. Physics has never been so much easy.
-
“Block it” HTML5 game ported to TypeScript with some new features, powered by Phaser and Arcade physics
"Block it" was a fun mobile game released a couple of years ago, which I prototyped using Phaser and TypeScript, so now you can have your HTML5 version. What's your best score?
-
Capacitor “Hello World” example: how to convert your web applications to native iOS applications
A detailed guide with 15 illustrated steps about porting your HTML web app to a native app for iOS devices using Capacitor.
-
Capacitor “Hello World” example: how to convert your web applications to native Android applications
A detailed guide with 12 illustrated steps about porting your HTML web app to a native app for Android devices using Capacitor.
-
HTML5 physics driven Concentration game prototype using Phaser and Planck.js – rewriting to TypeScript and adding images
Here it is the complete commented source code of the physics driven HTML5 Memory/Concentration game powered by Phaser and Planck.js, completely written in TypeScript. Have fun!!
-
Build a HTML5 game like Wordle using Phaser and TypeScript – Step 5: what if we use Bootstrap and Phaser in the same page?
New example of HTML5 Wordle prototype powered by Phaser and using Bootstrap components for the UI. This time we keep Bootstrap outside Phaser game and handle menus with listeners. Full TypeScript commented source code available for download.
-
Build a HTML5 game like Wordle using Phaser and TypeScript – Step 4: using Bootstrap and DOM elements to create a menu and select game modes and pick the word of the day
The HTML5 Wordle prototype now features a Bootstrap menu and the "word of the day" game, as well as random words to play. I also want to add some kind of arcade mode. Written in TypeScript and powered by Phaser, full commented source code available.
-
Add Bootstrap component to your HTML5 games powered by Phaser thanks to its DOM support and properly scaling the component
I already explained how to use DOM elements in your HTML5 games powered by Phaser to include great UI elements like Bootstrap dropdowns, and this time I am showing you how to properly scale them to always look nice no matter the resolution.
