Our project aims to create a simulation of butterflies and control their behaviors using WebGPU. We created a hierarchical rigged skeleton for the butterfy, animated the butterflies by using the bones, and used instancing to increase the performance so that it can run in realtime.
- Final Presentation - 12/12/22
- Milestone 3 - 12/05/22
- Milestone 2 - 11/28/22
- Milestone 1 - 11/16/22
- Pitch - 11/6/22
- Robust glTF Loader with Texture, Material, and Joints Loading and PRB Shading
- Loading glTF files with skeleton information and PBR-based materials
- Support loading multiple glTF meshes.
- Very robust, if a glTF file is missing a certain object like BaseColor Texture, we can still handle it.
- Procedural Butterfly Color
- Procedurally change the color for each newly instanced butterfly
- Control GUI
- We created a UI that allows the user to change many key parameters for the simulation, such as the number of the butterflies, behaviors, and colors so that the user can easily see the visual effects of different scenes easily.
- Distance Fog
- Using distance-based fog to hide the boundary of the scene
- WebGPU Compute and Rendering Pipeline
- Compute shaders compute the new joint transformations and deform the butterfly mesh accordingly
- The pipeline makes adding more parameters to the simulation very easy
- Instanced Rendering with Animations
- Instancing rendering ensures minimum memory consumption and maximum rendering performance
- Instancing with varying animations and behaviors for each instance/
- Hierachy Skeleton Loader and Mesh Deformer
- We rigged the butterfly mesh with Blender and successfully use our pipeline and the skeleton to deform the mesh.
- Joint hierachy is correctly maintained and used in computation. A novel algorithm is used to solve the problem that there is no recursion in the shaders.
- Butterfly Simulations
- Currently we have simple procedurally generated path and simple forces like gravity and wind for the butterfly
- Behavior Controls
- Seek: all the butterflies will seek a position and gather there.
- Departure: all the butterflies will go to the opposite position of the target position.
- Wander: the butterflies will wander around in the space
We enjoyed this project and we are planning on improve this project by adding more features and improving the performances.
Here are a few things we want to add:
- Add more behaviors, such as collision avoidance, lead, and cohesion.
- Add more options to the UI, such as switching different scenes.
- Add more procedural options, such as more patterns for the butterfly wings and more shapes
- Add a physically-based aerodynamic simulations for the butterfly flights
- A Practical Model for Realistic Butterfly Flight Simulation
- Efficiently rendering glTF models - A WebGPU Case Study
- WebGPU Samples
A very cool blooper when we were trying to add a group behavior that makes all butterflies spin around a circle.