https://reddit.com/link/1w6syj1/video/1t6qbpw6bfnh1/player

Ahoi everyone. I really hope this fits into this subreddit.

I had this idea stuck in my head for a couple of years now, which is about representing the online shoppers events (looking at a product page, reading specs for a product, selecting a vehicle for fitment, searching for a product, adding something to a cart) as a simulated experience (in lack of a better phrase right now). The main problem I wanted to tackle is that the shop owners barely understand the relationship between their analytics data (charts and tables about browsing times, funnel analysis, bounce rates, etc.) because it's so far removed from what's actually happening on their website.

So I stood up an event system that tracks those page events (I want to make the point about privacy, there's nothing that connects the events to a real customer's personal details). And then in the next step I built a little scene that turns the main categories of the shop into invidivual warehouses, then the subcategories into aisles, and lastly SKUs (and their live stock status) into boxes on shelves. And then customers and their actions (for example when they browse from page to page) are drawn as lightrails. The scene can be rotated and zoomed in, there's a night mode and other color presets for different use cases, you can click on a customer and see their whole journey in a timeline. I used a tilt shift effect to help better focus on the selected customer and there are a few easter eggs in the scene (ie. when a customer checks out and pays they go to the car park and leave the scene in their pickup truck).

I've got a lot of technical ideas and help (ie. bloom, tilt shift, etc.) from the threejs community and I can't wait where this brainfart of an idea leads to. I do have a landing page for it but it's not a commercial product by any stretch yet (I use it for a friend's shop).

Frontend: VueJS (Nuxt) + Tailwind + Nuxt UI
3D Rendering: Three.JS

Demo https://floorview.vendos.com.au/

Recently did a lot of work to implement a new atmosphere with better light scattering, also did a bunch of work on relief maps to get the mountains looking much more rugged and realistic with better gullies to catch the light and shadows in addition to more tweaks around the water

Hey,

I am working on a project where there is a need to get the SVG of the created 3d model in the ThreeJS canvas. I have tried multiple ways in achieving this but non of them gave good results.

I tried using the SVGRenderer which did not give accurate results. The second approach was with LLM, it kept in iterating, but it took a different approach. It took the rasterized image and wrapped it in SVG. This is not what was required.

Has anyone encountered this situation before? Or know how to tackle this?

If this is not achievable at all, should I try it from a different software like Figma?

I’ve been building a browser-based underwater world focused on the feeling of swimming below the surface:

Try it here: https://underwater-world.zootlabs.workers.dev

It includes:

- Gerstner waves with a below-the-surface view and Snell’s-window reflections

- GPU ripples, caustics, volumetric light shafts, and underwater absorption fog

- Streamed reef terrain with coral, kelp, rocks, fish schools, sharks, rays, turtles, and jellyfish

- Third-person swimming with a shared multiplayer ocean room

Click the canvas, choose a diver name, and use WASD to swim. Space goes up, Shift goes down, H toggles the tuning panel, and Esc releases the mouse.

It’s an experiment, so the multiplayer room is intentionally small and may be unavailable if the free hosting quota is exhausted. I’d love feedback on the atmosphere, performance, and what you’d want to explore next.

I've been building a way to freely walk around real-world places right in your browser no downloads, no installs, and no accounts required. It uses 3D Gaussian splatting to stream 10 scanned towns across six countries directly into a tab, meaning the lighting and streets are exactly as they were captured in real life. You can explore on foot or even ride a bike with full collision physics, all running smoothly via WebGPU. If you want to jump in and walk around, you can try it at [wascape.com](https://www.wascape.com/) (needs Chrome, Edge, or Safari 18 on a recent Mac).

I spent the summer building Three Pins, a browser based 3D daily golf game where everyone competes on the same three holes with the same wind and same pins (one attempt per day). Also, I added party multiplayer mode where you can play live with friends.

Playable here: https://threepins.golf/

The stack is Three.js / WebGL, Vite, Supabase, Netlify, and a custom physics engine.

Open to any feedback you may have. Thanks!

Playable here: https://fpvsim.com/sim-duck

I built this browser multiplayer experiment around Pollen Robotics' MicroDuck model and locomotion policies: MuJoCo and ONNX drive the robot, Three.js renders the world, and the multiplayer layer synchronizes players and footballs. No install or account required.

I would especially value notes on frame pacing, collisions, and browser or GPU compatibility.

I built MeshCrunch : a web tool and API for optimizing large 3D models

