https://www.shanebrumback.com/indie-forge-studio-tutorials.html Every Three.js and 3D game development tutorial from Indie Forge Studio (Shane Brumback): FPS games, particles, shaders, terrain, water and characters. en-us Fri, 30 Oct 2026 06:04:19 +0000 https://www.shanebrumback.com/images/indie-forge-studio-logo.pnghttps://www.shanebrumback.com/indie-forge-studio-tutorials.html https://www.shanebrumback.com/tutorials/threejs-cas-sharpen-pass-tutorial.html https://www.shanebrumback.com/tutorials/threejs-cas-sharpen-pass-tutorial.html Thu, 29 Oct 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Build a Three.js sharpen pass with contrast adaptive sharpening (CAS): render at low resolution, sharpen in a custom shader, and compare with a live split line. https://www.shanebrumback.com/tutorials/threejs-fps-controls-pointerlockcontrols-tutorial.html https://www.shanebrumback.com/tutorials/threejs-fps-controls-pointerlockcontrols-tutorial.html Wed, 28 Oct 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Three.js FPS controls tutorial: PointerLockControls with a pitch clamp, lock-click guard, air momentum, firing watchdog, gun VFX and touch controls. https://www.shanebrumback.com/tutorials/threejs-gerstner-waves-buoyancy.html https://www.shanebrumback.com/tutorials/threejs-gerstner-waves-buoyancy.html Tue, 27 Oct 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Three.js Gerstner waves and buoyancy tutorial: a custom water shader with wave normals and fresnel, plus crates, a barrel, a raft and a boat that bob and tilt. https://www.shanebrumback.com/tutorials/threejs-terrain-lod-splat-shader-grass.html https://www.shanebrumback.com/tutorials/threejs-terrain-lod-splat-shader-grass.html Mon, 26 Oct 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Three.js terrain LOD tutorial: LOD rings with skirts, a height and slope splat terrain shader, Web Worker chunks and slope physics on endless terrain. https://www.shanebrumback.com/tutorials/threejs-noise-terrain-fbm-ridged-domain-warp.html https://www.shanebrumback.com/tutorials/threejs-noise-terrain-fbm-ridged-domain-warp.html Sun, 25 Oct 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Three.js noise terrain tutorial: build a terrain heightmap with fBm octaves, ridged mountains, domain warping, carved valleys and seeded flat combat zones on top of the Part 1 chunks. https://www.shanebrumback.com/tutorials/threejs-infinite-terrain-chunks-wasd-character.html https://www.shanebrumback.com/tutorials/threejs-infinite-terrain-chunks-wasd-character.html Sat, 24 Oct 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Endless procedural terrain in Three.js tutorial: generate terrain chunks from noise around the player so it never ends, pool and dispose far ones, and add a WASD jump character. https://www.shanebrumback.com/tutorials/threejs-smoke-ground-mist-super-soldier-battle.html https://www.shanebrumback.com/tutorials/threejs-smoke-ground-mist-super-soldier-battle.html Fri, 23 Oct 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Premium Three.js tutorial: build Super Soldier Battle's valley ground mist as one InstancedMesh of cylindrical billboards, with seeded placement, near-fade, haze sync and a smoke budget. https://www.shanebrumback.com/tutorials/threejs-spread-pickups-terrain-raycast-spacing.html https://www.shanebrumback.com/tutorials/threejs-spread-pickups-terrain-raycast-spacing.html Fri, 23 Oct 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Spread health, ammo and shield pickups across a Three.js terrain: raycast to the ground, keep same-type packs apart, hide rare ones near trees, top up ammo. https://www.shanebrumback.com/tutorials/threejs-gpu-fire-particles-two-draw-calls.html https://www.shanebrumback.com/tutorials/threejs-gpu-fire-particles-two-draw-calls.html Thu, 22 Oct 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Learn how Super Soldier Battle draws all its ruin fires in two draw calls: vertex-shader particles, distance fade, frustum culling and no PointLights. https://www.shanebrumback.com/tutorials/threejs-wall-colliders-bvh-bullet-blocking.html https://www.shanebrumback.com/tutorials/threejs-wall-colliders-bvh-bullet-blocking.html Wed, 21 Oct 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Learn how Super Soldier Battle makes walls block bullets and players in Three.js: invisible box colliders, three-mesh-bvh raycasts, and push-out collision. https://www.shanebrumback.com/tutorials/threejs-campfire-grok-bot.html https://www.shanebrumback.com/tutorials/threejs-campfire-grok-bot.html Tue, 13 Oct 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Free tutorial: use Grok Bot to build a glowing, realistic Three.js campfire — generated fire flipbook tiles, particle flames, embers, drifting smoke, flickering light, bloom, and photo-textured logs and stones. Live demo, copy-paste code, one-click Launch. https://www.shanebrumback.com/tutorials/threejs-armored-soldier-grok-bot.html https://www.shanebrumback.com/tutorials/threejs-armored-soldier-grok-bot.html Fri, 09 Oct 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Free tutorial: use Grok Bot to build a rigged, animated, playable Three.js game character from one concept image — walk, run, jump, fire and reload with gun effects, then load the GLB with GLTFLoader and AnimationMixer. Live demo, copy-paste code, one-click Launch. https://www.shanebrumback.com/tutorials/endless-procedural-grass-field.html https://www.shanebrumback.com/tutorials/endless-procedural-grass-field.html Thu, 08 Oct 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Three.js tutorial: build an endless procedural grass field with realistic wind — thousands of blades drawn in one draw call with InstancedMesh and a GLSL wind shader — then drive a rigged capybara through it with WASD while the grass regenerates around you, open-world style. Free live demo and walkthrough; the full code is a member perk. https://www.shanebrumback.com/tutorials/threejs-rockfire-explosion.html https://www.shanebrumback.com/tutorials/threejs-rockfire-explosion.html Mon, 05 Oct 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Free Three.js tutorial: build a 3D rockfire explosion — jagged debris rocks that burst and bounce under gravity, additive fire and sparks, drifting smoke, a shockwave ring, a flash core, and camera shake. Live demo, copy-paste code, one-click Launch. https://www.shanebrumback.com/tutorials/rigged-super-soldier-threejs.html https://www.shanebrumback.com/tutorials/rigged-super-soldier-threejs.html Sun, 04 Oct 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL A developer tutorial: load a free rigged GLB soldier in Three.js with GLTFLoader, play its 7 animation clips with an AnimationMixer, and add WASD / arrow-key movement, Shift to run, Space to jump, and F to fire. Live demo plus full copy-paste source. https://www.shanebrumback.com/tutorials/rigged-capybara-threejs.html https://www.shanebrumback.com/tutorials/rigged-capybara-threejs.html Sat, 03 Oct 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL See how a rigged, animated 3D capybara was made with Grok Bot — no code, just three plain-English messages that returned a Three.js model, a rigged GLB and a YouTube Short. Live demo, step-by-step with screenshots, plus the full Three.js source for developers. https://www.shanebrumback.com/tutorials/how-to-add-threejs-bloom-glow.html https://www.shanebrumback.com/tutorials/how-to-add-threejs-bloom-glow.html Sun, 20 Sep 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Learn how to add cinematic bloom glow in Three.js using EffectComposer and UnrealBloomPass. Live demo, FAQ schema, step-by-step code, and a full copy-paste example. https://www.shanebrumback.com/tutorials/building-3d-medical-simulations.html https://www.shanebrumback.com/tutorials/building-3d-medical-simulations.html Tue, 26 May 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Learn how to build immersive 3D medical simulations using Three.js. Interactive anatomy models, surgical training, patient education, and real-time 3D visualizations in the browser. https://www.shanebrumback.com/tutorials/rendering-a-3d-cube-with-threejs.html https://www.shanebrumback.com/tutorials/rendering-a-3d-cube-with-threejs.html Tue, 26 May 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Free Three.js beginner tutorial: render a rotating 3D cube in the browser. Set up a scene, camera, renderer, lighting, and the animation loop in under 50 lines. Live demo, copy-paste code, one-click Launch. https://www.shanebrumback.com/tutorials/threejs-spinning-cube-starter.html https://www.shanebrumback.com/tutorials/threejs-spinning-cube-starter.html Tue, 26 May 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Learn how to create your very first 3D scene with Three.js. Build a colorful spinning cube with lighting, shadows, and smooth animation in under 100 lines of code. https://www.shanebrumback.com/tutorials/interactive-audio-sphere-particle-systems.html https://www.shanebrumback.com/tutorials/interactive-audio-sphere-particle-systems.html Tue, 05 May 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Learn how to create colorful 3D spheres that bounce to music using Three.js AudioAnalyser. Complete interactive tutorial with live demo, OrbitControls, and real-time frequency visualization. https://www.shanebrumback.com/tutorials/learning-threejs-and-game-programming.html https://www.shanebrumback.com/tutorials/learning-threejs-and-game-programming.html Sat, 02 May 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Discover the best resources, tutorials, and courses for learning Three.js and game programming for web developers. From beginner to advanced. https://www.shanebrumback.com/tutorials/loading-and-animating-mandalorian-grogu-3d-model.html https://www.shanebrumback.com/tutorials/loading-and-animating-mandalorian-grogu-3d-model.html Sat, 02 May 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Example code: How to load and animate the Mandalorian character from Star Wars using Three.js and GLTF models. https://www.shanebrumback.com/tutorials/programming-3d-games-with-threejs.html https://www.shanebrumback.com/tutorials/programming-3d-games-with-threejs.html Sat, 02 May 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Learn how to program 3D games and interactive web applications using Three.js. Complete examples, techniques, and best practices for web developers. https://www.shanebrumback.com/tutorials/the-advantages-of-creating-3d-Interactive-menus-and-websites-using-threejs.html https://www.shanebrumback.com/tutorials/the-advantages-of-creating-3d-Interactive-menus-and-websites-using-threejs.html Sat, 02 May 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Why build 3D interactive menus and websites with Three.js: immersive visuals, real interactivity, realistic WebGL rendering, cross-platform reach, and a huge community. Includes a live demo and starter code. https://www.shanebrumback.com/tutorials/using-threejs-pointer-lock-controls-for-online-3d-games.html https://www.shanebrumback.com/tutorials/using-threejs-pointer-lock-controls-for-online-3d-games.html Sat, 02 May 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Learn how to implement smooth first-person controls in 3D browser games using Three.js Pointer Lock Controls. Complete tutorial with code examples and best practices. https://www.shanebrumback.com/tutorials/using-threejs-to-develop-online-3D=browser-games.html https://www.shanebrumback.com/tutorials/using-threejs-to-develop-online-3D=browser-games.html Sat, 02 May 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Learn how to create powerful online 3D browser games using Three.js. Complete guide with examples, controls, performance tips, and best practices. https://www.shanebrumback.com/tutorials/3d-model-animation-xbox-controller-viewer.html https://www.shanebrumback.com/tutorials/3d-model-animation-xbox-controller-viewer.html Sun, 26 Apr 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Shane Brumback — Professional Three.js developer and founder of Indie Forge Studio. Play free no-download browser games including Endless Sky Battle, Zombie Attack, and Super Soldier Battle. https://www.shanebrumback.com/tutorials/3d-mobile-responsive-game-character-controller.html https://www.shanebrumback.com/tutorials/3d-mobile-responsive-game-character-controller.html Sat, 25 Apr 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL A mobile on-screen game controller is a virtual interface displayed on the screen of a mobile device that allows users to interact with and control games, typically through touch inputs. https://www.shanebrumback.com/tutorials/how-to-load-a-torus-knot-with-threejs.html https://www.shanebrumback.com/tutorials/how-to-load-a-torus-knot-with-threejs.html Sat, 25 Apr 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Learn how to load and render a Torus Knot in Three.js on a web page. Includes live demo, step-by-step code, and full copy-paste example. https://www.shanebrumback.com/tutorials/how-to-load-threejs-scene-donut.html https://www.shanebrumback.com/tutorials/how-to-load-threejs-scene-donut.html Sat, 25 Apr 2026 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Complete beginner-friendly tutorial: Load a Three.js scene and create a beautiful rotating donut using TorusGeometry. Includes live demo and full working code. https://www.shanebrumback.com/tutorials/how-to-add-lighting-to-a-threejs-scene.html https://www.shanebrumback.com/tutorials/how-to-add-lighting-to-a-threejs-scene.html Mon, 20 Jan 2025 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Learn how to add AmbientLight, DirectionalLight, PointLight and SpotLight to a Three.js scene to create realistic and visually stunning 3D environments. https://www.shanebrumback.com/tutorials/adding-transparent-png-textures-to-3d-objects.html https://www.shanebrumback.com/tutorials/adding-transparent-png-textures-to-3d-objects.html Fri, 09 Feb 2024 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Learn how to add transparent PNG textures to 3D objects in Three.js: alpha blending, alphaTest cutouts, additive glow sprites, depthWrite and a live VFX demo with full free code. https://www.shanebrumback.com/tutorials/animated-multi-color-cloud-particle-system.html https://www.shanebrumback.com/tutorials/animated-multi-color-cloud-particle-system.html Fri, 09 Feb 2024 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Free Three.js tutorial: build an animated multi-color cloud of smoke-textured particles that drift and rotate in 3D. Live demo, copy-paste code, and step-by-step setup. https://www.shanebrumback.com/tutorials/animated-white-cloud-particle-system.html https://www.shanebrumback.com/tutorials/animated-white-cloud-particle-system.html Fri, 09 Feb 2024 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Step-by-step Three.js tutorial: build a soft animated cloud effect using rotating smoke-textured planes. Live demo and setup walkthrough are free; the full copy-paste code is a member perk. https://www.shanebrumback.com/tutorials/animating-3d-gltf-models.html https://www.shanebrumback.com/tutorials/animating-3d-gltf-models.html Fri, 09 Feb 2024 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Code examples and demo for loading and animating GLTF 3d models with Three.js https://www.shanebrumback.com/tutorials/animating-3d-spheres-and-fragment-shaders.html https://www.shanebrumback.com/tutorials/animating-3d-spheres-and-fragment-shaders.html Fri, 09 Feb 2024 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Free Three.js tutorial: animate bouncing 3D spheres and render an animated GLSL fragment shader in the browser. Live demo, copy-paste code, and a full shader walkthrough. https://www.shanebrumback.com/tutorials/creating-and-animating-simple-3d-objects.html https://www.shanebrumback.com/tutorials/creating-and-animating-simple-3d-objects.html Fri, 09 Feb 2024 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Creating and Animating Simple 3D Objects https://www.shanebrumback.com/tutorials/first-person-shooter-game-starter.html https://www.shanebrumback.com/tutorials/first-person-shooter-game-starter.html Fri, 09 Feb 2024 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Build a browser FPS game in Three.js step by step: mouse-look, WASD movement, shooting, hit detection and explosions. Play the live demo, then copy the free code. https://www.shanebrumback.com/tutorials/first-person-shooter-game-tommy-gun-starter-code.html https://www.shanebrumback.com/tutorials/first-person-shooter-game-tommy-gun-starter-code.html Fri, 09 Feb 2024 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Three.js FPS game tutorial: a Tommy gun shooter with pointer lock, muzzle flash, bullet holes, sparks, recoil, scoring targets, wall collision and mobile touch controls. https://www.shanebrumback.com/tutorials/how-to-program-flashing-fragment-shader-effects.html https://www.shanebrumback.com/tutorials/how-to-program-flashing-fragment-shader-effects.html Fri, 09 Feb 2024 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Free Three.js tutorial: program a flashing, pulsing fragment shader effect on a 3D cube using ShaderMaterial and a time uniform. Live demo and copy-paste GLSL code. https://www.shanebrumback.com/tutorials/interactive-smiley-particle-system.html https://www.shanebrumback.com/tutorials/interactive-smiley-particle-system.html Fri, 09 Feb 2024 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Free Three.js tutorial: build an interactive particle system of smiley-face images that scatter away from your mouse using raycasting. Live demo and copy-paste code. https://www.shanebrumback.com/tutorials/particle-system-3d-blast-effect.html https://www.shanebrumback.com/tutorials/particle-system-3d-blast-effect.html Fri, 09 Feb 2024 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Make a click-to-fire Three.js explosion with a 3D particle blast: velocity, glowing lights and particle lifespans. Live demo plus free copy-paste code for your games. https://www.shanebrumback.com/tutorials/programming-3d-spheres-with-collision-events.html https://www.shanebrumback.com/tutorials/programming-3d-spheres-with-collision-events.html Fri, 09 Feb 2024 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Free Three.js tutorial: detect collisions between 3D spheres using distance checks, bounce them off each other and the walls, and flash random colors on impact. Live demo and copy-paste code. https://www.shanebrumback.com/tutorials/rocket-engine-particle-system.html https://www.shanebrumback.com/tutorials/rocket-engine-particle-system.html Fri, 09 Feb 2024 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Free Three.js tutorial: build a rocket engine exhaust particle system with BufferGeometry and PointsMaterial. Streaming particles, orbit camera, live demo and copy-paste code. https://www.shanebrumback.com/tutorials/selecting-3d-cube-with-threejs-raycasters.html https://www.shanebrumback.com/tutorials/selecting-3d-cube-with-threejs-raycasters.html Fri, 09 Feb 2024 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Learn how to select a 3D cube with a Three.js Raycaster and mouse click. Includes a live interactive demo, step-by-step code, and a full copy-paste example. https://www.shanebrumback.com/tutorials/selecting-3d-minecraft-models-using-raycasters.html https://www.shanebrumback.com/tutorials/selecting-3d-minecraft-models-using-raycasters.html Fri, 09 Feb 2024 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL How To Select 3D Minecraft Model With a Raycaster Using Three.js https://www.shanebrumback.com/tutorials/selecting-multiple-3d-objects-with-raycasters.html https://www.shanebrumback.com/tutorials/selecting-multiple-3d-objects-with-raycasters.html Fri, 09 Feb 2024 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL This page demonstrates how a 3d object can be selected using Three.js Raycasters https://www.shanebrumback.com/tutorials/water-shader-effects.html https://www.shanebrumback.com/tutorials/water-shader-effects.html Fri, 09 Feb 2024 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Create a realistic animated ocean in Three.js with the Water and Sky shaders: reflections, rolling waves and a moving sun. Try the live demo and copy the free working code. https://www.shanebrumback.com/tutorials/how-to-make-one-object-follow-another-threejs.html https://www.shanebrumback.com/tutorials/how-to-make-one-object-follow-another-threejs.html Mon, 15 Jan 2024 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Learn how to implement object following behavior in Three.js. Create realistic camera tracking, enemy AI, and interactive 3D experiences with step-by-step code examples. https://www.shanebrumback.com/tutorials/animating-and-interacting-with-3d-minecraft-models-using-threejs.html https://www.shanebrumback.com/tutorials/animating-and-interacting-with-3d-minecraft-models-using-threejs.html Wed, 06 Dec 2023 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Premium Three.js tutorial: load, animate, and click on a 3D Minecraft model. Covers GLTFLoader, AnimationMixer, Raycaster click detection, OrbitControls, and bounding box camera framing. Members unlock the full code breakdown and copy-paste source. https://www.shanebrumback.com/tutorials/comet-particle-system.html https://www.shanebrumback.com/tutorials/comet-particle-system.html Wed, 15 Nov 2023 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Learn how to create a stunning comet particle system with Three.js. Complete step-by-step guide with custom geometry, materials, animation, and live demo code. https://www.shanebrumback.com/tutorials/interactive-audio-driven-particle-systems.html https://www.shanebrumback.com/tutorials/interactive-audio-driven-particle-systems.html Sun, 30 Jul 2023 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Learn how to create interactive audio-driven particle systems using Three.js AudioAnalyser. Particles react in real-time to music frequency data. https://www.shanebrumback.com/tutorials/selecting-a-3d-cube-with-threejs-raycasters.html https://www.shanebrumback.com/tutorials/selecting-a-3d-cube-with-threejs-raycasters.html Wed, 19 Jul 2023 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL This page demonstrates how to select a 3d cube and move the cube towards the camera using Three.js and Webgl. https://www.shanebrumback.com/tutorials/programming-keyboard-inputs-for-threejs-first-person-3d-games.html https://www.shanebrumback.com/tutorials/programming-keyboard-inputs-for-threejs-first-person-3d-games.html Sat, 15 Jul 2023 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Learn how to program keyboard inputs for First Person Shooter games with Three.js. https://www.shanebrumback.com/tutorials/how-to-program-a-fire-fountain-particle-system.html https://www.shanebrumback.com/tutorials/how-to-program-a-fire-fountain-particle-system.html Fri, 30 Jun 2023 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Create a realistic Three.js fire effect with a particle fire fountain: BufferGeometry, additive blending and live sliders, then turn it into glowing lava. Live demo + free code. https://www.shanebrumback.com/tutorials/how-to-program-a-3d-menu.html https://www.shanebrumback.com/tutorials/how-to-program-a-3d-menu.html Thu, 22 Jun 2023 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Free Three.js tutorial: build an interactive 3D menu — image panels arranged in a ring you can orbit, click-to-navigate with a Raycaster, and a slow auto-spin. Live demo, copy-paste code, one-click Launch. https://www.shanebrumback.com/tutorials/fun-interactive-particle-system-programming-using-threejs.html https://www.shanebrumback.com/tutorials/fun-interactive-particle-system-programming-using-threejs.html Tue, 20 Jun 2023 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Learn how to program fun interactive particle systems using Three.js. Explore animations, user interactions, and captivating visual effects for websites. https://www.shanebrumback.com/tutorials/threejs-examples-exploring-interactive-visual-particle-systems.html https://www.shanebrumback.com/tutorials/threejs-examples-exploring-interactive-visual-particle-systems.html Mon, 19 Jun 2023 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL This blog post article contains step by step instructions and code example on how to program interactive visual particle system to enhance website appeal to users. https://www.shanebrumback.com/tutorials/how-to-load-youtube-videos-on-a-web-page-with-youtube-api.html https://www.shanebrumback.com/tutorials/how-to-load-youtube-videos-on-a-web-page-with-youtube-api.html Wed, 14 Jun 2023 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL An article with step by step instructions and code examples demonstrating how you can use the YouTube API to load your videos on a web page. https://www.shanebrumback.com/tutorials/simple-particle-system.html https://www.shanebrumback.com/tutorials/simple-particle-system.html Tue, 13 Jun 2023 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL How to program a simple particle system in Three.js: a rotating cloud of 5,000 glowing particles in one draw call, with soft sprites, additive blending, twinkle and fog. https://www.shanebrumback.com/tutorials/enhancing-your-website-with-threejs-star-field-particle-systems.html https://www.shanebrumback.com/tutorials/enhancing-your-website-with-threejs-star-field-particle-systems.html Mon, 12 Jun 2023 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Learn how to create stunning interactive 3D star field particle systems with Three.js. Perfect for website backgrounds, space scenes, and immersive web experiences. Step-by-step tutorial with code. https://www.shanebrumback.com/tutorials/3d-rendering-youtube-videos.html https://www.shanebrumback.com/tutorials/3d-rendering-youtube-videos.html Sun, 11 Jun 2023 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Learn how to render YouTube videos on 3D surfaces using Three.js CSS3DRenderer. Build a rotating video cube with OrbitControls, iframes mapped to 3D planes, and interactive camera movement. https://www.shanebrumback.com/tutorials/camera-tracking-stationary-object.html https://www.shanebrumback.com/tutorials/camera-tracking-stationary-object.html Sun, 11 Jun 2023 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL This is a demonstration of Three.je camera tracking stationary object https://www.shanebrumback.com/tutorials/how-to-design-3d-games-with-web-technology-threejs-webgl.html https://www.shanebrumback.com/tutorials/how-to-design-3d-games-with-web-technology-threejs-webgl.html Sun, 11 Jun 2023 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL Discover how to design 3D games using web technology including Three.js, HTML5, and WebGL. A comprehensive guide to creating immersive browser-based 3D games. https://www.shanebrumback.com/tutorials/how-to-select-multiple-3d-objects-with-threejs-raycaster.html https://www.shanebrumback.com/tutorials/how-to-select-multiple-3d-objects-with-threejs-raycaster.html Sun, 11 Jun 2023 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL This page demonstrates how a 3d object can be selected using Three.js raycasters https://www.shanebrumback.com/tutorials/tracking-animated-3d-objects-with-the-camera.html https://www.shanebrumback.com/tutorials/tracking-animated-3d-objects-with-the-camera.html Sun, 11 Jun 2023 00:00:00 +0000 Indie Forge Studio Three.jsGame DevelopmentWebGL This example demonstrates how a Three.js scene camera can be programmed using webgl to track animated 3d objects.