Algorithmic Art
Create algorithmic art using p5.js with seeded randomness and interactive parameter exploration. Generate original generative art through computational processes, emergent behavior, and mathematical beauty.
Prerequisites
- p5.js library (CDN or local)
- Modern web browser
- Basic understanding of JavaScript
Instructions
Create an Algorithmic Philosophy
- Name the movement (1-2 words): "Organic Turbulence", "Quantum Harmonics"
- Define the computational approach in 4-6 paragraphs
- Emphasize: algorithmic expression, emergent behavior, seeded variation
Use Seeded Randomness (Art Blocks Pattern)
let seed = 12345; randomSeed(seed); noiseSeed(seed);Design Parameters from Philosophy
let params = { seed: 12345, // Quantities, scales, probabilities, ratios, angles, thresholds };Express Philosophy Through Code
- Organic emergence: elements that accumulate, feedback loops
- Mathematical beauty: geometric relationships, trigonometric functions
- Controlled chaos: random variation within strict boundaries
Create Interactive HTML Artifact
- Include p5.js from CDN
- Add parameter controls (sliders, color pickers)
- Seed navigation (prev/next/random buttons)
- Download PNG button
Apply Craftsmanship
- Balance: complexity without visual noise
- Color harmony: thoughtful palettes, not random RGB
- Performance: smooth execution, optimized for real-time
- Reproducibility: same seed produces identical output
Error Handling
- If canvas doesn't render, check p5.js CDN availability
- If performance is poor, reduce particle count or frame rate
- Test with multiple seeds to ensure variety
Notes
- Philosophy examples: Flow Fields, Particle Systems, Recursive Structures
- Animation concepts: noise fields, particle behaviors, field dynamics
- Output: Single self-contained HTML file with all code inline
Source: anthropics/skills