Nous récupérons la partie fractionnelle ([```fract()```](../glossary/?search=fract)) d'une fonction de sinus [```sin()```](../glossary/?search=sin).
Le sinus oscille entre ```-1.0``` et ```1.0``` et on récupère les chiffres après la virgule ce qui annule le signe (- ou +) et retourne une valeur absolue.
Nous pouvons utiliser ce procédé pour obtenir des valeurs *pseudo-aléatoires* en cassant cette oscillation en petits morceaux.
Comment?
Comment?
En multipliant le résultat de [```sin(x)```](../glossary/?search=sin) par un grand chiffre.
Essayez d'ajouter quelques zéros au multiplicateur de ```sin(x)``` dans le code ci-dessus.
En arrivant à ```100000.0``` (l'équation ressemble à: ```y = fract(sin(x)*100000.0)```), il n'est plus possible de distinguer l'oscillation de la sinusoïde.
En arrivant à ```100000.0``` (l'équation ressemble à: ```y = fract(sin(x)*100000.0)```), il n'est plus possible de distinguer l'oscillation de la sinusoïde.
La granularité de la partie fractionnelle a altéré les valeurs de la sinusoïde au point de la transformer en chaos pseudo-aléatoire.
## Contrôler le chaos
@ -39,7 +39,7 @@ En regardant la distribution des valeurs en Y, vous noterez également que les v
//y = pow(rand(x),5.);"></div>
Il y a quelques temps, [Pixelero](https://pixelero.wordpress.com) a publié un [article sur les distributions aléatoires](https://pixelero.wordpress.com/2008/04/24/various-functions-and-various-distributions-with-mathrandom/).
J'ai jaouté quelques une des fonctions dont il se sert dans l'exemple ci-dessus pour que vous voyiez comment modifier une distribution.
J'ai ajouté quelques une des fonctions dont il se sert dans l'exemple ci-dessus pour que vous voyiez comment modifier une distribution.
Décommentez les lignes pour voir comment chacune se comporte.
Si vous avez lu l'[article de Pixelero](https://pixelero.wordpress.com/2008/04/24/various-functions-and-various-distributions-with-mathrandom/), il est important de garder à l'esprit que notre fonction ```rand()``` est *déterministe*, aussi appelée *pseudo-aléatoire*.
@ -53,8 +53,8 @@ Nous aurons besoin pour ça de transformer un vecteur à deux dimensions en un c
Il y a plusieurs façons de procéder mais la fonction [```dot()```](../glossary/?search=dot) nous sera particulièrement utile dans ce cas précis.
Elle retourne un chiffre compris entre ```-1.0``` et ```1.0``` en fonction de l'alignement de deux vecteurs normalisés.
[NDT]le dot product ou produit scalaire renvoie le cosinus de l'angle formé par deux vecteurs normalisés.
il permet donc de retrouver l'angle formé par les 2 vecteurs et de déterminer si les 2 vecteurs *pointent* dans la même direction.[/NDT]
Le _dot product_ ou produit scalaire renvoie le cosinus de l'angle formé par deux vecteurs normalisés.
Il permet donc de retrouver l'angle formé par les 2 vecteurs et de déterminer si les 2 vecteurs *pointent* dans la même direction.
@ -66,7 +66,7 @@ Aux lignes 13 à 15, nous utilisons le résultat du ```dot()``` de ```vec2 st```
## Utiliser le chaos
L'aléatoire en 2D ressemble à la neige d'un téléviseur, n'est-ce pas? C'est un métariau brut, difficile à utiliser tel quel pour construire une image, apprenons à mieux en tirer parti.
L'aléatoire en 2D ressemble à la neige d'un téléviseur, n'est-ce pas? C'est un métariau brut, difficile à utiliser tel quel pour construire une image, apprenons à mieux en tirer parti.
Notre première étape consistera à appliquer une grille ; en se servant de la méthode [```floor()```](../glossary/?search=floor), nous allons créer un tableau de cellules.
Regardez bien le code suivant, notamment les lignes 22 et 23.
@ -77,11 +77,11 @@ Après avoir multiplié l'échelle par 10 (ligne 21), nous séparons la partie e
C'est une opération dont nous nous sommes servis au dernier chapitre, elle nous permet de subdiviser l'espace et d'obtenir des cellules dont les coordonnées sont normalisées entre ```0.0``` et ```1.0```.
La partie entière (le vecteur ```vec2 floor(st)```) des coordonnées nous donne une valeur commune à chaque cellule, ce qui nous permet de trouver une valeur aléatoire pour chaque cellule plutôt que pour chaque fragment.
Du fait de la nature déterministe de notre fonction ```rand()```, la valeur retournée par la fonction lorsqu'on lui passe plusieurs fois le même vecteur sera la même.
Comme tous les fragments d'un cellule passeront le même argument ```ipos``` à la fonction ```rand()```, tous les fragments d'une cellule obtiendront la même couleur.
Comme tous les fragments d'une cellule passeront le même argument ```ipos``` à la fonction ```rand()```, tous les fragments d'une cellule obtiendront la même couleur.
Décommentez la ligne 29 pour voir que nous conservons également la partie fractionnelle des coordonnées. Nous pouvons toujours utiliser ces coordonnées pour dessiner quelque chose dans la cellule.
En combinant les deux valeurs - la partie entière et la partie fractionnelle des coordnnées - permet de créer des variations et de faire des mélanges de nos valeurs aléatoires.
En combinant les deux valeurs - la partie entière et la partie fractionnelle des coordonnées - permet de créer des variations et de faire des mélanges de nos valeurs aléatoires.
Regardez cette implémentation du célèbre générateur de labyrinthes ```10 PRINT CHR$(205.5+RND(1)); : GOTO 10```:
@ -93,12 +93,12 @@ Vous pouvez obtenir un motif intéressant en décommentant les lignes 50 à 53,
## Maîtriser l'aléatoire
[Ryoji Ikeda](http://www.ryojiikeda.com/), un compositeur et artiste japonais maîtrise l'utiliosation de l'aléatoire ; difficile de ne pas être touché par son oeuvre.
[Ryoji Ikeda](http://www.ryojiikeda.com/), un compositeur et artiste japonais maîtrise l'utilisation de l'aléatoire ; difficile de ne pas être touché par son oeuvre.
Dans ses oeuvres audio et vidéo, il utilise l'aléatoire de telle façon que ce n'est pas une série ennuyeuse de variations accidentelles mais plutôt un mirroir de la complexité de notre culture technologique.
Reagrdez le travail d'[Ikeda](http://www.ryojiikeda.com/)et essayez les exercices suivants:
Reagrdez le travail d'[Ikeda](http://www.ryojiikeda.com/)et essayez les exercices suivants:
* Faites des rangées de cellules qui bougent dans des directions opposées, à des vitesses aléatoires. N'affichez que les cellules les plus lumineuses. Faites varier les vitesses dans le temps.
@ -112,9 +112,9 @@ Reagrdez le travail d'[Ikeda](http://www.ryojiikeda.com/)et essayez les exercice
Utiliser l'aléatoire de façoon esthétique peut être difficile, en particullier si vous recherchez un rendu *naturel*.
Utiliser l'aléatoire de façon esthétique peut être difficile, en particullier si vous recherchez un rendu *naturel*.
L'aléatoire est beaucoup trop chaotique et dans la *vraie vie*, très peu de choses paraissent aussi aléatoires.
Si vous regardez la pluie ou le cours de la bourse, qui sont tous les deux aléatoires, vous verrez qu'ils n'ont rien en commun avec la méthode que nous avons créé en début de chapitre.
Pourquoi? Les valeurs aléatoires ne sont pas corrélées entre elles, alors que les phénomènes naturels conservent souvent une trace de leur état précédent.
Pourquoi? Les valeurs aléatoires ne sont pas corrélées entre elles, alors que les phénomènes naturels conservent souvent une trace de leur état précédent.
Au prochain chapitre, nous allons étudier le *bruit*, une manière plus *organique* de créer du chaos dans un shader.
Yvan Sraka
6 years ago