# AN3D: Bases du rendu graphique

# Contexte

On a l'habitude de voir des models 3D virtuels


**Conclusion: il est aise de concevoir et animer ses propres modeles 3D**

:::danger
FAUX !


:::


Outils:
- Blender
- Maya

Formation de 3 a 5 ans dans les ecoles d'infographie.

:::warning
Le cout/temp passe sur la 3D n'a jamais ete aussi elevve
:::

- Films animations/VFX
- Cout moyen par sequence VFX ($\lt10s$): 50k\$
- Cout animation 3D $\gt$ cout dessin manuel
- Jeu videos AAA
- 100M\$
- 2 a 4 annees de dev

:::success
Les outils 3D se sont ameliores

:::warning
Mais restent complexes et tres techniques (3 ans d'etude infographistes)
:::

:::

## Creation 3D

La quantite et la qualite demande a augmente plus rapidement que les outils


Dessins/sculpture a la main restent plus efficace pour le prototypage/design


# Equipe: Geometric & visual computing

- Equipe informatique graphique et vision

## Applications

Domaine d'applications typiques
- Loisirs & creations artistiques
- Modelisation & visualisation en Sciences Naturelles
- Prototypage et fabrication


Notre "expertise"
- Methode interactive pour l'aide a la creativite
- Simulation visuelles
- Analyses de formes et algorithmique

## Aide: stages, emploi, poursuite en Informatique Graphique ?

Rem. IG: Domaine technique, R&D avancee
- Lien fort sujets recherche et entreprise
- Theses IG - sujets appliques qui interessent les industries

Si le domaine vous interesse:
- AFIG

# Plan du cours

1. Introduction et rappels d'Info Graphique
2. Warm-up systeme de particules
3. Animation descriptive
4. Animation physique
5. Animation de personnages

# Evaluation

- Un compte rendu de tp
- Collision de spheres, tissus, ou personnage articule
- $\simeq5$ pages
- Notre demarche, resultats et analyses

# Computer graphics

## Main subfields

- Modeling
- Animation
- Rendering

## Representing 3D shapes for Graphics Application


- Computer graphics: mostly focus on representing surfaces
- Scientific visualization: volume data

# Surfaces
## Two main rpz


Representation d'une sphere:


## Difficulty of surface representation using function


:::success
C'est impossible, la forme est trop complexe
:::

## Objective of surface representation

Main idea: use **piecewise approximation**

Ideal surface representation
- Approximate well any surface
- Require few samples
- Can be rendered efficiently (GPU)
- Can be manipulated for modeling

Example of models:
- Mesh-based
- Triangular meshes, polygonal meshes, subdivision surfaces
- Polynomial
- Polynomial: bezier, spline NURBS
- Implicit
- grid, skeleton based, RBF, MLS
- Points sets

:::warning
For projective/rasterization render pipeline: always render **triangular meshes** at the end
:::

| Pros | Cons |
| ----------------------------------- | ------------------------------------------------- |
| Simplest representation | Requires large number of saples: complex modeling |
| Fit to GPU Graphics render pipeline | Tangential discontinuities at edges |

## Mesh encoding


## Example of 3D Mesh File


## Affine transforms and 4D vectors/matrices


## Perspective matrix

Perspective space: allows perspective projection expressed as a matrix.

Common constraints (in OpenGL):
- Wrap the viewing volume (truncated cone with rectangulare basis called `frutsum`) ($z_{near},z_{far},\theta$) to a cube
- $\theta: view angle$
- $p=(x,y,z,1)\in$ `frutsum` $\Rightarrow p'=(x',y',z',1)\in[-1,1]^30$


$$
M=\begin{pmatrix}
f&0&0&0\\
0&f&0&0\\
0&0&C&D\\
0&0&-1&0
\end{pmatrix}\\
f=\frac{1}{\tan(\frac{\theta}{2})}\\
L = z_{near}-z_{far}\\
C= \frac{z_{far}+z_{near}}{L}\\
D= \frac{2z_{far}z_{near}}{L}
$$

