Building a Playable Retro Arcade for the Web

Описание: In this video, I’m building a fully interactive arcade using Three.js.

This is Part 1 of the project, where I cover:
– The initial idea and references
– Environment and visual concept
– 3D modeling the arcade in Blender
– Bringing the model into the browser using React Three Fiber

The focus of this video is the visual side of the project and setting up the base Three.js scene.
In Part 2, I’ll dive into interactions, animations, and gameplay.


Tech Stack
React Three Fiber — https://react-three-fiber.docs.pmnd.rs
Three.js — https://threejs.org
GSAP — https://greensock.com/gsap
Drei — https://drei.docs.pmnd.rs/
Postprocesing — https://react-postprocessing.docs.pmn...

References
Shopify pinball — https://bfcm.shopify.com/

Timeline

00:00 Intro
01:03 The idea
02:04 Creating the concept
03:00 3D Modeling in Blender
04:14 Artwork Design
05:22 Tech Stack
06:20 R3F Setup
07:08 Outro

Social

X (Twitter): https://x.com/cortiz2894

GitHub: https://github.com/cortiz2894

My game — Laser Drift

https://laserdrift.com/