Le 21 avril 2018 j’ai décidé de me mettre un défi : faire une expérimentation en code de manière quotidienne sans date de fin.

Cette article est un bilan du pourquoi et du but de ce challenge. Tu peux également le lire dans sa version originale en anglais.

Qui suis-je ?

Premièrement, je suis un étudiant de 22 ans aux Gobelins à Annecy et ancien étudiant de MMI Chambéry. Je suis en alternance à Ladydinde où je fais des sites webs et des des applications. Je suis de nature très curieux et j’adore expérimenter. J’aime construire des outils qui génèrent des images.

Qu’est-ce que ce projet ?

Le but premier de ce projet était de me donner un bac à sable pour construire ce que je voulais, sans contraintes de clients, de professeurs, de délais ou autre. Ça m’a aussi permis d’améliorer mes compétences sur différentes technologies. À travers ces expérimentations, j’ai découvert de nouvelles disciplines et de nouvelles manières de faire du code.

Je vais essayer d’expliquer mon parcours créatif, ce que j’ai appris, quelle était ma méthode, quelle est-elle maintenant et enfin comment je considère mon travail. Faisons donc le bilan de 8 mois de « daily experiments ».

Shaders, GLSL & magie

Quelques semaines avant de prendre la décision de faire des daily experiments, j’avais commencé The Book of Shaders de Patricio Gonzalez Vivo. Intrigué par ce monde étrange des shaders, mes premières expérimentations furent des fragments shaders.

Un shader est une petite fonction qui s’exécute pour chaque pixel de l’écran. Grâce à cette manière de dessiner, il n’est pas facile de faire des cercles, des carrés ou des lignes mais comme on contrôle les pixels, on contrôle l’écran.

01 — 18.04.21
01 — 18.04.21

Voici donc ma toute première expérimentation. Avec le recul, je peux voir ce qui ne va pas. Il n’y a aucune composition, pas d’harmonie des couleurs, pas de mouvements intéressants et ce n’est même pas une démonstration technique. Mais ce sont des points que je vais essayer d’améliorer dans les mois qui suivent.

La découverte d’un nouveau monde

À partir de ce moment et jusqu’au mois d’août (une période de 4 mois), mon travail était essentiellement composé de shaders simples. Mon process était de techniquement tester des choses à propos de ce langage, nouveau pour moi. Chaque jour, je n’avais aucune idée de quel allait être le résultat. Je créais en essayant des choses avec des équations et des formes que je trouvais visuellement intéressantes. Une fois que j’avais trouvé une piste, j’essayais de manipuler le code en jouant sur les paramètres, le tempo et les couleurs pour obtenir un résultat satisfaisant.

35.05 - 18.05.25 (day 35 - 5th output)
35.05 – 18.05.25 (day 35 – 5th output)

 

35.09.1 - 18.05.25 (day 35 - 9th output - version 1)
35.09.1 – 18.05.25 (day 35 – 9th output – version 1)

Mes inspirations étaient encore une fois tirées de The Book of Shaders, plus pour l’intérêt technique que pour l’intérêt graphique. Pendant tout ce temps, j’étais clairement plus concentré sur la technique (qui n’était pas incroyable !). La plupart de mes travaux effectués pendant cette période n’étaient pas vraiment intéressant. Avec le recul, seulement une petite partie me semble bien mais en parallèle j’ai découvert et acquis des fondamentaux dans ce domaine.

47 - 18.06.06
47 – 18.06.06

Parfois je trouvais un pattern ou un morceau de code intéressant que j’explorais pendant quelques jours en le faisant varier de différentes manières. Ceci me permettait d’avoir une base pour démarrer pour quelques jours et facilitait mon travail. Aussi je pouvais être plus concentré sur le résultat.

Voir les GIFs sur l’article original

Textures

Après 4 mois de shaders avec seulement des couleurs et des formes, j’ai décidé de travaillé avec des textures. Utiliser des images me donnait visuellement un point de départ à déformer, animer et modifier.

142.18.09.09
142 – 18.09.09

Grâce à la magie des shaders (que certains appellent maths) il est très facile de créer des kaleidoscope avec votre image et de l’animer. Vous pouvez faire varier le nombre de division, le mouvement (avant, arrière, rotation etc.), ajouter de la déformation et bien d’autres choses.

Voir les GIFs sur l’article original

Raymarching

Mi-septembre j’étais de retour en cours où nous avons commencé à étudié le WebGL. J’ai appris à construire des objets 3D dans un navigateur mais surtout j’ai découvert l’existence du raymarching. C’est ainsi que j’ai plongé dans cette nouvelle manière d’utiliser les shaders. Les premiers essais étaient des cubes déformés ou soustraits avec une sphère. Pour être claire, les exemples qui suivent ne sont pas des objets 3D créés en WebGL, ce sont des shaders.

Voir les GIFs sur l’article original

