Codage créatif sur JS : animation, son et couleur

* Codage créatif sur JS : animation, son et couleur

“Toutes nos félicitations! Vous avez atteint la fin de ce cours Domestika. Merci d'avoir participé et j'espère que cela vous a plu. Nous avons travaillé sur quelques compositions ensemble, mais le plus important était les techniques que vous avez apprises. Vous pouvez maintenant les reporter, les réappliquer ailleurs et créer quelque chose de différent ! Même si nous avons couvert beaucoup de choses, il y a toujours plus à dire, alors j'ai préparé une petite liste de conseils pour cette dernière unité. Bibliothèques J'en ai utilisé quelques-uns tout au long du cours, mais il y en a des milliers d'autres. Certaines personnes aiment tout faire elles-mêmes, mais c'est parfois comme essayer de réinventer la roue. Chaque fois que vous avez besoin de quelque chose de spécifique, je vous recommande de parcourir NPM en premier. Quelqu'un d'autre a peut-être déjà travaillé sur ce problème ! Par exemple, si vous avez besoin de charger des données à partir d'un fichier CSV, il existe des bibliothèques pour cela. Si vous devez effectuer des opérations avec des vecteurs, convertir entre différents espaces colorimétriques ou charger des fichiers de polices, il existe des bibliothèques pour cela. Création d'un site Web Une esquisse peut vivre par elle-même. Vous pouvez exporter votre composition et l'imprimer ou la poster quelque part. Mais si vous souhaitez partager vos croquis en ligne, vous pouvez également le faire avec une commande "--build". Il génère des fichiers JavaScript et HTML statiques qui peuvent être hébergés en tant que pages Web normales n'importe où. Si vous avez besoin que votre croquis soit intégré à un site Web existant, n'oubliez pas que nous utilisons toujours l'API Canvas native, vous pouvez donc copier les parties pertinentes de votre code dans un autre projet et l'exécuter sans canvas-sketch. p5.js Beaucoup de gens se lancent dans le codage créatif avec Processing ou p5.js, et cela a beaucoup de sens, ce sont d'excellents outils. J'ai l'habitude de travailler avec l'API native, mais si vous êtes déjà à l'aise avec p5.js, vous pouvez l'utiliser avec canvas-sketch. Il y a un exemple de base inclus dans la vidéo ci-dessus qui vous montre comment faire cela. Documents C'est une évidence. Assurez-vous de vérifier la documentation. Ce n'est pas seulement pour canvas-sketch ou Canvas, mais pour toute API avec laquelle vous travaillez. Quelqu'un a pris le temps d'organiser et de documenter son code afin que nous puissions en tirer parti. Il est là pour nous aider. Ensuite, j'aimerais faire un récapitulatif de ce que nous avons vu jusqu'à présent. Dans ce cours, j'ai travaillé sur cinq petits projets. Le premier a commencé avec un simple rectangle, mais à la fin, il impliquait des connaissances sur la trigonométrie, le hasard, les palettes de couleurs, les modes de fusion et les masques d'écrêtage.

Le deuxième projet consistait à créer des visuels à l'aide de segments de courbes distribués sous forme de grille, en utilisant des couleurs d'une manière différente de ce que vous faisiez dans la première unité. Ensuite, j'ai utilisé des données de fréquence audio pour piloter des visuels et essayer de recréer quelques conceptions d'affiches classiques à l'aide de code. Le dernier croquis concerne les particules ! Vous avez appris à leur appliquer des forces, en utilisant des concepts de base de la physique tels que la vitesse et l'accélération. Maintenant, j'aimerais que vous partagiez vos croquis dans le forum en cliquant sur le bouton "Créer votre projet" ci-dessus. Ce serait formidable si vous pouviez également expliquer les choix que vous avez faits en cours de route et nous dire si vous avez des doutes. De cette façon, nous apprendrons tous les uns des autres. Je serai là pour répondre aux questions et donner quelques conseils. Je suis curieux de voir ce que vous allez créer avec ce que vous avez appris dans le cours. On se voit là-bas! ”

Transcription partielle de la vidéo

“Bonjour à tous. J'espère que le voyage vous a plu. Nous avons collaboré sur quelques compositions. mais l'essentiel était les techniques acquises. Désormais. vous pouvez les appliquer ailleurs et créer du neuf. Bien que nous ayons abordé de nombreux sujets. il reste toujours plus à explorer et à discuter ensemble. J'ai donc préparé une petite liste de conseils pour cette vidéo finale. Nous avons utilisé plusieurs bibliothèques JavaScript au cours. mais il en existe des milliers. Certaines préfèrent tout faire elles-mêmes. mais parfois c'est inutile. Chaque fois que vous avez besoin de quelq...”

Cette transcription a été générée automatiquement et peut contenir des erreurs.

Sommaire du cours : Codage créatif sur JS : animation, son et couleur

• Niveau : Débutant
• 99% avis positifs (182)
• 20445 élèves
• 6 unités
• 28 leçons (2 h 47 min)

• Catégorie

  3D & Animation, Création de sites et d'applications

• Domaines

  JavaScript, Motion design, Multimédia, Programmation