background

Case Study: Experience ABM

3D Kiosk Software Development

Experience ABM Web Design
Image
Visit this website (opens in a new window)

Building a custom 3D warehouse scene with interactive hotspots for ABM's tradeshows and digital marketing endeavors.

Equipment downtime. Piles of pallets. There are some things you just don’t have room for in your distribution center. Take a look around this simulated warehouse we built for ABM, who provides solutions to keep distribution running smoothly.

Behind the Scenes

Building the ABM Warehouse Experience was a fun project from the start. I worked closely with the team at White Rhino to develop a full WebGL 3D scene that the user could navigate through by clicking on relevant hotspots. Each hotspot focuses on an area of improvement that ABM helps companies achieve within their distribution centers.

We developed the 3D scene using three.js and a custom-built GLTF model. We implemented dynamic camera positioning logic with smooth animations from hotspot-to-hotspot, plus a full render engine to correctly light the scene and provide for realistic shadows, ambient occlusion, and global illumination. A significant amount of work went into performance enhancements, treading the fine line between a photorealistic scene and one that renders quickly across multiple devices - especially as the primary deployment was on touchscreen kiosks at a tradeshow with less-than-optimal hardware.

The end result, with the help of baking some of the more compute-heavy lighting into textures, is a high-performing touchscreen experience that's cross-device friendly and optimized for their digital marketing efforts.

Image
Image
Image
Image
Image
Image
  • Libby Louis
    “It's looking really great! Thank you for all of your work, I appreciate your putting thought and care into building this correctly from the get-go.”
    Libby Louis
    Senior Developer @ White Rhino

Have a project in mind? Let's talk about it...