skills.rest
Clay-HHK
Clay-HHKCOMMUNITY
Explore all skills by this author →
GitHub

algorithmic-art

Generate seeded p5.js HTML artifacts with interactive parameter controls.

2|Updated Apr 12, 2026
Search Tags:#p5.js#interactive#art#generative#seeded-randomness#flow-field#algorithmic-philosophy
One-click install
npx skills add https://github.com/Clay-HHK/claude-config --skill algorithmic-art-clay-hhk
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: algorithmic-art
Source: https://github.com/Clay-HHK/claude-config/tree/main/skills/algorithmic-art
Command: npx skills add https://github.com/Clay-HHK/claude-config --skill algorithmic-art-clay-hhk

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps artists and engineers create original, reproducible algorithmic artworks by turning a concise generative philosophy into a single, self-contained p5.js HTML artifact. It reduces friction around seeded randomness, interactive parameter controls, and gallery-ready presentation by prescribing a clear workflow and a required viewer template so outputs are consistent and shareable.

Core Features & Use Cases

  • Algorithmic Philosophy (.md): Produce a 4–6 paragraph manifesto that guides the algorithmic choices and embeds a subtle conceptual seed for the implementation.
  • Self-contained Interactive Artifact (.html + embedded .js): Create a single HTML file built from templates/viewer.html that includes the p5.js algorithm, UI parameter controls, seed navigation, and export actions.
  • Seeded Reproducibility & Parameterization: Always use seeded randomSeed/noiseSeed, expose tunable parameters (counts, scales, probabilities, colors), and enable Prev/Next/Random/Jump seed navigation for exploration.
  • Craftsmanship & Ethical Guidance: Emphasize master-level, meticulously crafted algorithms and avoid copying identifiable works by other living artists; output original, algorithmic expressions rather than static images.

Quick Start

Generate an algorithmic philosophy and a self-contained p5.js HTML viewer that uses seeded randomness and the provided templates/viewer.html as the starting point.

Frequently Asked Questions about algorithmic-art

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate reproducible p5.js generative art with seeded randomness?▼

You generate reproducible p5.js generative art by applying seeded randomSeed and noiseSeed functions within a self-contained HTML artifact. This Skill embeds the p5.js algorithm and UI controls directly in the output file, ensuring deterministic, reproducible artworks from a specific seed value.

What is seeded randomness in algorithmic art and why is it needed?▼

Seeded randomness in algorithmic art uses an initial seed value to deterministically reproduce identical generative outputs. It is essential for creating shareable, reproducible p5.js artworks where users can navigate via Prev/Next/Random/Jump seed controls while maintaining the exact visual state.

Can I add interactive parameter controls to a p5.js flow field animation?▼

Yes, you can add interactive parameter controls to a p5.js flow field animation. The generated HTML artifact exposes tunable parameters for counts, scales, probabilities, and colors, alongside seed navigation and export actions directly within the viewer template UI.

Does this generative art workflow require external p5.js dependencies?▼

No external p5.js dependencies are required for this generative art workflow. The Skill produces a completely self-contained HTML file with the p5.js library, algorithmic logic, and UI controls embedded directly inside, ensuring outputs are consistent and shareable without external file references.

How do I start a generative art project using an algorithmic philosophy?▼

You start by generating a 4-6 paragraph algorithmic philosophy markdown manifesto that guides your algorithmic choices. The Skill then translates this conceptual philosophy into a single, self-contained p5.js HTML viewer using seeded randomness and parameter controls, applying the fixed viewer template.

What are the limitations of generating algorithmic art with this approach?▼

A key limitation is the ethical guideline against copying identifiable works by living artists; outputs must be original algorithmic expressions. Additionally, the workflow requires preserving a fixed template structure for seeded initialization functions, which may restrict highly customized viewer layouts outside the prescribed template.

Related Skills

Explore More Design & Creative Skills→
aaymanasraraaymanasrar

algorithmic-art

Generate algorithmic art with p5.js using seeded randomness.

Community
Intermediate
MagicBowenMagicBowen
4

algorithmic-art

Generate deterministic seed-based algorithmic art with p5.js canvases.

Community
Advanced
tkhongsaptkhongsap
1

algorithmic-art

Generate p5.js-based algorithmic art with seeded randomness and interactive parameters.

Community
Intermediate
LisaPullmanLisaPullman

algorithmic-art

Generate reproducible algorithmic art from seed-driven code with p5.js.

Community
Advanced