Wave-Particles-with-Interactive-Vortices

KO | EN

gitlite — search

#javascript #go #android #machine-learning #deep-learning #linux #macos #nodejs #windows #vue #awesome-list #pytorch #openai #mcp

Wave-Particles-with-Interactive-Vortices

(★ 292)

A dx12 river renderer using wave particles with interactive vortices.

File Explorer

Download Latest Version (.zip)

- 1.jpg
- 2.JPG
- 3.JPG
- 4.JPG
- 5.JPG
- dissipation.gif
- final.gif
- m1-1.gif
- m1-2.gif
- m1-3.gif
- m2-1.gif
- m2-10.gif
- m2-2.gif
- m2-3.gif
- m2-4.jpg
- m2-5.gif
- m2-6.gif
- m2-7.gif
- m2-8.gif
- m2-9.gif
- m2fluid1.gif
- m2fluid2.gif
- m2fluid3.gif
- m3-1.gif
- m3-2.gif
- m3-3.gif
- mousecontrol.gif
- v2render.gif
- v2render2.gif
- v3render.gif
- wprender.gif
- - 0.JPG
  - 1.jpg
  - camera.JPG
  - mesh.JPG
  - renderer.JPG
  - scene.JPG
  - shader.JPG
  - texture.JPG
  - WPWIV_m1.pdf
- - WPWIV_m2.pdf
- - WPWIV_m3.pdf
- Wave Particles with Interactive Vortices - One Page.docx
- Wave Particles with Interactive Vortices - One Page.pdf
- Wave Particles with Interactive Vortices.docx
- WPWIV_final.pdf
- - AdvectPS.hlsl
  - Camera.cpp
  - Camera.h
  - checkerboard.jpg
  - ComputeDivergencePS.hlsl
  - CreateObstaclePS.hlsl
  - CreateObstacleVS.hlsl
  - DomainShader.hlsl
  - flow1.jpg
  - flow2.jpg
  - foam.jpg
  - Frame.cpp
  - Frame.h
  - GlobalInclude.h
  - GlobalInclude.hlsli
  - HullShader.hlsl
  - imgui.ini
  - JacobiPS.hlsl
  - main.cpp
  - Mesh.cpp
  - Mesh.h
  - ob1.jpg
  - ob3.jpg
  - ObstacleDS.hlsl
  - ObstacleHS.hlsl
  - ObstaclePS.hlsl
  - ObstacleVS.hlsl
  - PixelShader.hlsl
  - PostProcessObstaclePS_H.hlsl
  - PostProcessObstaclePS_V.hlsl
  - PostProcessPS_H.hlsl
  - PostProcessPS_V.hlsl
  - PostProcessVS.hlsl
  - ps.hlsl
  - Renderer.cpp
  - Renderer.h
  - Scene.cpp
  - Scene.h
  - Shader.cpp
  - Shader.h
  - SplatDensityPS.hlsl
  - SplatVelocityPS.hlsl
  - SplatVelocityWithVorticityPS.hlsl
  - SubtractGradientPS.hlsl
  - Texture.cpp
  - Texture.h
  - VertexShader.hlsl
  - vs.hlsl
  - wave.jpg
  - WaveParticlePS.hlsl
  - WaveParticleVS.hlsl
  - WPWIV.vcxproj
  - WPWIV.vcxproj.filters
  - WPWIV.vcxproj.user
- WPWIV.sln
LICENSE
README.md

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

Wave Particles with Interactive Vortices
========================

## Final Result

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/final.gif)

## Overview

In game industry water can be divided into two domains, ocean and river. This project focuses on river. Not too long ago, a demo of [a real-time river editor](https://80.lv/articles/river-editor-water-simulation-in-real-time/) was developed by graphics programmer [Jean-Philippe Grenier](http://jpgrenier.org/) from Ubisoft(now Unity). We think what he did was awesome and want to replicate it (as possible as we can).

[![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/1.jpg)](https://www.youtube.com/watch?v=--B6QZKwsdA)

Traditionally, rivers are rendered using flow maps. Flow maps are generated by fluid simulations or created by artist or even both. Flow maps are used for advection of water properties such as normal and uv. This technique can give the river a deterministic fluid look, but it fails to capture the sense of height compared with the less controlled ocean rendering techniques, which basically stack several noise functions together to generate the waves. Stacking noise functions together only works for ocean because the ocean does not flow. When you want the water both flow and have the sense of height, a new method should be used.

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/2.JPG)

###### (picture from Rendering rapids in Uncharted 4 by Carlos Gonzalez-Ochoa, Siggraph 2016 Advances in Real-Time Rendering in Games course)

The new method is [Wave Particles](http://www.cemyuksel.com/research/waveparticles/waveparticles_sketch_slides.pdf). Initially, Wave Particles were introduced into game industry by [Naughty Dog for Uncharted 3](https://www.gdcvault.com/play/1015309/Water-Technology-of) to simulate local high frequency wave of oceans. Then it was adopted and adapted to render rivers by [Naughty Dog for Uncharted 4](http://advances.realtimerendering.com/s2016/s16_ramy_final.pptx) paired with stacking technique.

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/5.JPG)

###### (picture from Implementing Wave Particles for Real-time Water Waves 2007)

The significance of the Jean-Philippe Grenier's work is that it generates flow map in real-time. That is why the user can interactively create rocks to block the river and affect the flow of river as we can see in the video. When performing advection on height and normal, previous implementations from Naughty Dog or [Valve](http://advances.realtimerendering.com/s2010/Vlachos-Waterflow(SIGGRAPH%202010%20Advanced%20RealTime%20Rendering%20Course).pdf) use noise and blending techniques to minimize repetition and pulsing caused by advection of a finite sized texture. But in this demo the developer used a new technique called [Wave Profile Buffer](http://pub.ist.ac.at/group_wojtan/projects/2018_Jeschke_WaterSurfaceWavelets/WaterSurfaceWavelets.pdf) to solve the repetition and pulsing.

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/3.JPG)

