Webgl

shader-dev est un skill GLSL pratique pour des visuels temps réel à la ShaderToy. Utilisez le skill shader-dev pour créer ou déboguer du ray marching, des scènes SDF, l’éclairage, des particules, le mouvement fluide, le post-traitement et le shader-dev pour la conception d’interface, avec moins d’approximation qu’avec un prompt générique.

La skill threejs-textures pour le développement frontend couvre le chargement des textures, le mappage UV, `colorSpace`, les modes de répétition, le filtrage et les cartes d’environnement afin que les images s’affichent correctement sur les matériaux Three.js.

threejs-shaders est un guide pratique pour écrire des shaders Three.js avec GLSL, ShaderMaterial, les uniforms, la déformation de sommets et les effets de fragment. Utilisez-le pour le développement frontend lorsque vous avez besoin d’une base de shader fonctionnelle, de choix de matériaux plus clairs et de moins d’hésitations qu’avec un prompt générique.

threejs-materials est une skill Three.js dédiée au choix, au paramétrage et au débogage des matériaux de mesh. Utilisez-la pour le PBR réaliste, le flat shading non éclairé, le toon shading, les vues de debug, le stylisme piloté par les textures et les shaders personnalisés. Elle est utile aux équipes de développement front-end qui veulent prendre des décisions sur les matériaux plus vite et de façon plus cohérente.

Skill threejs-postprocessing pour le développement frontend : ajoutez des pipelines `EffectComposer`, du bloom, de la profondeur de champ, du flou, du color grading et des passes personnalisées en screen-space. Ce guide vous aide à mettre en place la chaîne de rendu, à régler les effets et à intégrer le rendu du composer dans une scène Three.js existante.

threejs-loaders vous aide à charger correctement les assets Three.js, notamment les modèles GLTF/GLB, les textures, les environnements HDR et d’autres ressources asynchrones. Utilisez cette skill threejs-loaders pour le développement frontend lorsque vous avez besoin d’un chargement fiable, d’une gestion de la progression et de moins de bugs avant l’affichage de la scène.

threejs-lighting est un skill Three.js pratique pour le développement frontend. Il vous aide à choisir les types de lumière, configurer les ombres, ajouter un éclairage d’environnement et corriger les scènes qui paraissent plates, trop sombres ou surexposées. Utilisez le guide threejs-lighting quand vous avez besoin d’un éclairage de scène plus rapide et plus cohérent.

threejs-geometry vous aide à choisir et construire des géométries Three.js pour des scènes réelles : formes intégrées, BufferGeometry, maillages personnalisés et instancing. Utilisez le skill threejs-geometry pour le Frontend Development quand vous avez besoin du bon constructeur, du bon ordre des paramètres et d’une sortie pensée pour les performances.

threejs-fundamentals aide les développeurs front-end à construire et déboguer la configuration de base d’une application Three.js : scène, caméra, renderer, lumières, meshes, transforms et hiérarchie des objets. Utilisez ce guide threejs-fundamentals pour corriger les canvas vides, placer correctement les objets et livrer une première scène propre.

Skill threejs-animation pour les systèmes de mouvement Three.js : keyframes, animation clips, mixers, actions, lecture squelettique, morph targets et mouvement procédural. Utilisez-la pour le Frontend Development lorsque vous devez jouer des animations GLTF, combiner des clips ou construire des boucles d’animation propres avec moins d’hésitation.