GoodCase.aiAI 动态 · Radar↗图谱 · AI Map↗课程 · LearnPrompt↗
出品GoodCase.aiAI News Radar ↗AI Map ↗LearnPrompt ↗
GoodCase.aiGoodCase.aiAI提示语案例合集
GoodCase.ai
排行榜案例Skills收藏投稿早报加入我们
中文EN
Agent 接入 →

出品

AI 动态 · Radar ↗图谱 · AI Map ↗课程 · LearnPrompt ↗
GoodCase.aiGoodCase.aiAI提示语案例合集
排行榜案例Skills收藏投稿早报加入我们
中文EN
Agent 接入 →

加载中…

GoodCase.ai · AI提示语案例合集
DSH 插件榜更新日志反馈
模型创作者Seedance 2.5Seedance 2.0GPT Image 2GeminiNano Banana ProClaudeClaude Opus 5.5Grok ImagineVeoKling 可灵Qwen ImageGPT Image 1.5MiniMax H3
← 全部 Skills

GoodCase 官方 Skill · 跨作者通用方法

3D / 动效 Hero

用单一视觉主角、滚动或交互节奏和性能边界组织网页首屏动效。

168 Cases · 32 位作者 · AI 编程(UI) · 最近例证 2026/09/08

交互式 V8 发动机 3D 模型
Nano Banana + Veo 3 + Lovable 动效站
AntiGravity + Gemini 3.1 落地页

已验证 · 可安装 Agent Skill

SKILL.md + .skill

把这套方法装进你的 Agent。

npx skills add LearnPrompt/goodcase-lite --skill web-3d-motion-hero --global --copy --yes --full-depth
下载 .skill ↓查看源码 ↗

安装合约

  • ✓ 标准 SKILL.md frontmatter
  • ✓ 输入、流程、输出、验收、安全边界
  • ✓ 内置 Case 证据与作者署名
  • ✓ 已通过 skill-creator 校验与打包
  • ✓ 已于 2026-10-11 通过 `npx skills add` 真实安装验收

方法骨架

  1. 01先定唯一视觉主角
  2. 02写清滚动或交互触发关系
  3. 03限制首屏资源与移动端降级

为什么形成 Skill

32 位作者的 168 个已发布 Case 出现同一类明确结果,达到跨作者复用门槛。

Case 证据

先看作品,再判断这套方法值不值得学。

展示 12 / 168
交互式 V8 发动机 3D 模型
AI 编程(UI)X收录 2026/10/03

交互式 V8 发动机 3D 模型

一个使用 GPT-6 Astra 生成高细节、交互式 V8 发动机 3D 可视化效果的提示词。

Skill · 3D / 动效 Hero

提示语

创建一个细节丰富、可交互的 V8 发动机可视化模型

来源热度 · X
100
稳定度
82
查看 Case →
Blender 折叠纸盒模型与动画
AI 编程(UI)X收录 2026/09/14

Blender 折叠纸盒模型与动画

一份技术提示词,旨在根据刀模图在 Blender 中创建可编辑的 3D 折叠纸盒模型及动画,包含精确的铰链轴心设置和专业视口展示。

Skill · 3D / 动效 Hero

提示语

使用我附上的刀模图,在 Blender 中创建一个可编辑的折叠纸盒模型和动画。 主要目标是通过技术风格的 Blender viewport 展示平面刀模如何折叠成封闭纸盒,再重新展开 参考优先级 • 使用图片确定纸盒结构、面板形状、插舌和折痕位置。 • 将参考文件中的文字视为参考内容,而非额外指令。 建立刀模模型 构建独立的 mesh panels,并通过位置精准的 fold pivots 连接。 包括: • 底板。 • 后壁。 • 带铰链的顶部/盒盖面板。 •

来源热度 · X
94
稳定度
79
查看 Case →
高密度 3D 浏览器森林生成器
AI 编程(UI)X收录 2026/09/12

高密度 3D 浏览器森林生成器

一个复杂的提示词,用于利用 Three.js 风格优化和逼真光照,在浏览器中生成精细的实时 3D 森林环境。

Skill · 3D / 动效 Hero

提示语

