ホーム / 全スキル / コンテンツ制作 / algorithmic-art
English (EN)简体中文 (ZH)日本語 (JA)
コンテンツ制作 · anthropics/skills

algorithmic-art

シード値に基づく乱数生成とインタラクティブなパラメータ探索を備えた、p5.jsによるアルゴリズミックアートの作成。コードを用いたアート作成、ジェネレーティブアート、アルゴリズミックアート、フローフィールド、またはパーティクルシステムが要求された際に使用します。著作権侵害を避けるため、既存アーティストの作品を模倣せず、オリジナルのアルゴリズミックアートを作成してください。

L2 ローカル · 作業ディレクトリ限定V1 コミット固定ファイル書き込みDual-pass Audit
Author anthropicsGitHub anthropics/skills ↗Stars 174801License Apache-2.0（skill 目录自带 LICENSE.txt；GitHub API 仓库级 license 字段为 null）Commit 41bbe19d1a
管理レベルは Skill の能力と推奨統制措置を示すものであり、品質や安全性の認証、利用可否の判定ではありません。使用の可否はユーザーおよび管理者が決定します。Agent 環境によって制約が異なるため、自動保護を仮定しないでください。第三者製 Skill の著作権は原著作者に帰属し、利用リスクは利用者が負います。

1仕組みと動作原理

プロンプトオーケストレーションのみによる段階的生成Skill：スクリプト、CLI、API呼び出しは一切なく、全機能がエージェントへの段階的指示と2つのテンプレートファイルのみで構成される

SKILL.md
This happens in two steps: 1. Algorithmic Philosophy Creation (.md file) 2. Express by creating p5.js generative art (.html + .js files)
ディレクトリ構成は SKILL.md + templates/(viewer.html、generator_template.js) + LICENSE.txt のみ。.py や .sh は存在せず、実装は完全にモデルのテキスト生成内で行われる

「アルゴリズムの哲学」（芸術運動マニフェスト .md）を先行生成し、同一セッション後半で哲学をコードへ変換する2段階リレー設計

SKILL.md
The same version receives the philosophy and EXPRESSES IT IN CODE - creating p5.js sketches that are 90% algorithmic generation, 10% essential parameters.
哲学パートの役割：「絵を描くコードを書く」行為を「まず計算美学運動を定義し、その後にコード表現として実装する」形に再構成し、モデルが安易に幾何学パターンを乱造することを防止する

HTML出力は自由生成ではなく templates/viewer.html を「文字通りの出発点」とし、FIXEDセクション（レイアウト、Anthropicブランディング、シード操作、Actions）を維持してパラメータとアルゴリズムのみを置換

SKILL.md
Use that file as the LITERAL STARTING POINT - not just inspiration
viewer.html の冒頭コメント WHAT TO KEEP / WHAT TO CREATIVELY EDIT（1〜10行目）と SKILL.md の記述が整合しており、出力スタイルを厳格に制約するメカニズムとして機能している

アートコード自体はモデルがその場で動的に記述：テンプレート内のアルゴリズム領域はプレースホルダーコメントであり、モデルが哲学と概念シードに基づき generateFlowField/draw/Particle などを即時作成