###### (picture from Water Flow in Portal 2 by Alex Vlachos, Siggraph 2010 Advances in Real-Time Rendering course)

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/4.JPG)

###### (picture from Rendering rapids in Uncharted 4 by Carlos Gonzalez-Ochoa, Siggraph 2016 Advances in Real-Time Rendering in Games course)

## Goals

* Simple wave particle rendering.

* Combine wave particle with flow map.

* Update flow map in real-time.

* Identify and solve the problems caused by advection of height, uv, normal. (extra features)

## Milestones

- [x] Milestone 1

- [x] DX12 frame work

- [x] Tessellation shader

- [x] Basic Interaction

- [x] Basic UI

- [x] Basic wave particle rendering

- [x] Single particle

- [x] Milestone 2

- [x] Advanced wave particle rendering

- [x] Multiple particles

- [x] Combine flow map with wave particle

- [x] Find some interesting flow maps

- [x] Use flow map to advect wave particle

- [x] Fluid simulation

- [x] Milestone 3

- [x] Improve rendering method

- [x] Foam

- [x] Update flow map in real-time

- [x] Create blockers (rocks and etc.)

- [x] Advect properties using simulation result

- [x] Final

- [x] Finish unfinished work

- [x] Identify the problems caused by advection of height, uv, normal

## Milestone 1 Update

* Camera Interaction

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/m1-1.gif)

* Wave Praticle Scale

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/m1-2.gif)

* Tessellation level

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/m1-3.gif)

## Milestone 2 Update

* Radius

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/m2-1.gif)

* Speed

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/m2-2.gif)

* Wave particle with flow map

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/m2-3.gif)

* Flow map

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/m2-4.jpg)

* Flow map driven texture

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/m2-5.gif)

* Wave particle

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/m2-6.gif)

* Horizontal blur

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/m2-7.gif)

* Vertical blur

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/m2-8.gif)

* Horizontal and vertical blur

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/m2-9.gif)

* Wave particle driven deviation

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/m2-10.gif)

* Fluid with different cell size

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/m2fluid1.gif)

* Fluid with different impulse location

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/m2fluid2.gif)

* Influence of fluid density/velocity dissipation

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/dissipation.gif)

* Flow map we will be using to guide the movement of wave particles

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/m2fluid3.gif)

## Milestone 3 Update

* Specularity

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/wprender.gif)

* Fluid sim with vorticity confinement

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/m3-1.gif)

* Divergence

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/m3-2.gif)

* Divergence as foam

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/m3-3.gif)

* Render with interactions

![](https://raw.githubusercontent.com/ACskyline/Wave-Particles-with-Interactive-Vortices/master/img/v3render.gif)

## References

[River Editor Water Simulation in Real-Time](https://80.lv/articles/river-editor-water-simulation-in-real-time/)

[Wave Particles Slides](http://www.cemyuksel.com/research/waveparticles/waveparticles_sketch_slides.pdf)

[Wave Particles Paper](http://www.cemyuksel.com/research/waveparticles/cem_yuksel_dissertation.pdf)

[Water Surface Wavelets](http://pub.ist.ac.at/group_wojtan/projects/2018_Jeschke_WaterSurfaceWavelets/WaterSurfaceWavelets.pdf)

[Uncharted 3 Ocean Rendering](https://www.gdcvault.com/play/1015309/Water-Technology-of)

[Uncharted 4 River Rendering](http://advances.realtimerendering.com/s2016/s16_ramy_final.pptx)

[Valve Flow Map](http://advances.realtimerendering.com/s2010/Vlachos-Waterflow(SIGGRAPH%202010%20Advanced%20RealTime%20Rendering%20Course).pdf)

[A 2D Fluid Solver](https://prideout.net/blog/old/blog/index.html@p=58.html)

[GPU Gems: Fast Fluid Dynamics Simulation on the GPU](https://developer.nvidia.com/gpugems/GPUGems/gpugems_ch38.html)

[A Similar Workflow](https://pdfs.semanticscholar.org/f548/cc7476e2e7e53b42befa19a376b61d12c7e9.pdf)

[Caustics](http://madebyevan.com/webgl-water/)

Wave-Particles-with-Interactive-Vortices

File Explorer

Today's picks

Was this content helpful?

Recent Feedback

Wave-Particles-with-Interactive-Vortices

File Explorer

Today's picks

Was this content helpful?

Recent Feedback

Download README