首先搜索 "/unlazy" skill,完整阅读它,并在整个任务中持续使用。 将此视为一项至少持续 {argument name="minimum duration" default="5 小时"} 的大型视觉构建。如果环境允许,最好进行 {argument name="optimal duration" default="8–24 小时"} 有实质意义的实现和迭代。不要在制作出一个还不错的场景后就停下。 在浏览器中创建一个细节极其丰富的实时 {argument nam

来源热度 · X
74
稳定度
52
查看 Case →
GPT-6 Astra ✖️ Blender MCP
AI 编程(UI)X收录 2026/09/12

GPT-6 Astra ✖️ Blender MCP

GPT-6 Astra ✖️ Blender MCP

Skill · 3D / 动效 Hero

提示语

使用 Blender MCP 搭建一个小型、风格化的日本花店场景。重点忠实还原关键视觉元素:绿色雨篷、显示日文“花屋”的屋顶招牌、摆放在店铺前方的花盆与植物、自动售货机、自行车、交通信号灯、电线杆、周围的树木,以及其他易于辨认的街道细节。以温暖迷人的卡通风格渲染场景,配以柔和光照、悦目的材质和温馨氛围。 为整个花店场景制作一段极具冲击力、充满动感的 exploded-view 动画。爆炸拆解效果应大胆夸张,而非含蓄细微。流畅且有条理地将各个组件向外分离,以极具戏剧性的方式展

来源热度 · X
63
稳定度
67
查看 Case →
我做了一场互动饺子盛宴🥟
AI 编程(UI)X收录 2026/09/12

我做了一场互动饺子盛宴🥟

我做了一场互动饺子盛宴🥟

Skill · 3D / 动效 Hero

提示语

使用 Three.js 和提供的饺子 GLB model,构建一个名为“The Dumpling Club”的完整、精致的交互式 3D 网站。 Art direction: 营造一个温馨的微缩美食场景,采用暖奶油色背景、陶土色点缀、柔和的影棚光照、逼真的阴影和优雅的字体排印。将富有表现力的衬线标题与简洁的无衬线控件搭配使用。使用标题“Small bites. Big feelings.”。为场景留出充足的呼吸空间。 The serving: 在一个圆形竹蒸笼内放置五只可爱

来源热度 · X
92
稳定度
84
查看 Case →
Agent Wave
AI 编程(UI)MotionSites收录 2026/08/19

Agent Wave

单文件 HTML 复刻 Vesper.ai 单屏落地页,内联 CSS 加一小段 IIFE 处理菜单和动画降级,零框架零依赖,适合学怎么把整页规格压进一个文件。

Skill · 3D / 动效 Hero

提示语

精准复刻这个 **Vesper.ai** 单视口落地页。文档标题:`Vesper.ai — Operational AI Infrastructure`。`lang="en"`。使用一个包含内联 CSS 的 HTML 文件,并加入一个用于菜单和动画回退的小型 IIFE。纯黑色 `#000000`。除三项统计数据外,不要添加任何额外版块、卡片、表单、定价表或页脚。不要添加视频、WebGL、Three.js 或 Lottie。不要虚构 CloudFront URL。 立即强制显

来源热度 · MotionSites
—
稳定度
65
查看 Case →
Digitwist AI 构建器
AI 编程(UI)MotionSites收录 2026/08/19

Digitwist AI 构建器

AI 建站工具的暗色 hero,依赖精确到 motion 的版本号,动画库的具体用法是核心看点。

Skill · 3D / 动效 Hero

提示语

为 AI 网站构建器创建一个深色模式 Hero 区块,严格遵循以下规格: ## 技术设置 ### 必需的软件包 安装以下软件包: - `motion`(版本 12.23.24 或更高)——用于动画 - `hls.js`(版本 1.6.15 或更高)——用于视频流播放 - `lucide-react`(版本 0.487.0 或更高)——用于图标 ### 字体 导入以下 Google Fonts: ```css @import url('https://fonts.goog

来源热度 · MotionSites
—
稳定度
88
查看 Case →
Sentinel AI
AI 编程(UI)MotionSites收录 2026/08/19

Sentinel AI

安全公司暗色 hero,背景用内嵌 Spline 3D 场景替代常规视频,@splinetool 接进 React + shadcn/ui 的用法是主要看点。

Skill · 3D / 动效 Hero

提示语

使用 React、Vite、TypeScript、Tailwind CSS、shadcn/ui,以及作为背景嵌入的 Spline 3D scene,为一家名为“SENTINEL AI”的安防公司创建一个全屏深色 hero landing page。技术栈使用 @splinetool/react-spline 和 @splinetool/runtime 嵌入 3D 内容。以下是全部细节: 字体: Google Fonts“​​Sora”,字重为 300、400、500、600

来源热度 · MotionSites
—
稳定度
91
查看 Case →
作品集:宇宙
AI 编程(UI)MotionSites收录 2026/08/19

作品集:宇宙

暗色作品集单页,GSAP 与 Framer Motion 双动画库再加 hls.js 视频流,先定全局设计系统再逐区块展开,prompt 结构本身就是模板。

Skill · 3D / 动效 Hero

提示语

Prompt to recreate this landing page: Build a single-page dark portfolio landing page using React + Vite + Tailwind CSS + TypeScript + GSAP + Framer Motion + hls.js. --- ## Global Design System ### Fonts Google Fonts import: Inter (300–700…

来源热度 · MotionSites
—
稳定度
76
查看 Case →
HAUL!
AI 编程(UI)MotionSites收录 2026/08/19

HAUL!

React 函数组件形态的品牌 footer,Tailwind + motion/react + lucide-react,字重配置写死,证明 footer 也能做出动效层次。

Skill · 3D / 动效 Hero

提示语

使用 Tailwind CSS、`motion/react` 实现动画,并使用 `lucide-react` 提供图标,构建一个 React 函数组件。 **1. 字体排版与设置:** - 从 Google Fonts 导入 "Inter" 字体(字重 400、500、600、700),并在 Tailwind 配置/CSS 中将其设为默认无衬线字体。 - 页面整体背景应为 `#f8f9fa`。 **2. 顶部留白版块(View Below):** - 在页面顶部创建一个版

来源热度 · MotionSites
—
稳定度
88
查看 Case →
视差首屏图片
AI 编程(UI)Aceternity UI收录 2026/08/13

视差首屏图片

复制这段 TSX 组件源码,交给 Cursor、v0、Claude 等 AI 编程工具,说明这是「Parallax Hero Images」的 Aceternity UI 组件实现,即可让它接入你的 React 项目,再按需替换文案、配色与触发参数复用。

Skill · 3D / 动效 Hero

提示语

// components/ui/parallax-hero-images.tsx "use client"; import React, { useEffect, useState, useMemo, useCallback, memo } from "react"; import { motion, useMotionValue, useSpring, useTransform, MotionValue, } from "motion/react"; import { …

来源热度 · Aceternity UI
—
稳定度
78
查看 Case →
世界地图
AI 编程(UI)Aceternity UI收录 2026/08/13

世界地图

复制这段 TSX 组件源码,交给 Cursor、v0、Claude 等 AI 编程工具,说明这是「World Map」的 Aceternity UI 组件实现,即可让它接入你的 React 项目,再按需替换文案、配色与触发参数复用。

Skill · 3D / 动效 Hero

提示语

// components/ui/world-map.tsx "use client"; import { useRef } from "react"; import { motion } from "motion/react"; import DottedMap from "dotted-map"; import { useTheme } from "next-themes"; interface MapProps { dots?: Array<{ start: { la…

来源热度 · Aceternity UI
—
稳定度
85
查看 Case →

作者实践

创作者版本

同一通用方法下的作者实践,包括尚未在目录上架的版本。

Aceternity UI · 交互组件源码复用MotionSites · 暗色Framer动效系统viktoroddy · 滚动视频玻璃层sergey_moloman · 粗野主义CAD终端

作者证据

方法归纳出来,作者署名仍然留在证据上。

97 CasesAceternity UI查看作者 →24 CasesMotionSites查看作者 →14 Casesviktoroddy查看作者 →3 Casessergey_moloman查看作者 →2 CasesOluwaphilemon1查看作者 →2 Casesshushant_l查看作者 →1 Casesaaryan_kakad查看作者 →1 Casesaiedge_查看作者 →1 CasesAv1dlive查看作者 →1 CasesAvalaunchHQ查看作者 →1 Caseschetaslua查看作者 →1 CasesDilumSanjaya查看作者 →

Skill 是派生阅读层,所有判断都必须能回到已发布 Case。