In practice
- You must define $z_{near}, z_{far}$
- $z_{far}-z_{near}$ should be as small as possible for max depth precsion

*To which view space are mapped 3D world space points at $z_{near}, z_{far}$ ?*

## Fractals

:::info
**Idea**
Recursively add self-similar details
:::
- Simple rule $\to$ complex shape
- May look like complex natural details



# Perlin noise

> A widely used *noise* function

Creer une fonction pseudo-aleatoire continue
- MAIS deterministe


On prend des echantillons a des valeurs entiere
- Pour chaque on associe une tangente
- Utilise une fonction de hash
- `float hash(float n) {return fract(sin(n)*1e4);}`


## Fractal Perlin Noise

On somme la fonction avec elle-meme en changeant ses parametres


$$
g(x)=\sum_{k=0}^N\alpha^kf(\omega^kx)
$$

- $f$: smooth Perlin noise function
- $N$: number of Octave
- $\alpha$: persistency
- $\omega$: frequency gain


## Usage

- Material texture 
- Ridge effect
- Marble effect
- Animated textures 
- Translation: $f(x,y+t)$
- Smooth evolution: $f(x,y,t)$
- Moutain-looking terrain 
- $z=f(x,y)$

## Applications

In almost any complex shape


## Exercice
### Perlin Noise terrain

$$
S(u,v)=\begin{cases}
x(u,v)=u\\
x(u,v)=v\\
z(u,v)=hg(s(u+o), s(v+o))
\end{cases}
$$

The perlin noise

$$
g(u,v)=\sum_{k=0}^N\alpha^kf(2^ku,2^kv)
$$

$$
N=9\\
\alpha=0.4\\
h=0.3\\
s=1\\
o=0
$$


- b: $N$ modifie
- a: $s$ modifie
- Les montagnes du fond sont des "nouvelles" montagnes
- on voit plus loin
- f: $o$ modifie
- e: $h$ modifie

### Animation

Reference surface function:

$$
(u,v)\in[0,1]^2, f(u,v)=(u,v,0)
$$

*How to generate the following animations ?*

> **Help**
> Dimension of the Perlin noise ?
> Which parameter $(u,v,t-\text{time})$ ?


- a: axe $z$ qui change
- $f(u,v)=(u,v,p(u+t))$
- Faux! $u+t$ nous fait deplacer dans les $t$ negatifs
- $f(u,v)=(u,v,p(u-t))$
- b: $f(u,v)=(u,v,p(u+t, v))$
- c: piege !
- On a le droit au bruit de Perlin 3D
- $(u,v,p(u,v,t))$

:::warning
Quand on a des textures animees a partir de bruit de Perlin, il y a une dimension supplementaire: le temps
:::

- d: similaire a la c
- e: $f(u,v)=(u,v,p(u-t)+up(u,v,t))$
- Multiplication par $u$ car le bruit est plus important a la fin
- v: on ne change pas que $z$ cette fois
- $f(u,v)=(u+p(u,v,t),v+p(u,v,t), p(u,v,t))$

# Geometry processing libraries

Development libraries
- LibIGL
- CGAL
- GeoGram

Viewer (+lib)
- Graphite
- Meshlab

Software
- Blender

## Useful CG programming library

Useful libs
- Eigen
- GLM
- Assimpl
- DevIL

Minimalistic GUI
- ImGui
- NanoGui
- AnTweakBar

Full framework
- Qt

# Particle system

:::info
**Definition**
Element at a given position + extra parameters (mass, life time, etc)
:::

On appelle un systeme de particules en oppositionL
- Rigid bodies - Solid objects with static shape
- Deformable bodies - Continuum material that can deforms

