Are you a developer and not a 3D designer with crazy (or any) Blender skills? But you would still like to create your own 3D models, for instance for a great little WebXR game? Then Smooth Voxels is for you!
Smooth Voxels allows you to turn voxel models into low poly style or smooth organic looking models, even mixing styles in one model.
Smooth Voxels uses vertex averaging to produce a much smoother appearance than for instance marching cubes, as seen in this 7x7x7(!) voxel apple.
Smooth Voxel models can be created in the Smooth Voxel Playground and exported to .glTF or .glb, or generated at runtime using the Open Source Library.
Extensive documentation can be found at smoothvoxels.glitch.me.
Or just check the cheat sheet.
But the best way to see what you can do is browsing and changing the examples on The Smooth Voxel Playground.
Note that this project lives at glitch.com, GitHub contains the distribution, which can be linked from jsDelivr as shown below.
Refer to the Smooth Voxels Examples for full examples in A-Frame and Three.js.
Including Smooth Voxels into A-Frame
<!-- Include the A-Frame and Smooth Voxels scripts -->
<script src="https://aframe.io/releases/1.6.0/aframe.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/SamuelVanEgmond/[email protected]/dist/smoothvoxels.min.js"></script>
Including Smooth Voxels into Three.js
<script type="importmap">
{
"imports": {
"three": "https://cdn.jsdelivr.net/npm/[email protected]/build/three.module.min.js"
}
}
</script>
<!-- Include the Smooth Voxels script -->
<script src="https://cdn.jsdelivr.net/gh/SamuelVanEgmond/[email protected]/dist/smoothvoxels.three.min.js"></script>
<script type="module">
import * as THREE from 'three';
// Ensure THREE is available for Smooth Voxels
window.THREE = THREE;
...
You can find the release notes here.
Samuel van Egmond