mcpskills.net
SkillsMCPsAgentsPrompts
mcpskills.net — A curated directory of AI agent Skills and MCP servers
TermsPrivacy
← Back to Skills
Creative

Algorithmic Art

Creating algorithmic art using p5.js with seeded randomness and interactive parameter exploration. Use when users request creating art using code, generative art, algorithmic art, flow fields, or particle systems.

by AnthropicRepository →Source →

Algorithmic philosophies are computational aesthetic movements that are then expressed through code. Output .md files (philosophy), .html files (interactive viewer), and .js files (generative algorithms).

This happens in two steps:

  1. Algorithmic Philosophy Creation (.md file)
  2. Express by creating p5.js generative art (.html + .js files)

Algorithmic Philosophy Creation

Create an ALGORITHMIC PHILOSOPHY (not static images or templates) that will be interpreted through:

  • Computational processes, emergent behavior, mathematical beauty
  • Seeded randomness, noise fields, organic systems
  • Particles, flows, fields, forces
  • Parametric variation and controlled chaos

The Critical Understanding

  • What is received: Some subtle input or instructions by the user to take into account
  • What is created: An algorithmic philosophy/generative aesthetic movement
  • What happens next: The same version receives the philosophy and EXPRESSES IT IN CODE

How to Generate an Algorithmic Philosophy

Name the movement (1-2 words): "Organic Turbulence" / "Quantum Harmonics" / "Emergent Stillness"

Articulate the philosophy (4-6 paragraphs):

  • Computational processes and mathematical relationships
  • Noise functions and randomness patterns
  • Particle behaviors and field dynamics
  • Temporal evolution and system states
  • Parametric variation and emergent complexity

Essential Principles

  • ALGORITHMIC PHILOSOPHY: Creating a computational worldview to be expressed through code
  • PROCESS OVER PRODUCT: Beauty emerges from the algorithm's execution - each run is unique
  • PARAMETRIC EXPRESSION: Ideas communicate through mathematical relationships, forces, behaviors
  • ARTISTIC FREEDOM: The next Claude interprets the philosophy algorithmically
  • PURE GENERATIVE ART: This is about making LIVING ALGORITHMS, not static images with randomness
  • EXPERT CRAFTSMANSHIP: The final algorithm must feel meticulously crafted

P5.js Implementation

Technical Requirements

Seeded Randomness (Art Blocks Pattern):

let seed = 12345;
randomSeed(seed);
noiseSeed(seed);

Parameter Structure:

let params = {
  seed: 12345,
  // colors
  // Add parameters that control YOUR algorithm
};

Craftsmanship Requirements

  • Balance: Complexity without visual noise, order without rigidity
  • Color Harmony: Thoughtful palettes, not random RGB values
  • Composition: Even in randomness, maintain visual hierarchy and flow
  • Performance: Smooth execution, optimized for real-time if animated
  • Reproducibility: Same seed ALWAYS produces identical output

Interactive Artifact Creation

Create a single, self-contained HTML artifact with:

  • Parameter Controls (sliders for numeric parameters)
  • Seed Navigation (prev/next/random/jump buttons)
  • Anthropic branding (UI colors, fonts, layout)
  • Self-contained HTML (no external files except p5.js CDN)