J’ai aussi commencé à regarder des tutoriels de la chaîne The Art of Code qui sont incroyable ! Une manière claire et simple de comprendre de petits extraits de code. Ces apprentissages m’ont permis d’améliorer mes connaissances et ma maîtrise des shaders et du raymarching.

 

180 - 18.10.17
180 – 18.10.17

 

205 - 18.11.11
205 – 18.11.11

Deux exemples de shaders inspirés par du code tiré de tutoriels de The Art of Code.

Ce fut une période brève où j’ai juste appris à créer différents types de primitives : cube, sphere, torus etc. De manière générale, mon travail consistait à les combiner et les faire bouger dans ma scène. Je n’ai pas vraiment pris le temps de savoir gérer des lumières ou d’autres spécificités du raymarching. Ceci était principalement du à une fin de projet scolaire et une envie de passer à autre chose.

Voir les GIFs sur l’article original

Les shaders étaient vraiment amusants et je suis toujours curieux de mieux comprendre comment construire des images et des vidéos en GLSL. J’ai l’impression de n’avoir qu’effleuré la surface d’un monde fou de possibilités. Je garde donc les shaders dans un coin de ma tête.

L’art génératif

Entre octobre et novembre, je me suis beaucoup questionné à propos de mon travail. J’avais l’impression que les shaders commençait à m’ennuyer un peu. J’ai donc essayé de revenir à un domaine plus familier : l’art génératif.

En effet, un de mes premiers projets en Javascript fut pour un projet scolaire d’arts plastiques en 2016. Il s’appelait Glotch et le principe était de détruire une image pour en créer une nouvelle. J’ai aussi fait quelques sketchs sur Codepen durant le printemps 2017.

C’est ainsi que pendant cette période de questionnement en novembre 2018, j’ai expérimenté de nouvelles choses avec un canvas mais sans résultats satisfaisants. Puis début décembre, j’ai commencé à retrouver l’inspiration et j’ai produis des choses plus intéressantes. Je me suis posé beaucoup de questions à propos du code et de sa place dans l’art, comment construire une oeuvre d’art, qu’est-ce que ça voulait dire d’être artiste et pleins d’autres choses. J’ai trouvé des pistes de réflexions dans cet article de Tyler Hobbs.

235.18.12.11.4
235.18.12.11.4

 

235.18.12.11.5
235.18.12.11.5

 

253 - 18.12.29.1
253 – 18.12.29.1

 

253 - 18.12.29.2
253 – 18.12.29.2

Ma manière de travailler a aussi changé. Quand j’explorais les shaders, je me disais « oh, ce morceau de code me donne un truc cool, je le garde ! ». Maintenant, j’ai plein d’images sur mon téléphone et mon ordinateur, j’étudie quelle partie graphique a attiré mon oeil et j’expérimente autour de ça. Parfois ça me donne de jolis résultats que j’explore à ma façon mais il est arrivé une fois que je recommence tout quatre fois de suite.

J’ai donc commencé à être plus attentif aux formes, aux couleurs et aux répétitions. J’ai essayé d’être plus concentré sur la composition d’image que sur l’apprentissage technique.

248.18.12.24.1
248.18.12.24.1

 

248.18.12.24.2
248.18.12.24.2

 

248.18.12.24.3
248.18.12.24.3

J’ai arrêté de produire des gif animés pour être plus focus sur ce le résultat de l’image. Ça m’a aussi permis d’être plus concentré sur le processus de création et pas sur les performances d’affichages. J’ai imprimé quelques-uns de mes travaux et tracés d’autres (with Line-us plotter).

Line-us

Parfois j’ai utilisé un traceur (plotter en anglais) dans mon travail. À cause des imperfections du Line-us, mes tracés n’étaient jamais parfaits. Dans un sens, il en résulte un sentiment organique que j’aimerai plus exploiter dans mes prochaines expérimentations.

250.18.12.26.1
250.18.12.26.1

 

250.18.12.26.2
250.18.12.26.2

 

251.18.12.27.1
251.18.12.27.1

 

251.18.12.27.2
251.18.12.27.2

Conclusion et futur

J’ai commencé ce challenge sans idée précise de où j’allais. À travers différentes technologies et manières de faire, j’ai progressivement compris des choses à propos de moi-même et de mon travail.

Produire quelque chose chaque jour est parfois compliqué. D’un autre côté, ça me permet de construire, tester et expérimenter. J’ai montré environ 30 images et animations représentant 8 mois de travaux. Rien dans mon travail n’est parfait. Parfois c’est juste mauvais mais parfois je suis content et fier de ce que j’ai fais.

J’ai toujours voulu dessiner mais je n’ai jamais su comment faire avec un crayon. Donc je dessine avec des lignes de code. C’est de cette manière que je considère mon travail quotidien.

Si vous voulez voir ce que je fais, vous pouvez me suivre sur Twitter. J’ai aussi pris la décision de poster mon travail sur Behance chaque semaine.

Une réflexion sur “ Daily Experiments : J’ai créé des images avec du code pendant 9 mois ”

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

Je veux Contribuer

C'est parti

Je suis un Professionnel

Voyons voir