Design a Voxel Rendering
Engine for iOS
Shipeng Xu
20 Oct 2017
@1991bill
Slide 2
Slide 2 text
What is Voxel?
● Volume Pixel
● Data Structure
○ Integral X, Y, Z coordinates
○ Color
Pokemon Voxel, Playiku, 2016
Slide 3
Slide 3 text
No content
Slide 4
Slide 4 text
Voxel Rendering Engine for iOS
● Rendering
○ Beautiful
● Performance
○ Blocks can be added or removed at interactive speeds
○ E.g. A 64x64x64 voxel world = 262,144 voxels!
Add Delete Move
Change Color
Slide 5
Slide 5 text
Rendering - 1 Voxel
12 Triangles
Slide 6
Slide 6 text
Rendering - 5,911 Voxels
Slide 7
Slide 7 text
Rendering - Meshing
● Naive way...
● Draw a 3D cube for each voxel.
○ 5,911 Voxels
○ 5,911 x 12 = 70,932 triangles
Slide 8
Slide 8 text
Rendering - Meshing
● Skip the unseen voxels
○ Before: 5,911 Voxels
■ 5,911 x 12 = 70,932 triangles
○ After: 5,868 triangles
■ 8.2% of original
Slide 9
Slide 9 text
Rendering - Meshing
Slide 10
Slide 10 text
● Combine small faces into bigger ones
Rendering - Meshing
280 Triangles 22 Triangles(7.9%!)