↑↓
Scroll down, or swipe up,
to travel forward
Technical Art & Creative Technology
This process could take +/- 20 seconds.
      LOOK      



LOOK





LOOK





TRAVEL


hero

Botanical Wonders


2023 - XR Experience to show what greenery can do for you.

Botanical Wonders is an initiative of the Flower Council of Holland, on behalf of the Dutch floriculture sector.

"Botanical Wonders" was a campaign that leveraged web-based augmented reality, ensuring full accessibility on all mobile devices. Launched across multiple territories, it featured a full on voice-over instructing and describing, enhancing the user experience.

The campaign was designed to promote indoor flowers and plants by informing users about the benefits of having greenery in their homes. Users could virtually place three pillars in their living rooms, each highlighting a different advantage of indoor plants. These interactive demonstrations showed how this could enhance their lives.

Development Highlights


/media/botanical_wonders/grass_moss_grow.jpg
The app would track where the user would walk through, and look towards, inside the augmented reality space. Then generates dirt, grass and moss dynamically in a maximum radius of ~15 meters around the starting point.

Using a custom shader, the app draws a 5% opacity gradient dot of a few pixels in diameter per rendered frame, at the current position of the user mapped onto the ground into a 1024 x 1024 pixel texture buffer. Using slightly different diameters per color channel to draw the gradient dot, we create and overlapping effect where each channel can be used as a mask for a different texture layer.

Using each color channel (RGB) from the low resolution texture buffer for the dirt, grass, and moss layer mask, in combination with the detailed height map texture data for each layer, we can create a smooth and natural looking transition between the different ground textures.

Development sketches and renders

Project Information


Roles:

• WebAR / WebGL development
• custom shader coding
• VFX coding
• 3D model cleanup / retopology

Tools used:

• SvelteKit
• THREEJS
• 8thwall
• VSCode
• Blender
• Figma
• Photoshop

Project Credits:

Robot Kittens
Roles : PM, Design, Frontend & backend development, sound, voice, music, 3D models & videos.
https://robotkittens.nl