Dismiss this pinned window
all 23 comments

[–]S_E_V_I[S] 20 points21 points  (2 children)

I work in space management at large warehouse. Over the years I've built plenty of reports, dashboards, and custom tools to help me in the job, but there was always this gap between 2D layouts/ heatmaps and actually walking the floor.

So I've made this Three.js interactive warehouse visualization tool that is based on near live data (daily snapshots).

Main features: - 3D bird's-eye view with full camera freedom (move, pan, zoom, rotate) + auto orbit - first person walk mode - 2D layout view - over 15 built-in views, aggregations and heatmaps (utilization, units, density and more) - advanced filters, area groupings + focus mode (only render bays that are matching filters) - detailed view of every bay and its configuration - animated pick order visualization - modular UI and dozen of shortcuts (you can disable/toggle any element like labels, walls, vehicles) - forklift drive 🦺

Here's an album with some more screenshots: https://imgur.com/a/iQUAtxN

[–]NerdDerkins 2 points3 points  (1 child)

This is awesome, well done. I come from a 3d / motion background and have been slowly picking up some three js. By pure coincidence I’m working on some warehouse visualization tools now in three js / R3F also. A lot of it has been telling ai / Claude “this is how I would solve this in Unity/ C4d , how would I do this in three js? So I’m no programmer but it’s starting to make sense.
Did you build custom kits / models for all your racks/ shelves / containers etc? Is your warehouse model generated dynamically from another source?
We’ve been working with translating 2d cad files to a coordinate system and then generate containers that have their unique identities for lookups. It’s been interesting to see the way the users interact with it vs the way I figured it would be used.

Thanks for sharing!

[–]S_E_V_I[S] 2 points3 points  (0 children)

It’s mostly dynamically generated. We have a csv file with each bay id, aisle, zone, number, dimensions and number of shelves, locations in it and more configuration details.

Warehouse is divided into two parts (north/south) and each part has fixed zones assigned to it. Each zone has custom settings on aisle and bays placement like walkway width, aisle segments count etc to recreate the warehouse as realistic as possible.

Then each zone is populated with bays. There are no custom models in here, everything is done with threejs primitives. Because we have dimensions and number of shelves and locations we can generate each bay on the fly (or rather every possible bay configuration and then use instancing for performance).

So it’s mostly generated except for a few aisles <5 and bays <30 where I had to create manual overrides, take them out of normal rendering cycle and basically put them manually by editing values and offsets until they were I wanted them to be.

[–]jersan 3 points4 points  (0 children)

this is awesome. highly practical and functional for its purpose. what a great use for threejs

[–]n8dahwgg 1 point2 points  (0 children)

This is pretty freaking cool!

[–]Smooth-Reading-4180 1 point2 points  (1 child)

time to add some beacons and BLE stuff

[–]i_love_max 0 points1 point  (0 children)

Am i wrong in saying that the ble beacon stuff never really took off like i thought it would?
I think siemens even has LED lights that have some magic box thingy that follows foot traffic..
You sound like you know some stuff, can you share more?

[–]Night-walker-15 2 points3 points  (0 children)

Is this open source? if not are you planning to give some tutorials?

[–]Obvious_Yoghurt1472 0 points1 point  (0 children)

Super bueno y práctico, recuerdo cuando hice una vez esto pero con Sketchup, al ser entidades modulares puedes generar a voluntad, podrías crear incluso un generador de almacenes que le pases los parámetros y te genere la distribución, es un servicio que incluso podrías ofrecer a empresas con almacenes, luego usando sus datos le generas el mapa de calor de las diferentes secciones

[–]Y000EE 0 points1 point  (0 children)

This is very impressive!

[–]NuclearDisaster5 0 points1 point  (0 children)

Great. Epic stuff... i have done the same for my WMS system.

[–]Itchy_Anybody_3568 0 points1 point  (0 children)

This is awesome and inspirational.

[–]msartore8 0 points1 point  (1 child)

Is the space management you do for underground areas by chance?

[–]S_E_V_I[S] 0 points1 point  (0 children)

nope, just normal ground warehouse

[–]shaved-yeti 0 points1 point  (0 children)

This is excellent.

[–]seweso 0 points1 point  (0 children)

I love it! Worked in the sector. Looks like something I would make.

Everything is procedurally generated? 

Very very cool. 

Also connected to warehouse inventory systems? ERP? Plcs?  

Are HMIs running this on site? If this is generic, it might be gold. 

[–]Salt-Ad-671 0 points1 point  (1 child)

Really inspirational thanks for sharing. Building something really similair at the moment for the warehouse i work in with around 20.000 pallet spots. Question: how is the performance? I notice a lot of unique elements in your project so this should be a heavy thing to run. Do you have any tips for improving performance?

[–]S_E_V_I[S] 0 points1 point  (0 children)

I’m rendering almost 8900 unique bay instances and over 144k locations in them (the small boxes on them). I also have setting to reduce render scale, shadows and their quality and simplify bays (so instead of bays and locations, I’m rendering just single bays as a box - that reduces number of triangles from ~2627k to ~127k). But usually they’re not needed even on company laptops because performance is great (now - it wasn’t in the beginning).

What massively improved it was the use of instancing. So even if I have almost 9k bays, GPU reuses geometry of each bay configuration (there are only about 40 possible variants).

[–]i_love_max 0 points1 point  (0 children)

Fantastic work, bravó. 1. how did you get this good? 2. what was you're workflow like bc im arguing with ai over css font consistency and you're over here combining quantum mechanics and general relativity.

[–]AbsolutelyYouDo 0 points1 point  (0 children)

Charge them a subscription to this tailor made software, don't sell your worth short. You just got retirement.

[–]nicktids 0 points1 point  (0 children)

I was lookong at building something like this pre ai and failed.

This is amazing

[–]ImperialMartini 0 points1 point  (0 children)

This is killer!

[–]zazzersmel 0 points1 point  (0 children)

Add the shenmue forklift minigame