Generative Design [5]

1. Configurer une scène

  1. Un renderer (WebGL)

  2. Une camera pour filmer

  3. Une scène à filmer

2. Bouger la caméra

  1. Détecter si le browser supporte l'api Device Orientation

  2. Ecouter les événements de mouvements

  3. Calculer les angles de rotations sur base de la position du device

  4. Tourner la caméra sur base de la rotation

 

Utiliser une librairie

 

2. Bouger la caméra

3. Afficher la page en fullscreen

Full Screen API

3. Afficher la page en fullscreen

Astuce pour iOs Safari : Web App


<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />

4. Adapter le rendu pour Cardboard

4. Adapter le rendu pour Cardboard

5. Faire tourner les spheres

6. Animer la caméra le long d'un tracé

Un set de points

⬇️

Une courbe

⬇️

Un tube

7. Cibler une sphere avec le regard

Generative Design [5] [2016-2017]

By Louis Hoebregts

Generative Design [5] [2016-2017]

  • 220
Loading comments...

More from Louis Hoebregts