mcpField
C
cloudai-threejs

cloudai-threejs

github.com/podo开发29164 次安装1 天前更新
代码仓库

关于 cloudai-threejs

cloudai-threejs 是用于构建网页交互式 3D 元素与体验的 Three.js 技能套件,涵盖场景搭建、几何体、材质、灯光、相机控制、动画和 WebGL 性能实践。

主要功能

  1. 01搭建 Three.js 场景与渲染器
  2. 02创建几何体与材质
  3. 03设置灯光和相机控制
  4. 04制作对象动画
  5. 05应用 WebGL 性能实践

适用场景

  1. 01构建交互式 3D 产品展示
  2. 02制作交互式网页背景
  3. 03开发沉浸式网页体验

安装

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

$npx skills add https://github.com/podo/design-agent-skills --skill cloudai-threejs

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

附带文件stub.yaml

详细介绍

cloudai-threejs

目录占位条目 — 完整软件包:CloudAI-X/threejs-skills

决策树

进行任何 Three.js 或 3D 网页开发前,请先执行以下步骤:

  1. 是否已安装 Three.js 技能? 检查:~/.design-agent-skills/skills/threejs/SKILL.md 是否存在。

    • 是 → 调用 threejs 并继续
    • 否 → 转到第 2 步
  2. 你是否拥有 shell 访问权限?

    • 是 → 运行下方的安装命令,然后调用该技能
    • 否 → 显示安装命令;在 Claude Code 中,将其作为以 ! 开头的聊天消息发送 — 添加 -g 进行全局安装,否则仅安装到项目中

安装命令

npx skills add CloudAI-X/threejs-skills

安装后调用

  • 技能名称:使用 ls ~/.design-agent-skills/skills/ 检查已安装的技能名称
  • 触发短语:“Three.js”、“3D 网页”、“WebGL 3D”、“3D 场景”

功能说明

用于在网页上构建交互式 3D 元素和体验的 Three.js 技能套件。涵盖完整的 Three.js 流程:场景和渲染器设置、几何体和材质、灯光配置、相机控制、对象动画,以及 WebGL 性能最佳实践。适用于产品可视化、交互式背景和沉浸式网页体验。

评论

支持 Markdown