skills.rest
portalshq
portalshqOFFICIAL
Explore all skills by this author →
GitHub

algorithmic-art

Generates seeded p5.js generative art with interactive HTML viewers and parameter controls.

5|Updated Dec 8, 2025
Search Tags:#seeded randomness#p5.js#creative coding#generative art#algorithmic art#flow fields#particle systems
One-click install
npx skills add https://github.com/portalshq/portals-studio --skill algorithmic-art-portalshq
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: algorithmic-art
Source: https://github.com/portalshq/portals-studio/tree/main/.cursor/skills/algorithmic-art
Command: npx skills add https://github.com/portalshq/portals-studio --skill algorithmic-art-portalshq

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Creating original generative art requires both a coherent aesthetic concept and working code; this Skill bridges that gap by first authoring an algorithmic philosophy and then expressing it as a runnable p5.js artwork. ## Core Features & Use Cases - Algorithmic Philosophy Authoring: Produces a 4-6 paragraph generative art manifesto (.md) that defines the computational aesthetic before any code is written. - Seeded p5.js Generation: Builds algorithms using seeded randomness (randomSeed/noiseSeed) so every seed reproduces identical output, following the Art Blocks pattern. - Interactive HTML Viewer: Outputs a single self-contained HTML artifact built from templates/viewer.html with Anthropic branding, seed navigation (prev/next/random/jump), parameter sliders, and Regenerate/Reset/Download actions. - Use Case: Ask for a flow-field artwork inspired by ocean currents; receive a philosophy document plus an interactive viewer where you explore 100 seed variations and tune particle count, noise scale, and color. ## Quick Start Create an algorithmic art piece about emergent turbulence with an interactive viewer I can open in my browser.

Frequently Asked Questions about algorithmic-art

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

FAQPage Schema
How do I create generative art with p5.js?▼

Define an algorithmic philosophy describing the computational aesthetic, then implement it as a p5.js sketch with setup() and draw() functions. Use randomSeed() and noiseSeed() with a fixed seed so the artwork is reproducible across runs.

How to make p5.js generative art reproducible with seeds?▼

Call randomSeed(seed) and noiseSeed(seed) at the start of setup() before any random or noise calls. The same seed then always produces identical output, letting users navigate variations by incrementing the seed value.

What is an algorithmic philosophy in generative art?▼

It is a 4-6 paragraph manifesto defining the computational aesthetic movement before coding begins. It describes how noise, particles, fields, and parametric variation express the concept, guiding the implementation without constraining creative interpretation.

Does the generated HTML viewer work without a server?▼

Yes, the output is a single self-contained HTML file with p5.js loaded from CDN and all code inline. It opens directly in any browser or as a claude.ai artifact with no build step or server required.

Can I explore multiple variations of one generative artwork?▼

Yes, the viewer includes seed navigation with previous, next, random, and jump-to-seed controls. Each seed produces a unique variation of the same algorithm, and you can generate 100 variations using seeds 1-100.

Related Skills

Explore More Design & Creative Skills→
Owl-ListenerOwl-Listener
234

inspiration-scouting

Generate curated inspiration boards with cross-domain references from project briefs.

Community
Intermediate
GetFresh-VenturesGetFresh-Ventures

logo-creator

Generate logo variations with style controls and export SVG assets.

Official
Advanced
pmksharpmkshar

color-palette-extractor

Extract dominant colors from images and generate complementary palettes.

Community
Intermediate
rheadshrheadsh
38

td-glsl

Create and modify GLSL shaders for TouchDesigner's visual programming environment.

Community
Intermediate