mcpField
P
p5js-hermes

p5js-hermes

github.com/podo创意与媒体29168 次安装1 天前更新
代码仓库

关于 p5js-hermes

p5js-hermes 是使用 p5.js 制作交互式生成艺术的技能，涵盖渲染、着色器、动态排版和音频响应视觉效果，并提供构建完整制作流程的参考资料。

主要功能

  1. 01使用噪声函数进行 2D 和 3D 渲染
  2. 02粒子系统与流场
  3. 03GLSL 着色器集成与 WebGL
  4. 04像素数组操作
  5. 05动态排版
  6. 06音频响应视觉效果

适用场景

  1. 01使用 p5.js 创作生成艺术
  2. 02构建流场或粒子系统视觉效果
  3. 03在视觉作品中加入 GLSL 着色器
  4. 04制作响应音频的视觉效果

安装

复制下面的命令，在终端中运行。

$npx skills add https://github.com/podo/design-agent-skills --skill p5js-hermes

安装后在 Claude Code 中输入/p5js-hermes确认已加载。

附带文件stub.yaml

详细介绍

p5js-hermes

目录条目 — 完整技能：nousresearch/hermes-agent

决策树

  1. 是否已安装完整技能？ 检查此位置的技能是否仍包含 das: 块：

    • 全局：grep -q "^das:" ~/.agents/skills/p5js-hermes/SKILL.md 2>/dev/null && echo "pointer" || echo "installed"
    • 项目：grep -q "^das:" .agents/skills/p5js-hermes/SKILL.md 2>/dev/null && echo "pointer" || echo "installed"
    • 不含 das: 块 → 已安装完整技能，调用该技能并继续
    • 含有 das: 块 → 前往第 2 步

  2. 检测作用范围，然后安装：

    检测作用范围：

    [ -e ~/.agents/skills/p5js-hermes ] && echo "global" || echo "project"

    全局（使用 -g 安装）：

    npx skills add nousresearch/hermes-agent --skill p5js-hermes -g -y

    项目（未使用 -g 安装）：

    npx skills add nousresearch/hermes-agent --skill p5js-hermes -y

    Claude Code： 将任一命令作为以 ! 开头的聊天消息发送，即可在不离开对话的情况下运行。

安装后调用

  • 技能名称：p5js-hermes
  • 触发表达： “p5.js”、“p5js”、“generative art p5”、“flow field”、“audio reactive”

功能

为 p5.js 中的交互式和生成式视觉艺术提供完整的生产流程。涵盖使用噪声函数、粒子系统、流场、GLSL 着色器集成、像素数组处理、动态排版、WebGL 和音频响应视觉效果进行 2D/3D 渲染。基于 NousResearch 的 Hermes Agent 提供的 10 个参考文件，内容深度远超官方的 algorithmic-art 技能。

评论

支持 Markdown