关于 gooey-blob-system
用于创建柔和有机形状的设计技能，使形状作为流体视觉系统融合与分离。提供基于 SVG 的实现指导、动效限制，以及低动态场景的替代方案。
主要功能
- 01SVG 模糊与阈值技术
- 02可融合的动态形状
- 03平滑连贯的运动
- 04背景、加载器与光标用途
- 05静态或简化备用方案
适用场景
- 01为主视觉区域添加有机动效
- 02创建流体加载指示器
- 03构建柔和的动态光标区域
安装
复制下面的命令，在终端中运行。
$
npx skills add https:/安装后在 Claude Code 中输入/gooey-blob-system确认已加载。
包含的文件
除 SKILL.md 外，安装时一起下载的参考资料和脚本。
demo/index.htmlPROMPT.mdsource.json详细介绍
Gooey Blob System 技能
使用场景
- 页面需要有机流体形状，这些形状在视觉上能够融合、分离，并如同一个柔软的系统般移动。
工作流
- 使用 SVG 滤镜构建效果：先进行高斯模糊，再应用颜色矩阵阈值。
- 为多个相互重叠的圆形或团块添加动画，使它们自然地靠近和分离。
- 保持边界柔和且连续；视觉效果应呈现流动感，而不是彼此独立的圆形。
- 将团块系统用作背景点缀、加载动画、光标场或主视觉氛围效果。
- 协同调整模糊、对比度和形状间距，确保融合效果清晰可见。
注意事项
- 不要用不会融合的普通模糊圆形来伪造黏稠效果。
- 不要添加快速抖动的动态效果；保持平滑、连贯。
- 为低动态效果场景提供静态或简化的备用方案。
评论
支持 Markdown