Littlecube Villagers is a character voxel-art project that is built using signed distance functions and real-time raytracing.

The miniature scene will be shown first and will automatically upsize in 60 seconds to prevent significant lag under legacy GPU conditions and provide a smoother user experience. This automation can be disabled as well.

The time-of-day has been fixed at sunrise.

The scene will randomly assign either a male or female character, each with a different body size. At times, the male character would be wearing a scarf, while the female character would be wearing a cloth hat. The pet animal can be either a Spitz puppy or a Siamese kitten, with either an open or closed mouth.

The project is built using a multi-pass raytracing solution that allows subsequent iterations to have expanded scenes. There are no polygons in the scene geometry, and the voxel-art scene can be fully assembled in the form of SDF box primitives. The grid lines are derived from SDF 3D-line segments. A vintage post-processing filter has also been added.

Controls:
Press 'R' to immediately upsize to the main scene or switch back to the miniature scene. It is recommended to switch to full-screen mode before upsizing the scene.

Press 'D' to disable automatic upsizing.

Press '1' to set the camera to look at the front of the family, and press '2' to set the camera to look at the back of the family.

Press and hold the 'Alt' key and use the right mouse-button to rotate the camera orientation around the scene.

Press and hold the 'Z' key and use the left mouse-button to zoom the camera in and out.

Press and hold the Spacebar and use the left mouse-button to pan the camera position.

Press 'S' once to save a screenshot to the disk. Wait for the raytracing to converge before saving a screenshot.

Other information:
The application requires a GPU capable of WebGL2 and has been tested on the Chrome, Brave, and Edge desktop browsers.

It also requires a powerful modern GPU for real-time raytracing. However, the amount of raytracing done has been throttled to allow users with legacy GPUs to run the application with interactive frame rates in the miniature scene mode. On legacy GPUs, it may take up to 15 minutes for the raytracing to converge.

Frameworks used: three.js

Raytracing primitives template from Reinder.
Raytracing line segment 3D template from bloxard.
Vintage filtering template from Loadus.

Copyright(c) 2022 Edwin Zeng, @doogyhatts on Twitter
License under CC BY-NC-SA 4.0