templates/viewer.html
function generateFlowField() { // fill this in }
既成のアルゴリズムライブラリやプリセットメニューはなく、出力品質はモデルの能力とテンプレートの制約に依存。generator_template.js は構造原則とユーティリティ関数（hexToRgb、mapRange、saveCanvas 等）のみを提供し、SKILL内でも「これらはツールと原則でありレシピではない」と明言されている

再現性の規律（Art Blocks スタイル）：同一シード値では必ず同一出力を得るため、randomSeed と noiseSeed のデュアルシードを採用

SKILL.md
randomSeed(seed); noiseSeed(seed);
テンプレートの initializeSystem() と generator_template.js の initializeSeed() の双方が本パターンを実装。viewer.html の prev/next/random 各ボタンもすべて initializeSystem() を再実行する設計

独自のコンセプチュアル層：ユーザーの元プロンプトから「概念シード」を演繹し、直接的な模倣ではなくアルゴリズムのパラメータや挙動へ繊細な引用として織り込む

SKILL.md
The concept is a **subtle, niche reference embedded within the algorithm itself** - not always literal, always sophisticated.
作品の「静かな概念DNA」と自称され、ジャズミュージシャンの引用句（クォーテーション）に例えられる。ユーザー入力を差別化された作品へ昇華させる中核的アプローチ

2コア機能

014〜6段落の「アルゴリズム哲学／ジェネレーティブアート運動マニフェスト」を生成し .md として出力
02ユーザーの要求から繊細な概念シード（conceptual seed）を演繹しアルゴリズムへ組み込み
03固定ブランドテンプレートに基づく自己完結型インタラクティブ p5.js HTML アーティファクトの生成（シード操作、パラメータスライダー、カラーピッカー、リセット機能の一体型）
04シードによる再現性担保の生成 ＋ シードナビゲーション（表示、Prev、Next、Random、シードジャンプ）、1クリックで100バリエーション展開可能
05パラメータ化システム設計：哲学的特性を調整可能パラメータ（個数、スケール、確率、比率、角度、しきい値）にマッピングし対応UIスライダーを生成
06PNGエクスポート機能（saveCanvas）
07制作の自由度制御：静止画（noLoop）、アニメーション、パラメータ変更時再描画の3つのライフサイクルに対応、リアルタイムなパラメータ／カラー更新をサポート

3外部依存関係

KindDependency / Endpoint
networkp5.js CDN
networkGoogle Fonts (Poppins/Lora)
packagep5.js 1.7.0 (浏览器端库)

4推奨統制措置と判定根拠

安全運用のための推奨統制措置
Agent 向け
作業ディレクトリを限定
管理者向け
操作ログを保持
判定根拠（ファイルパスと抜粋）
  • 本地工作目录: ファイル読み書きおよび成果物出力：SKILL.md がエージェントに対し、.md（哲学ファイル）および .html（完成品アーティファクト）の出力を指示（本skillの納品物そのもの）。
監査ノート： 🔵 青：Skill自体は純粋なプロンプト指示（スクリプト実行、外部ネットワーク通信、認証情報読み取りなし）であり、ローカルでのテンプレート読み込みと成果物（.md/.html）の書き出しのみを行うため、「ローカル読み書きのみ」の基準に該当（🟢はローカル書き込みなしを要求するため不適）。運用の実態として以下の2点に注意：① 生成されたHTML成果物はユーザーのブラウザ表示時に cdnjs p5.js と Google Fonts を読み込む（通信は成果物の利用側で発生し、エージェント実行側ではない）；② 成果物にはモデルが動的生成したJSが含まれ、任意コード実行の攻撃面となるが、アーティファクトサンドボックスまたはローカルブラウザかつ認証情報のない環境で動作する。SKILL.md:109-113 はテンプレートの先行読み取り（Read）を指示、:302 では p5 CDN 以外の外部依存なしと主張されているが、実際にはWebフォントも外部依存となっている。

5二重目の独立検証

  • [ok] 外部资源：p5.js cdnjs 引用真实存在 — viewer.html:23 确有 cdnjs p5 1.7.0 script 标签
  • [ok] 外部资源：Google Fonts 引用真实存在 — viewer.html:24-26 preconnect + stylesheet（Poppins/Lora）
  • [ok] 模板即起点、算法区为占位（实现原理核心证据） — viewer.html 中 generateFlowField()/draw()/Particle 构造/updateParam/updateColor 均为 '// fill this in' 占位注释
  • [discrepancy] SKILL.md 声称 FIXED Actions = Regenerate + Reset + Download PNG 按钮 — 实际 viewer.html Actions 区（425-427 行）仅有 Reset 按钮；模板无 Regenerate 与 Download PNG 按钮。重生成靠 seed 的 Prev/Next/Random 隐式完成；PNG 导出函数 exportImage() 只在 generator_template.js 中存在且无 UI 接线
  • [discrepancy] SKILL.md 声称 seed 区含『Jump to seed input + Go button』 — viewer.html:342 只有 <input type=number onchange=updateSeed()>，无 Go 按钮（跳转功能在，UI 形态与描述不符，属轻微出入）
  • [discrepancy] 文档内部一致性：交付文件类型 — SKILL.md:7/11 称输出 .md + .html + .js 三类文件，SKILL.md:399 却要求 'Embed algorithms inline in the HTML artifact (don't create separate .js files)'，正文 302 行又称产物除 p5 CDN 外无任何外部导入（未计字体）——同一文档三处表述互斥
  • [discrepancy] 『works immediately in any browser - no setup required / completely self-contained』声明 — 产物依赖 cdnjs p5.js 与 Google Fonts 两个网络端点，离线/无网环境无法立即工作；『自包含』仅在联网前提下成立
  • [ok] 双种子可复现模式（randomSeed+noiseSeed）落地 — SKILL.md:139-140 指令 + viewer.html initializeSystem() 内 'randomSeed(params.seed); noiseSeed(params.seed);' 双处一致

6結論

  • 「哲学先行 ＋ 概念シード」の独自2層制作フレームワークにより、パターンメニュー的な均質化出力を排除
  • 固定ブランドテンプレートとシードナビゲーションによる厳格な出力規律で、統一されたスタイル、再現性、探索性を担保
  • 充実したエンジニアリング仕様：Art Blocks形式のデュアルシード、パラメータ設計ガイド、パフォーマンス・エクスポート・リセット等のベストプラクティスを網羅
  • description に反盗作方針を明記し、有名ジェネレーティブアーティスト作品の模倣ではなくオリジナル創作を誘導
    • 最適な用途： テーマ性・深みがあり、インタラクティブかつ再現可能なジェネレーティブアートをClaudeに出力させたいユーザー：アートコンセプトの探求、NFT/Art Blocks風シリーズ制作（シードナビゲーションにより100連発展開が容易）、Anthropicブランドテイストの洗練されたインタラクティブデモの迅速な作成。また、「哲学 → アルゴリズム」の2段階に分解して学べるため教育用途にも適する。
    不向きな用途： オフライン／閉域網環境のユーザー（CDNおよびWebフォントへの依存あり）；既存アーティストの特定スタイルや作品を正確に模倣・再現したい用途（skill側で明示的に禁止）；生成コードに対するセキュリティ要件が極めて厳密な管理環境（モデルの即時コード生成のため目視確認が必要）；SKILL.md 内のボタン名やファイルリストの記述とテンプレート実物との完全一致を厳密に求めるユーザー（一部に表記の差異が存在）。
    Install Agent-Ready
    ① Verified Mirror 2026-09-06
    Option A · Direct DownloadDownload algorithmic-art.tar.gz
    sha256: c72553d5d7cf3344…
    Option B · Copy Guide for Agent
    install.json
    Agent はこの JSON ガイドから自動的にダウンロードして検証します。
    ② Upstream GitHub
    GitHub Repo ↗
    Pinned to commit 41bbe19d1a.