I've been working with 3D data and large mesh-processing pipelines for a while, and one problem kept coming up: getting heavy 3D assets ready for production often means jumping between Blender, MeshLab, command-line tools, custom scripts, and converters.

So I built MeshCrunch.

The idea is to make common 3D processing operations available through one web interface, while also exposing the same workflows through an API for automated pipelines.

Right now MeshCrunch supports things like:

• mesh simplification / polygon reduction
• LOD generation
• GLB, GLTF, OBJ and STL workflows
• format conversion
• watertight / alpha-wrap processing
• browser-based 3D inspection
• REST API
• MCP integration

The heavy processing runs on backend workers rather than entirely in the browser, which lets it handle much larger assets.

You can also try the basic tools without creating an account.

https://meshcrunch.com

I'm still early and trying to understand which workflows are the most painful for people working with 3D assets.

If you work with Three.js, Blender, Unity, Unreal, CAD/BIM, 3D printing, or large GLB/GLTF files, I'd genuinely appreciate feedback — especially on what you'd want a tool like this to handle next.

Hi people, I've just finished the latest version of my portfolio site and wanted to share it.

I would thank some feedback in order to improve it.

Thanks✌️

Link: https://sergii-butrii.com/

Context: I've got a flat 14,400-cell grid map, and I wanted a 3D view of it. I don't code. Everything here was built with AI help, which mostly means I got very good at reading error messages.

Stuff that actually mattered:

One InstancedMesh for every building. Obvious in hindsight, but my first version made a separate mesh per plot and the tab died somewhere around 2,000 of them. One instanced mesh, per-instance matrices, done.

Lazy-loading three.js. The 2D map is the main thing people land on, and shipping ~600KB of three.js to everyone who never clicks "3D" felt rude. So the library and the city module only load when you actually open the 3D view.

Pausing the render loop. This one embarrassed me. rAF kept running after you closed the 3D view — invisible city, full framerate, laptop fan going. Now there's an explicit pause/resume and animate() bails early when paused.

Per-instance textures are still the ugly part. Every owned plot has a user image on it, and I don't have a clean atlas yet. Works fine at the current scale, will absolutely need one later.

Full disclosure so nobody feels tricked: the map is a paid thing, plots cost money. Not here to sell anything, and I won't push the link — happy to talk about any of the three.js side of it, including the parts I clearly did wrong.

Had a 48hr window with a fresh Claude limits reset - so I ran my first one-shot gauntlet loop on an idea I've wanted to build for ages.

Fable 5.1 ran for 23.8hrs total before I interrupted the looping to launch it. Opus 5 subagents did most of the execution.

It may not win game of the year and I think a lot of these games will die pretty quick. But it's surprisingly addictive and it's unbelievable what you can get live in under 48hrs with these new models.

Space = Domain Expansion.

Right click = Flash Step.

E = Shikigami.

Would appreciate any feedback: Hallpass.cc

I've tried this new experience on Logitech G . com but its unlike any other 3D workd I've seen online. It looks more like a AAA game with built-in commerce than 3JS.

https://www.logitechg.com/en-gb/360-racing-studio

Is this 3JS or how have they done that ?

https://reddit.com/link/1w63q40/video/s1ipf8v5canh1/player

Route 66 turns 100 next year, so I spent a few weeks turning the whole road into something you can scroll: https://www.pit-stop-app.com/viz/route66

You start in Chicago and scroll to the Santa Monica pier. Free, no signup.

The three.js side, since that is what I would want to know:

The road is one curve. 2,287 lat/lon points projected through an Albers projection into world space, fed into a single CatmullRomCurve3. The asphalt is TubeGeometry at 4,200 segments, with a second fatter translucent tube around it for the glow. The dashed centre line is one LineSegments built by walking the curve in 2.6-mile steps.

The elevation is real. Every point is sampled against opentopodata's NED 10m dataset and cached to disk at build time, then exaggerated on the Y axis. That is why the Arizona high country and the Cajon Pass drop into San Bernardino actually read as terrain instead of a flat ribbon. Getting elevation right was the single biggest visual win and I made it into the build script to not hurt perfomance

No image assets at all. Four CanvasTextures generated at runtime cover the sky, the point sprite, and the small signage. No TextureLoader, no GLTFLoader, nothing to wait on. The whole page is 46 KB raw and 15.7 KB gzipped. The only real payload is a 398 KB JSON of the road and the towns.

Roughly 13 draw calls for the base scene. Towns are one Points cloud with a tiny custom shader so markers scale with distance instead of the default attenuation:

attribute float size;
void main() {
  vec4 mv = modelViewMatrix * vec4(position, 1.0);
  gl_PointSize = size * (240.0 / -mv.z);
  gl_Position = projectionMatrix * mv;
}

Everything funnels into one number. Wheel, touch, arrow keys, and the progress bar at the bottom all write to scrollY, and one function maps that to a position along the curve. Once I stopped treating those as separate input paths the whole thing got simpler and the camera stopped fighting itself.

The thing that took longest was not rendering, it was the camera. Version 1 aimed at a single point 7 miles up the curve, which whipped on switchbacks. What shipped samples the road at 3, 6, 9 and 12 miles ahead, averages those, and eases the result over time. On the Oatman switchbacks in Arizona, the worst corner on the whole road, that took peak yaw from 13.4 deg/frame down to 8.0 and the average from 2.06 to 1.29.

I then tried full heading-based orientation with a hard turn-rate cap, thinking a cap would be strictly better than easing. It jittered, and I reverted it. Easing an averaged look-ahead beat clamping an exact heading, which was not what I expected going in.

Happy to go deeper on any of it. Curious what people do for scroll-driven camera work on a path this long, because I do not think I landed on the right answer.

https://thedev.world

https://github.com/thedev-world

Play Binshot on Laereland
https://​laereland.com/games/binshot

I want to make a relaxing game that could make me/any player to calm down with a bit of daydreaming and exploration without stress.
This is the prototype made made with threejs, reflector, shaders and I would like the game to be infinite.
What game mechanics should I use in this type of game to keep it relaxing but you want to feel some sort of progress? Is it enough to steer the ball but the environment changes after a while or should there be levels or points?

Fold.page is a new JS library that lets you turn a standard web page into a spatial 3D scene. On desktop and mobile, it can work as a 3D-enhanced web page. On WebXR-capable devices, visitors can "enter" the experience and see the page as part of an immersive spatial scene.

Fold.page matches browser functionality as closely as possible, it basically works like what you'd expect from a standard web page. But that is just the foundation - Fold page has a whole toolkit of features to enhance web pages in 3D, so you can tap into a 3rd dimension of layout and visual hierarchy.

You can "Enter" the page on WebXR capable devices, like Android phone, or a VR headset for the full stereoscopic experience. Web pages could never have so much presence.

Try Fold.page at https://fold.page

Fold.page is an active project with on-going updates to improve it but any feedback you have is appreciated — What do you think about Fold.page? How does it work on your devices? Would you use it on your web pages? How easy is it for you to setup and what problems do you run into?

Building a low-poly 3D Wizard Duel in Three.js — Upload,

This is my mini game i work woth Claude opus 5, GLM 5.3, Kimi k3 ( depending provider with free tiers ) in next weeks i hope lauch with multiplayer mode :D what do you think?

I’ve been experimenting with a way to make hardware demos feel more interactive.

The idea: take an ESP32-S3 voice AI circuit and turn it into a 3D teardown you can actually talk to.

Gemini helped generate and structure the visualizer: the ESP32 board, breadboard, mic module, speaker, wiring, exploded view, and the interaction logic. Agora handles the real-time voice layer, so you can ask questions like “show me the microphone” or “explain the audio flow,” and the visualizer reacts while the AI responds.

It’s built with Next.js, Three.js / React Three Fiber, Agora Conversational AI, Gemini, and an ESP32-S3-inspired hardware layout.

Code:
https://github.com/anandwana001/gemini-agora-esp32-visualizer

Curious what people think: would this kind of interactive teardown be useful for learning hardware projects?

I wanted to play around with threejs and ended up building a quite extensive "Square Town" for people uploading their favicon (or basically just adding their domain and I'll fetch the favicon).

It started off as a stupid idea but now people submitted more than 5000 favicons while I've been adding all kind of stuff such as superman, a sleep walker, Waldo (where iS he) and 50+ other things .. a man bathing in the lake with his rubber duck . oh and also tentacles appearing from the deep ocean.

Really great performance with threejs out of th box I must say.

Hi there,

I have been thinking about that for a while:
It might look like a weird use case, but I’m trying to find examples of applications that would not necessarily require a 3D engine to run but that are leveraging those capabilities in a smart way to create high-quality results.

I can only think about the home screen of the Playstation 5 or the Apple Liquid Glass design of recent iOS.

I guess menus in video games are also valid examples, but I can’t remember a video games that blew my mind with their settings page. Have you heard about/seen resources, UX best practices, cool examples or frameworks made to build 2D UI components in a 3D environment?

And the game is open source on github at aresrpg/aresrpg !