← ClaudeAtlas

p5jslisted

p5.js sketches: gen art, shaders, interactive, 3D.
aashutosh396/mindpalace · ★ 0 · AI & Automation · score 77
Install: claude install-skill aashutosh396/mindpalace
# p5.js Production Pipeline ## When to use Use when users request: p5.js sketches, creative coding, generative art, interactive visualizations, canvas animations, browser-based visual art, data viz, shader effects, or any p5.js project. ## What's inside Production pipeline for interactive and generative visual art using p5.js. Creates browser-based sketches, generative art, data visualizations, interactive experiences, 3D scenes, audio-reactive visuals, and motion graphics — exported as HTML, PNG, GIF, MP4, or SVG. Covers: 2D/3D rendering, noise and particle systems, flow fields, shaders (GLSL), pixel manipulation, kinetic typography, WebGL scenes, audio analysis, mouse/keyboard interaction, and headless high-res export. ## Creative Standard This is visual art rendered in the browser. The canvas is the medium; the algorithm is the brush. **Before writing a single line of code**, articulate the creative concept. What does this piece communicate? What makes the viewer stop scrolling? What separates this from a code tutorial example? The user's prompt is a starting point — interpret it with creative ambition. **First-render excellence is non-negotiable.** The output must be visually striking on first load. If it looks like a p5.js tutorial exercise, a default configuration, or "AI-generated creative coding," it is wrong. Rethink before shipping. **Go beyond the reference vocabulary.** The noise functions, particle systems, color palettes, and shader effects in the refer