Documentation - Demos - Screenshots
ArcadeGPU is the only WebGPU 2D/3D game library oriented arcade with a graphics and collisions system specially build to reach this goal. Directly inspired from old-school engine, it keep things simple and offers an easy way to create video games. The core engine is written in TypeScript so no compilation time needed. ArcadeGPU also coming with a large number of examples. These resources serve as quick-starts, source of inspiration, and is also a valuable resource for AI agents to understand how to use the framework and making good vibe-coding with the codebase.
Below the stack we've choice for this work:
| API | Domain | Description |
|---|---|---|
| WebGPU | 3D | A modern 3D graphics API designed to provide high-performance rendering and compute capabilities directly in web browsers. |
| Canvas2D | 2D | A 2D graphics API designed to provide shapes, text, and images drawing. |
| CSS3 | UI | The best way to build powerful and hightly maintenable user-interface. |
| Web Audio | Sound | An Audio API for playing sounds. |
- Getting started
- Features
- Examples
- Compatible tools
- Blender Plugin
- Contributors
- Some parts taken for this work
- Bug track
- Roadmap Engine
- Roadmap Templates
- Changelog
- Licence
- Screenshots
Clone and install the starter-kit from this repository:
# git clone https://github.com/jay19240/SWGPU-StarterKit.git
# cd SWGPU-StarterKit
# npm install
# npm run dev
Edit the ''src/game_screen'' and start writing your game. Go to http://localhost:5173.
Or, just install it on your own project with the following command:
# npm install swgpu
Don't forget to fill your index.html with the minimal structure required by the engine.
-
🧱 Core
- Maths
- Tweening
- Events
- Curves
- Quaternions
- Object pooling
-
👾 2D
- Static sprite
- Animated sprite
- Isometric animated tilemap
- Orthographic animated tilemap
- Particles
- Rendering filters
- Motion lines
-
📐 2D Physics
- BoundingRect
- Tilemap box collider with slopes support
- Box2D built-in
-
🧊 3D
- Debug shapes
- Static mesh
- Animated mesh: frame based, shader side
- Static sprite
- Animated sprite
- Motion lines
- Billboarding
- Cubemap skybox
- Particules
- Flares
- Fog
- Vertex colorization
- Decals
- Shadow mapping
- Shadow volume
- Multi-viewport
- Camera orbit
- Camera WASD
- Auto mipmap
- Post rendering: many textures on input like depth/normal/ids
- Rendering filters
- Customizable shaders
- Rendering multi-channels
-
📐 3D Physics
- BoundingBox
- BoundingCylinder
- Walkmesh
- Hitmesh
- Ray-testing
- Jolt built-in
-
💥 3D Material
- Phong reflection model
- Dissolve texture map
- Displacement texture map
- Diffuse map
- Specular map
- Emissive map
- Normal map
- Env map
- Toon map
- Textures scroll: multi-target
- Animated UV
- Specular shininess
- Emissive intensity
- Normal intensity
- Facing blending
- Secondary texture: with mix/mul blend mode
-
🌞 3D Light
- Directional light
- Point lights: 64 lights
- Spot lights: 16 lights
-
🖼️ 3D Post-processing
- Outline
- Hardware dithering
- Pixelation
- Color depth limiting
-
🎮 Input
- Action mapping
- Gamepad, keyboard and mouse support
-
🧠 AI
- A* for 2D/3D with graph and grid
- Djikstra graph
- Min-max with alpha-beta pruning
-
📺 Screen
- Navigate between different view of your game
- Resources pre-loading
-
📜 Scripts
- Load script from json file
- Register async command function and call-it from json file
- Manual jump to part of the script
- Command primitives like: WAITPAD, GOTO, GOTO_IF, EXEC_IF, VAR_SET, VAR_ADD, VAR_SUB, DELAY
-
🔊 Sound
- Handle sounds by groups
- Play multiple sounds at same time
-
🌳 Tree
- 2D binary space partition
- 3D binary space partition
-
🎨 UI
- Focus/unfocus widgets
- Fade in/out
- Widget architecture
-
🖍️ UI Widgets
- Dialog + choices
- Dialog only
- Print long text
- Description list
- Virtual keyboard
- Slider
- Menu base
- Menu list view
- Menu text
- Prompt
- Sprite
- Text
-
🌆 DNA
- ECS architecture implementation
ArcadeGPU come with 27 examples, each one is thinking to represent a common game style (platformer, fighting, fps, rpg, etc...) or just a demo of features.
Template are written in typescript/javascript and build to be clean and extensible.
List of templates that you can test here:
| Name | Description |
|---|---|
| 2D Tilemap | Simple example with tilemap, character and collisions |
| 2D Tilemap Pathfinding | Simple example with tilemap, character and pathfinding |
| 2D Tilemap Isometric | Simple example with isometric tilemap, character and collisions |
| 3D Character Arcade | Simple example with map, character and arcade physics |
| 3D Character Jolt | Simple example to show how used character controller with Jolt |
| 3D Car Jolt | Simple example to show how used car controller with Jolt |
| 3D Curve | Simple example to show how used curves |
| 3D Particles | Simple example to show how used particles |
| 3D Shadow Map | Simple example to show how used shadow map |
| UI Menu | Simple example to quickly show how used user interface |
| 3D Viewer | Simple example to show the rendering possibilities |
| 3D Pack | Simple example to show how pack and used all your assets in one archive |
| 3D Performance Test | Stress test to show you the performance of the engine |
| 3D Prerendered Walkmesh | Complete base for J-RPG rooms system games with walkmesh |
| 3D Isometric Walkmesh | Complete base for J-RPG-Iso rooms system games with walkmesh |
| 2D Visual Novel | Complete base for visual novel games |
| 2D Checker | Complete base for checker games |
| 2D TCG | Complete base for TCG games |
| 3D FPS Arcade | Complete base for FPS with shoot, jump and arcade physics |
| 3D Turn-based RPG | Complete base for turn-based battle J-RPG games |
| 2D Fight | Complete base for fighting games |
| 2D Shoot'em up | Complete base for shoot'em up games |
| 2D Platformer Arcade | Complete base for platformer games with arcade physics |
| 2D Platformer Box2D | Complete base for platformer games with Box2D |
| 2D Mario Sokoban | A Mario Sokoban built with vibe-coding to see how AI understand the framework |
| 2D Triple Triad | A Triple Triad game just for fun |
| 3D Menu Ring | The Tomb Raider weapon menu, because why not ! |
| 3D Can Chase Jolt | A silly game where the player has to run faster than a can rolling down a slope |
Find the the exporter in bin folder of this repository.
Install it on Blender by going to Edit -> Preferences -> Add-ons -> Install... -> Select the zip.
Push "n", and click on WarmeY2K Exporter to see the exportation panel.
Please, before export check if:
- Your Blender scene is saved.
- You've set the output path in the right panel -> output -> output path.
Click on the mesh and select Export JSM.
Congratulation, your static mesh is now exported !
- Crisxzu - Contribute to the Wiki, typedoc converter, Triple Triad and Car Jolt demo.
- zuda - Contribute to Triple Triad demo.
- luciedefraiteur - Contribute to the fog.
- thetinyspark - Contribute to the binary space partition.
- Impre-visible - Contribute to 2D tutorial.
- Arcade before realistic physics show in examples
- DOM for UI elements
- CanvasRenderingContext2D for 2D stuffs
- Box2D for 2D physics engine
- Jolt Physics for 3D physics engine
- No glTF support, we don't want to support the rendering techniques used by this format (BSDF, Skinning, etc...)
Issue on box function (physics 2D) when character run quickly on slopesPhysics bug when change tab and come back (even with paused the game before tab changing)
- Mettre les fonctions bas niveau de collisions du fichier core/utils dans core/physics.
- Séparé création et ajout des PhysicsBody dans Gfx3JoltManager
- [Ver. 1.8.12] Fix 2D collision function called "box".
- [Ver. 1.8.11] Add a 3D car physics demo.
- [Ver. 1.8.11] Create a manager for Jolt.
- [Ver. 1.8.7] Some optimizations like moving animation frame to shader, remove allocation etc...
- [Ver. 1.7.0] Fix somes performances issues (now webgpu constants are stables).
- [Ver. 1.7.0] Changes the way to sample texture depth.
- [Ver. 1.6.13] The 3D physics demo become more complete (full character implementation).
- [Ver. 1.6.12] A 2D physics demo is added.
- [Ver. 1.6.12] Change Rapier3D physics engine for Jolt Physics.
- [Ver. 1.6.12] Change Rapier2D physics engine for Box2D.
- [Ver. 1.6.12] Change the shootemup demo for a real shootemup base.
- [Ver. 1.6.12] Renderer hook in screen added.
- [Ver. 1.6.5] Changes material animation to support multi-textures.
- [Ver. 1.6.5] Scroll added on main textures.
- [Ver. 1.6.5] Secondary texture added.
- [Ver. 1.6.5] Dissolve texture added.
- [Ver. 1.6.0] Tile slope support added.
- [Ver. 1.6.0] Spritefusion support re-added.
- [Ver. 1.6.0] Aseprite support added.
- [Ver. 1.6.0] Tilekit support added.
- [Ver. 1.5.0] Pack archivage added.
- [Ver. 1.5.0] New mesh shader hook added.
- [Ver. 1.5.0] Engine manager added.
- [Ver. 1.5.0] ECS Components check optimized with the use of Set.
- [Ver. 1.5.0] ECS query is added.
- [Ver. 1.5.0] ECS nice sugar methods is added.
- [Ver. 1.5.0] Fix offset factor on all sprite classes.
- [Ver. 1.5.0] Tile collision method added to Gfx2TileMap.
- [Ver. 1.5.0] Platformer template added.
- [Ver. 1.2.0] Binary format for 3D files added.
- [Ver. 1.1.14] Tilemap SpriteFusion format added.
- [Ver. 1.1.13] Cylinder collision class added.
- [Ver. 1.1.12] Fix and optimize jnm.
- [Ver. 1.1.10] Some added to fps demo.
- [Ver. 1.1.7] Mipmap added.
- [Ver. 1.1.5] Export as npm module added.
- [Ver. 1.1.1] Outline post-process effect added.
- [Ver. 1.1.1] Normals, id and depth rendering buffer added.
- [Ver. 1.1.1] Object pooling added.
- [Ver. 1.1.0] Move physics to dedicated folder and redesign JNM.
- [Ver. 1.1.0] Rapier has been added.
- [Ver. 1.0.3] Playstation one post-process effect has been added.
- [Ver. 1.0.3] Post-processing effects has been added.
- [Ver. 1.0.3] Camera WASD has been added.
- [Ver. 1.0.3] Camera orbit has been added.
ArcadeGPU is released under the MIT license.