| Pros | Cons |
|:------------------------------------------------------------------ |:--------------------------------------- |
| Lightweight rpz | Simple model from physics point of view |
| Generic flexible model (spatial deformation, no connectivity, etc) | |

## Particles systems in History

One of the first animated model in CG


## Example of particle system

Free fall of sphere under gravity
- Geometrical rpz of each particle: sphere
- Equation of motion $p(t)=\frac{1}{2}gt^2+v_0t+p_0$
- Initial position and speed may be placed at random position
- Each particle may have a different life time


*What are the parameters used for $p_0$ and $v_0$ in this example ?*

$$
p_0=(0,0,0)\\
v_0=(\sin(), 1,\cos())
$$

Si on a un $\sin$ du temps, on aurait des particules emises suivant un cercle


> Genre comme ca

Or, nos particules ne suivent pas ce cerlce, elles suivent un *nombre aleatoire* $\theta$:

$$
v_0=(\sin(\theta), 1,\cos(\theta))
$$
> Par exemple, $\theta\in[-\pi,\pi]$

## Bouncing spheres


*What is the equation of motion (taking into account the bouncing) ?*
- Considere a particle emited at time $t=0$
- At what time $t_i$, the particle touch the floor ?
- What is the new speed after impact ?
- What is the complete equation of trajectory ?

$$
t_i=\\
p(t)=\frac{1}{2}gt^2+v_0t\\
p_g(t_i)=0\\
\begin{aligned}
\frac{1}{2}g_yt_i^2+v_{og}t_i=0&\Rightarrow\frac{1}{2}g_yt_i=-v_{oy}\\
&\Rightarrow=-2\frac{v_{oy}}{g_y}
\end{aligned}\\
p(t_i)\quad v(t_i)\to\begin{pmatrix}
V_x\\
-V_y\\
V_z
\end{pmatrix}\\
p_2(t)=\frac{1}{2}g(t-t_i)^2+v'(t_i)(t-t_i)+p(t_i)
$$

## General motions

:::success
Motion equation is not restricted to physics-based equations
:::


- *What are the parameters associated to each particle ?*
- *What are the corresponding equations of motions ?*

> On dirait que les bulles sortantes bougent en forme de cercle
> 

$$
\text{rand}\to[0,1]\\
p_0=(?,0,?)
$$

*Comment faisons-nous pour recreer le cercle ?*
> On randomise $x$ et $y$ entre $-1$ et $1$
> Or ca nous fais un carre et on veut un cercle
> On tire au hasard 2 rayons $r_1$ et $r_2$


$$
\sqrt{r_1^2+r_2^2}\gt R\\
\begin{cases}
R\cos(\theta)\\
R\sin(\theta)
\end{cases}
$$
Avec:
- $r_1, r_2\in[0,R]$

:::success

On a donc $p_0,v_0,R,C$

$$
p(t) = p_0+v_0(t-t_0)+\begin{pmatrix}
r\cos(\theta t-t_0+\gamma)\\
r\sin(\theta t-t_0+\gamma)\\
0
\end{pmatrix}
$$
Avec:
- $\gamma$: un offset aleatoire

:::

# Billboards, impostors, sprites

:::info
Particle can be displayed as small images/thumbnails
:::

In practice:
- Each particle is displayed as a quadrangle
- A texture is mappe on the quad


- The texture can contains transparency

## Usage

Large use of billboard for complex models
- vegetation, fire, etc.


## Example


## Use case in production

> Le seigneur des anneaux

*Comment on ete fait ces chevaux liquides ? Comment a ete filme la scene ?*
> Il n'y a que des vrais chevaux sur la scene
> Pour l'eau, les chevaux ont ete fait a partir d'emission de particules

> Zoom sur une chute d'eau

> La base des tetes de chevaux

> Couches de particules emisent a partir des tetes

> Ensemble final

> La riviere

> Les vrais chevaux, qui ne meurent pas

> Faux chevaux et cavaliers modelises pour etre emporte par la riviere