An open API service indexing awesome lists of open source software.

https://github.com/nimadez/voxel-builder

Voxel-based 3D modeling application
https://github.com/nimadez/voxel-builder

babylon-js electron glb gltf magicavoxel modeling painting path-tracing pixels symmetry terrain three-gpu-pathtracer three-js three-mesh-bvh voxel-engine voxel-generator voxelization voxelizer voxels

Last synced: about 1 month ago
JSON representation

Voxel-based 3D modeling application

Awesome Lists containing this project

README

          

# Voxel Builder

![screenshot](media/screenshot.png?raw=true "Screenshot")

### **Voxel-based 3D Modeling Application**
**Model . Render . Export**

[https://nimadez.github.io/voxel-builder/](https://nimadez.github.io/voxel-builder/)

[Changelog](https://github.com/nimadez/voxel-builder/releases)

[Installation](https://github.com/nimadez/voxel-builder#installation)

[Wiki](https://github.com/nimadez/voxel-builder/wiki)

[Known Issues](https://github.com/nimadez/voxel-builder#known-issues)

[FAQ](https://github.com/nimadez/voxel-builder#faq)

[Bug Report](https://github.com/nimadez/voxel-builder/issues)

## Features

**File I/O**
- Save and load JSON
- Save and load MagicaVoxel VOX
- Export to GLB, GLTF, OBJ, STL, PLY
- Localstorage, snapshots, quicksave, undo/redo
- Backup and share snapshots in a ZIP archive

**Model and Paint**
- High performance voxel engine
- Generators *(terrain, cube, sphere, isometric...)*
- Interactive modeling toolsets
- Symmetric drawing and painting
- Voxel transforms and manipulation
- Color groups and layering options

**Rendering**
- Three.js Sandbox
- Three.js GPU path tracer
- Basic PBR rendering
- Post-process effects

**Voxelization**
- Fast BVH method
- Model voxelizer *(GLB, OBJ, STL, PLY)*
- Image voxelizer
- Text voxelizer *(unicode & emoji)*

**Export Meshes**
- Bake voxels to editable meshes
- Unbake exported GLB back to voxels
- glTF compatible editor

**Extensibility**
- ES modules
- User startup project
- Blender importer script

**More**
- Average startup time 300 ms *(after the first launch)*
- Unique handcrafted user-interface
- Minimum dependency, portable, online and offline
- Ad-free, no trackers, no logging

## Supported Browsers
- Electron *(recommended)*
- Mozilla Firefox *(desktop/mobile)*
- Google Chrome *(desktop/mobile)*

> - PWA A2HS-ready *(add to home screen)*
> - For the best experience, a tablet with pen or Wacom is recommended.

## Installation
#### Clone or [Download](https://github.com/nimadez/voxel-builder/archive/refs/heads/main.zip) the repository
```
git clone https://github.com/nimadez/voxel-builder
cd voxel-builder
```
#### [Download Electron](https://github.com/electron/electron/releases)
```
Linux: electron-v*-linux-x64.zip
Windows: electron-v*-win32-x64.zip
```
For ease of use, extract the zip file into the "**voxel-builder/electron**" directory.
#### Run
Start with Electron
```
cd voxel-builder
electron .

$ sh run-electron.sh
> run-electron.bat
```
Start with Node.js
```
cd voxel-builder
node server.js
```
#### Update
*Makes a backup archive, and ignoring the "/electron" directory.*
```
cd voxel-builder
python3 update.py
```

## Known Issues

#### Low FPS at higher voxel volumes
> Electron is recommended for working with a large number of voxels.

Also, the FPS depends on many factors, such as the material (CEL is faster) and the distance between the camera and the model. Rendering a dense Thin volume at close range greatly increases GPU load.
>- Use "Minimal UIX" to save battery on mobile devices. (PBR-free)
>- Do not enable the "Frosted Glass UI" option.
>- Use XFORM > Optimize to reduce the volume of voxels.
>- Note that this application runs on a web browser and you shouldn't expect much.

#### Delay in drawing strokes
> If you draw and it doesn't, it means the builder is working, you are drawing faster than your hardware and browser will allow. (latency >150 ms)

#### Error: Exceeded the quota
> Browser storage is limited, use Electron for much higher capacity.

#### Import GLB:
##### Attributes error (voxelization)
> Multiple meshes need to have the same properties or they won't merge, the only solution is to merge meshes before exporting to GLB.
##### Morphtarget error (voxelization)
> We do not support geometry animations.

#### Import PLY: Throw RangeError (voxelization)
> They are often a piece of a larger model data.

#### Wacom tablet crashes randomly and throws warning on Chrome (Linux)
> Warning: BJS - Max number of touches exceeded. Ignoring touches in excess of 2.
This problem is related to Babylon.js and nothing can be done.

## FAQ

#### Why isn't there a layering feature and a layer list?
> You can have 16,777,216 layers (color groups), the layering system in this app is determined by colors, even a change in the brightness of a color creates a new group that can contain hundreds of voxels.

> So groups are automatically created, merged, or deleted based on color. You can even hide, delete, select, paint, transform, or duplicate color groups.

#### Why can't I freely transform 3D objects like in other 3D software?
> There are no objects, you work with a grid of voxels, the XFORM feature only mimics the transformation of 3D objects, you just grab a piece of connected voxels and move them.

#### Can two voxels be in the same position?
> Never, even if they have different colors, the system will automatically delete one.

#### Why isn't there an option to export raw voxels as GLB?
> GLB has a special use in this application, you can save and retrieve voxel data using baked meshes, exporting raw voxels to GLB leads to interference and errors when loading it using the "Load Bakes" option.

#### What are the methods for saving and loading voxel data?
> -- **Save to JSON** *(includes scene configs, human-readable, fastest)*

> -- **Export baked meshes to GLB** *(uses 'Load Bakes', supports Blender and other 3D software, slower)*

> -- **Save snapshots to ZIP archive** *(easy to share, browser storage limits, speed is variable)*

> -- **Save to VOX format** *(supports MagicaVoxel, very fast)*

#### Will WebGPU be supported?
> It was supported to some extent before, but was removed due to unnecessary complexity. But once it matures enough to be enabled by default in browsers, this upgrade will be possible with a few simple changes.

#### How to merge vertices after export to GLB?
> 1- Open exported GLB file in Blender

> 2- Go to "Modeling" tab and choose vertex selection mode

> 3- Select all vertices (Ctrl + A)

> 4- Mesh > Clean Up > Merge by Distance

#### How to run Blender importer script?
> 1- Save project to JSON

> 2- Open Blender and go to "Scripting" tab

> 3- Click "Open" and select "blender-importer.py"

> 4- Run the script and select a JSON file

#### How to go back to the previous version?
```
git clone https://github.com/nimadez/voxel-builder
cd voxel-builder
git log -2 (copy the hash of the previous commit)
git reset --hard $HASH
```

## History
```
↑ Advancing in the Renaissance Bubble
↑ A fundamental overhaul of the core
↑ Core initialization!
↑ Rendering was left to Three and three-gpu-pathtracer
↑ ES6 (the original index.html playground was moved)
↑ x1.5 faster startup (2s to 300ms)
↑ Migrating to Linux: Firefox ready
↑ High performance GPU picking system
↑ Voxel engine updated to thin-instances (64k to 512k)
↑ The world moved (from 0.0 to 0.5 center to avoid 0.5)
↑ Real-time GPU path tracing
↑ Introducing ES modules
↑ Advancing to the next level (bakery)
↑ Changed default handiness to right-handed coordinate
↑ New SPS particles to build the world
↑ 2019 - I wrote a playground for learning Babylon.js
```

Version 3.0.0 *(BJS 4)* to 4.2.2 *(BJS 6)*

![screenshot](media/devshots.jpg?raw=true "Screenshot")

## License
Code released under the [GPL-3.0 license](https://github.com/nimadez/voxel-builder/blob/main/LICENSE).

## Credits
- [Babylon.js](https://www.babylonjs.com/)
- [Three.js](https://threejs.org/)
- [Three-mesh-bvh](https://github.com/gkjohnson/three-mesh-bvh)
- [Three-gpu-pathtracer](https://github.com/gkjohnson/three-gpu-pathtracer)
- [Electron](https://www.electronjs.org/)
- [MagicaVoxel](https://ephtracy.github.io/)
- [Google Material Icons](https://github.com/google/material-design-icons)
- [Reinvented Color Wheel](https://github.com/luncheon/reinvented-color-wheel)
- [JSZip](https://github.com/Stuk/jszip)
- [Blender](https://blender.org/)
- [Inkscape](https://inkscape.org/)
- [GIMP](https://www.gimp.org/)
- [Sketchfab](https://sketchfab.com/)
- [KhronosGroup](https://github.com/KhronosGroup/)
- [Shadertoy](https://www.shadertoy.com/)
- [vengi](https://vengi-voxel.github.io/vengi/)
#
- [Allen Hastings](https://www.linkedin.com/in/allenhastings)
- [David Catuhe](https://twitter.com/deltakosh)
- [Erich Loftis](https://github.com/erichlof)
- [Eric Heitz](https://eheitzresearch.wordpress.com/772-2/)
- [Evan Wallace](https://github.com/evanw)
- [Garrett Johnson](https://github.com/gkjohnson)
- [Inigo Quilez](https://www.iquilezles.org/)
- [knightcrawler25](https://github.com/knightcrawler25)
- [Mr.doob](https://mrdoob.com/)
#

###### Available in [Babylon.js community demos](https://www.babylonjs.com/community/)