Claude Code 提示词实战用 Remotion 7 阶段工作流把产品描述自动变成高能宣传视频【免费下载链接】claude-howtoA visual, example-driven guide to Claude Code — from basic concepts to advanced agents, with copy-paste templates that bring immediate value.项目地址: https://gitcode.com/GitHub_Trending/cl/claude-howto导读本文围绕 Claude How-To 仓库 uk/prompts/remotion-video.md英文源文件为 prompts/remotion-video.md展开解读这份面向Remotion与React的 Claude Code 系统提示词system prompt。它把「读取产品描述 → 产出可渲染的宣传视频」拆解为一条7 阶段自动化流水线从自主探索代码库、提炼价值主张到与用户确认画幅/时长/风格再到组件架构设计与直接交付。读完本文你将掌握这份提示词的核心设计逻辑、每个阶段的输入输出契约、三幕式视频结构、Remotion Tailwind CSS 的技术栈约束以及如何通过 Claude Code CLI 把它作为--system-prompt-file落地使用。一、这份提示词解决什么问题大多数产品团队做宣传视频时要经历「写文案 → 找设计师 → 对镜头 → 反复改稿」的漫长链路。这份提示词把目标收敛为一句能力描述以Motion Designer动态设计师 高级 React 工程师的双重角色接收一段产品描述用React 代码生成一段高能、专业的动画视频。它的适用场景非常明确让 Claude Code 在拿到一个仓库通常是待宣传产品的代码库后先自动探索、再按确认的偏好、最后自主构建一个完整的 Remotion 项目。注意它产出的不是.mp4成品文件而是一套可运行的 React 代码项目——最终视频通过 Remotion CLI 渲染得到。该文件位于仓库的prompts/目录翻译版本见 ja/prompts/remotion-video.md、zh/prompts/remotion-video.md、vi/prompts/remotion-video.md。从仓库构建脚本 scripts/build_website.py 可以看到prompts目录被显式列入EXCLUDE_DIRS即它不参与网站与 EPUB 文档渲染属于「供 Claude Code 直接消费的提示词资产」而非面向读者的教程页面——这决定了它的组织方式是一段可直接投喂的指令文本。二、六条核心设计原则提示词在进入分阶段流程之前先声明了六条 KEY PRINCIPLES它们是整个工作流的行为宪法原则含义关键行为Explore First先探索后提问自动扫描代码库收集产品信息不要一上来就问产品相关问题Ask Before Planning规划前先询问探索完成后先汇报发现再询问画幅/风格/时长等偏好最后才做计划Product URL First产品页优先若发现产品 URL产品页信息是最高优先级事实来源高于代码库发现Value Over Tech价值优先于技术聚焦价值主张、客户收益、功能卖点而非技术规格与实现细节Customer-Centric以客户为中心强调产品如何解决问题、改善生活、给用户带来收益Autonomous Execution自主执行用户确认偏好后规划与实现阶段不再请求逐级审批这六条原则的价值在于划清了「人机协作边界」探索与执行交给 Agent自主方向与偏好交给用户确认信息可信度排序是「产品 URL 代码库证据 智能推断」。三、Phase 1自主资源发现Autonomous Resource Discovery第一阶段的目标是不打扰用户地完成信息收集。提示词给出了明确的探查清单搜索README.md获取产品描述与价值主张检查package.json读取产品名称、描述、homepage URL在/assets、/public、/static、/images目录中寻找品牌资产从 CSS / Tailwind 配置文件提取配色方案查找已有的营销文案或文档在配置文件、环境变量、文档中寻找产品 URL。若找到产品 URL立即用 WebFetch 抓取产品页且产品页信息优先级高于代码库发现。对于缺失信息提示词规定了「智能默认值」smart defaults维度默认值理由视频格式横屏 1920x1080YouTube/网页优化时长30 秒大多数平台理想长度风格现代、简洁、专业基于品牌基调品牌色提取到的颜色或互补的现代调色板保持视觉一致性只有当以下情况才允许打断用户无法确定产品名/找不到任何产品信息、无法找到或访问产品 URL、存在关键歧义如 B2B 与 B2C 会彻底改变话术、信息冲突需要澄清。特别强调全程静默自主完成探索不要问「我需要什么才能开始」之类的问题。四、Phase 2信息分析与深挖第二阶段对 Phase 1 收集的信息做价值提炼明确「FOCUS ON VALUE, NOT TECH」价值主张首要焦点——对客户的核心收益客户收益——产品如何改善他们的生活/工作关键功能——以收益而非技术规格的方式描述独特卖点——什么让它与众不同用例——真实世界的应用场景品牌身份——颜色、字体、风格、语调目标受众洞察——给谁用情感诉求与话术——人们为什么在乎。对于缺口允许「静默智能推断」价值主张不明确就从功能与受众反推受众不明确就从产品类型与话术语调推断品牌色缺失就创建互补的现代调色板。只有出现多个冲突的价值主张、无法判断 B2B/B2C、受众真正模糊时才向用户澄清。五、Phase 3汇报发现并收集用户偏好这是整个工作流中唯一「必须停下来等用户」的节点。提示词要求先输出标准格式的发现摘要 DISCOVERED INFORMATION Product: [Name] Value Proposition: [Main benefit to customers] Key Features: [2-3 main benefits] Brand Colors: [Extracted or suggested colors] Target Audience: [Who this is for]然后以固定四问收集偏好REQUIRED BEFORE PROCEEDING未确认不得进入下一阶段视频尺寸/格式横屏 1920x1080YouTube、网站竖屏 1080x1920TikTok、Instagram Reels方形 1080x1080Instagram 信息流视频时长15 秒社媒快广告、30 秒标准宣传片、60 秒详细功能展示、自定义时长视频风格现代极简类 Apple 美学、能量与大胆快节奏社媒风、专业商务面向企业、自定义风格其他要突出或定制的内容具体功能、话术、颜色等。收到答复后Agent 需要总结用户选择、落实自定义需求再带着已确认的方向进入结构设计。这一设计把「自由发挥」压缩到最小确保成片符合预期。六、Phase 4三幕式结构设计第四阶段基于用户确认的偏好设计视频结构采用经典3-act三幕式叙事 VIDEO STRUCTURE Act 1: The Hook (0-5 seconds) - [Attention-grabbing visual concept] - [Bold animation entrance] - [Compelling headline/question] Act 2: Value Demonstration (middle section) - [Show key benefits in action] - [Visual storytelling of customer value] - [2-3 feature highlights as benefits] Act 3: Call to Action (final section) - [Clear CTA with brand reinforcement] - [Memorable closing visual] - [Smooth exit animation]三幕的职责分工很清晰Hook 幕约 0–5 秒负责抓注意力——醒目的视觉概念、大胆的入场动画、有冲击力的标题或提问价值演示幕负责讲收益——把 2–3 个功能点转化为「客户获得什么」的视觉叙事CTA 幕负责收尾——强化品牌的行动召唤、令人印象深刻的闭幕画面、平滑的退场动画。随后依据已确认的画幅、风格、时长和自定义要求做适配简要呈现结构后自动进入下一阶段无需再次审批。七、Phase 5技术架构设计这一阶段在内部静默完成输出一份「实现蓝图」工具函数缓动easing、动画辅助、颜色工具可复用组件AnimatedTitle、FeatureHighlight等场景组件HookScene钩子场景、DemoScene演示场景、CTASceneCTA 场景主合成结构Video.tsx时序编排、Root.tsx注册入口。同时规划动画时序与缓动曲线、调色板实现、排版层级、图标与素材策略、Sequence 时序分解。设计完成后直接进入实现阶段不请求审批。八、Phase 6实现技术栈约束与最佳实践这是工作量最重的阶段提示词以「CONSTRAINTS TECH STACK」硬性规定了技术选型框架RemotionReact样式Tailwind CSS通过className或标准 style 对象动画使用spring、interpolate、useCurrentFrame实现平滑运动代码风格模块化组件禁止把所有内容堆进Root.tsx最佳实践没有任何元素是静态的——所有元素必须有入场opacity/scale/slide与退场动画需要图标时使用 Lucide-React使用标准字体但做重度样式化加粗、tracking-tight字距压缩除非是占位图如https://placehold.co/600x400或用户提供的素材否则不引入外部图片。实现顺序被严格规定为工具函数 → 可复用组件含转场→ 场景组件HookScene/DemoScene/CTAScene→ 主合成Video.tsx 时序编排→ Root 配置Root.tsx 注册。同时要求静默高效工作——不逐步解说每个文件、基于收集的信息做设计决策、遵循专业动画原则、保证场景间平滑转场。与 Remotion 核心 API 的对应关系提示词强调正确使用spring、interpolate、Sequence这恰好对应 Remotion 动画编程的三大支柱useCurrentFrame()返回当前帧号是驱动一切动画的时间源配合interpolate()把帧区间映射为数值变化interpolate()定义「在哪些帧区间内属性从值 A 变到值 B」可配extrapolateLeft/extrapolateRight控制区间外行为spring()基于物理参数的弹性动画适合入场动效比线性插值更自然Sequence声明式的时序容器把不同场景安排在指定from帧开始是实现三幕式结构的技术基础。「Nothing should be static」的原则本质上是要求每个 UI 元素都用上述 API 包装形成「可见即动画」的编码习惯。九、Phase 7交付与渲染实现完成后提示词要求交付明确的渲染指令# Preview the video in browser npm run dev # Render the final video npm run build npx remotion render Video out/video.mp4 # For specific codec/settings npx remotion render Video out/video.mp4 --codec h264同时交付交付摘要创建内容的简述、视频关键特性、规格时长/格式/尺寸、值得注意的设计决策。最后明确用户可以请求修改时序调整、动画修改、内容更新、风格微调。十、贯穿全程的质量标准提示词从三个维度定义了 Quality Standards是各阶段决策的统一评判尺视觉质量Visual Quality专业级动画平滑、有目的、符合品牌一致的空间与对齐可读的排版与恰当对比度统一的色彩使用。技术质量Technical Quality干净、模块化的代码架构性能优化平滑 30fps 播放正确使用 Remotion APIspring、interpolate、Sequence类型安全若使用 TypeScript。创意质量Creative Quality清晰的叙事结构抓人的开场强有力的行动召唤令人难忘的视觉时刻。十一、在 Claude Code 中如何落地使用这份提示词本质上是一段系统提示词文件落地方式与仓库 10-cli/README.md 中「System Prompt Customization」一节给出的 CLI 用法完全一致场景命令交互模式替换整套系统提示词claude --system-prompt You are a Python expert打印模式从文件加载提示词claude -p --system-prompt-file ./prompts/code-reviewer.txt query在默认提示词后追加指令claude --append-system-prompt Always use TypeScript其中--system-prompt-file明确标注为仅打印模式print mode可用交互模式请改用--system-prompt或--append-system-prompt。因此典型的用法是把 prompts/remotion-video.md 作为提示词文件配合非交互调用执行例如claude -p --system-prompt-file ./prompts/remotion-video.md \ 基于当前仓库的产品描述制作一个 30 秒宣传视频调用后Claude Code 会按照这份提示词的第 1、2 阶段自动探索当前仓库README、package.json、品牌资源、Tailwind 配置随后在第 3 阶段停下来向你确认画幅/时长/风格确认后在第 4–7 阶段自主构建 Remotion 项目并交付渲染命令。使用时的注意事项前提环境最终渲染依赖 Node.js 项目环境与 Remotion 依赖npm run dev/npx remotion render提示词本身只负责生成代码不负责安装运行环境信息边界探索阶段依赖仓库内确实存在的内容README、package.json、品牌资产等若仓库缺少这些文件提示词允许回退到智能默认值外部素材限制除非使用占位图或用户提供素材不得引用外部图片——这保证生成项目可离线自洽运行本地化副本若使用乌克兰语环境请使用 uk/prompts/remotion-video.md该文件与根目录英文版内容一致其余翻译版zh、ja、vi可通过文件头部!-- i18n-source: prompts/remotion-video.md --注释追溯到英文源。结语uk/prompts/remotion-video.md 的价值不在于「一段好话术」而在于它示范了一种可复用的 Agent 工作流编排范式用「自主探索 → 用户确认 → 自主执行」切分人机职责用三幕式结构保证叙事完整用明确的技术栈约束Remotion Tailwind spring/interpolate/Sequence保证产出可渲染、可维护、可修改。这套 7 阶段模式完全可以迁移到其他「描述 → 交付物」型任务如幻灯片、信息图、着陆页生成中是 Claude Code 高级用法中提示词工程的一份优质样板。【免费下载链接】claude-howtoA visual, example-driven guide to Claude Code — from basic concepts to advanced agents, with copy-paste templates that bring immediate value.项目地址: https://gitcode.com/GitHub_Trending/cl/claude-howto创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 Claude Code 提示词实战：用 Remotion 7 阶段工作流把产品描述自动变成高能宣传视频
Claude Code 提示词实战用 Remotion 7 阶段工作流把产品描述自动变成高能宣传视频【免费下载链接】claude-howtoA visual, example-driven guide to Claude Code — from basic concepts to advanced agents, with copy-paste templates that bring immediate value.项目地址: https://gitcode.com/GitHub_Trending/cl/claude-howto导读本文围绕 Claude How-To 仓库 uk/prompts/remotion-video.md英文源文件为 prompts/remotion-video.md展开解读这份面向Remotion与React的 Claude Code 系统提示词system prompt。它把「读取产品描述 → 产出可渲染的宣传视频」拆解为一条7 阶段自动化流水线从自主探索代码库、提炼价值主张到与用户确认画幅/时长/风格再到组件架构设计与直接交付。读完本文你将掌握这份提示词的核心设计逻辑、每个阶段的输入输出契约、三幕式视频结构、Remotion Tailwind CSS 的技术栈约束以及如何通过 Claude Code CLI 把它作为--system-prompt-file落地使用。一、这份提示词解决什么问题大多数产品团队做宣传视频时要经历「写文案 → 找设计师 → 对镜头 → 反复改稿」的漫长链路。这份提示词把目标收敛为一句能力描述以Motion Designer动态设计师 高级 React 工程师的双重角色接收一段产品描述用React 代码生成一段高能、专业的动画视频。它的适用场景非常明确让 Claude Code 在拿到一个仓库通常是待宣传产品的代码库后先自动探索、再按确认的偏好、最后自主构建一个完整的 Remotion 项目。注意它产出的不是.mp4成品文件而是一套可运行的 React 代码项目——最终视频通过 Remotion CLI 渲染得到。该文件位于仓库的prompts/目录翻译版本见 ja/prompts/remotion-video.md、zh/prompts/remotion-video.md、vi/prompts/remotion-video.md。从仓库构建脚本 scripts/build_website.py 可以看到prompts目录被显式列入EXCLUDE_DIRS即它不参与网站与 EPUB 文档渲染属于「供 Claude Code 直接消费的提示词资产」而非面向读者的教程页面——这决定了它的组织方式是一段可直接投喂的指令文本。二、六条核心设计原则提示词在进入分阶段流程之前先声明了六条 KEY PRINCIPLES它们是整个工作流的行为宪法原则含义关键行为Explore First先探索后提问自动扫描代码库收集产品信息不要一上来就问产品相关问题Ask Before Planning规划前先询问探索完成后先汇报发现再询问画幅/风格/时长等偏好最后才做计划Product URL First产品页优先若发现产品 URL产品页信息是最高优先级事实来源高于代码库发现Value Over Tech价值优先于技术聚焦价值主张、客户收益、功能卖点而非技术规格与实现细节Customer-Centric以客户为中心强调产品如何解决问题、改善生活、给用户带来收益Autonomous Execution自主执行用户确认偏好后规划与实现阶段不再请求逐级审批这六条原则的价值在于划清了「人机协作边界」探索与执行交给 Agent自主方向与偏好交给用户确认信息可信度排序是「产品 URL 代码库证据 智能推断」。三、Phase 1自主资源发现Autonomous Resource Discovery第一阶段的目标是不打扰用户地完成信息收集。提示词给出了明确的探查清单搜索README.md获取产品描述与价值主张检查package.json读取产品名称、描述、homepage URL在/assets、/public、/static、/images目录中寻找品牌资产从 CSS / Tailwind 配置文件提取配色方案查找已有的营销文案或文档在配置文件、环境变量、文档中寻找产品 URL。若找到产品 URL立即用 WebFetch 抓取产品页且产品页信息优先级高于代码库发现。对于缺失信息提示词规定了「智能默认值」smart defaults维度默认值理由视频格式横屏 1920x1080YouTube/网页优化时长30 秒大多数平台理想长度风格现代、简洁、专业基于品牌基调品牌色提取到的颜色或互补的现代调色板保持视觉一致性只有当以下情况才允许打断用户无法确定产品名/找不到任何产品信息、无法找到或访问产品 URL、存在关键歧义如 B2B 与 B2C 会彻底改变话术、信息冲突需要澄清。特别强调全程静默自主完成探索不要问「我需要什么才能开始」之类的问题。四、Phase 2信息分析与深挖第二阶段对 Phase 1 收集的信息做价值提炼明确「FOCUS ON VALUE, NOT TECH」价值主张首要焦点——对客户的核心收益客户收益——产品如何改善他们的生活/工作关键功能——以收益而非技术规格的方式描述独特卖点——什么让它与众不同用例——真实世界的应用场景品牌身份——颜色、字体、风格、语调目标受众洞察——给谁用情感诉求与话术——人们为什么在乎。对于缺口允许「静默智能推断」价值主张不明确就从功能与受众反推受众不明确就从产品类型与话术语调推断品牌色缺失就创建互补的现代调色板。只有出现多个冲突的价值主张、无法判断 B2B/B2C、受众真正模糊时才向用户澄清。五、Phase 3汇报发现并收集用户偏好这是整个工作流中唯一「必须停下来等用户」的节点。提示词要求先输出标准格式的发现摘要 DISCOVERED INFORMATION Product: [Name] Value Proposition: [Main benefit to customers] Key Features: [2-3 main benefits] Brand Colors: [Extracted or suggested colors] Target Audience: [Who this is for]然后以固定四问收集偏好REQUIRED BEFORE PROCEEDING未确认不得进入下一阶段视频尺寸/格式横屏 1920x1080YouTube、网站竖屏 1080x1920TikTok、Instagram Reels方形 1080x1080Instagram 信息流视频时长15 秒社媒快广告、30 秒标准宣传片、60 秒详细功能展示、自定义时长视频风格现代极简类 Apple 美学、能量与大胆快节奏社媒风、专业商务面向企业、自定义风格其他要突出或定制的内容具体功能、话术、颜色等。收到答复后Agent 需要总结用户选择、落实自定义需求再带着已确认的方向进入结构设计。这一设计把「自由发挥」压缩到最小确保成片符合预期。六、Phase 4三幕式结构设计第四阶段基于用户确认的偏好设计视频结构采用经典3-act三幕式叙事 VIDEO STRUCTURE Act 1: The Hook (0-5 seconds) - [Attention-grabbing visual concept] - [Bold animation entrance] - [Compelling headline/question] Act 2: Value Demonstration (middle section) - [Show key benefits in action] - [Visual storytelling of customer value] - [2-3 feature highlights as benefits] Act 3: Call to Action (final section) - [Clear CTA with brand reinforcement] - [Memorable closing visual] - [Smooth exit animation]三幕的职责分工很清晰Hook 幕约 0–5 秒负责抓注意力——醒目的视觉概念、大胆的入场动画、有冲击力的标题或提问价值演示幕负责讲收益——把 2–3 个功能点转化为「客户获得什么」的视觉叙事CTA 幕负责收尾——强化品牌的行动召唤、令人印象深刻的闭幕画面、平滑的退场动画。随后依据已确认的画幅、风格、时长和自定义要求做适配简要呈现结构后自动进入下一阶段无需再次审批。七、Phase 5技术架构设计这一阶段在内部静默完成输出一份「实现蓝图」工具函数缓动easing、动画辅助、颜色工具可复用组件AnimatedTitle、FeatureHighlight等场景组件HookScene钩子场景、DemoScene演示场景、CTASceneCTA 场景主合成结构Video.tsx时序编排、Root.tsx注册入口。同时规划动画时序与缓动曲线、调色板实现、排版层级、图标与素材策略、Sequence 时序分解。设计完成后直接进入实现阶段不请求审批。八、Phase 6实现技术栈约束与最佳实践这是工作量最重的阶段提示词以「CONSTRAINTS TECH STACK」硬性规定了技术选型框架RemotionReact样式Tailwind CSS通过className或标准 style 对象动画使用spring、interpolate、useCurrentFrame实现平滑运动代码风格模块化组件禁止把所有内容堆进Root.tsx最佳实践没有任何元素是静态的——所有元素必须有入场opacity/scale/slide与退场动画需要图标时使用 Lucide-React使用标准字体但做重度样式化加粗、tracking-tight字距压缩除非是占位图如https://placehold.co/600x400或用户提供的素材否则不引入外部图片。实现顺序被严格规定为工具函数 → 可复用组件含转场→ 场景组件HookScene/DemoScene/CTAScene→ 主合成Video.tsx 时序编排→ Root 配置Root.tsx 注册。同时要求静默高效工作——不逐步解说每个文件、基于收集的信息做设计决策、遵循专业动画原则、保证场景间平滑转场。与 Remotion 核心 API 的对应关系提示词强调正确使用spring、interpolate、Sequence这恰好对应 Remotion 动画编程的三大支柱useCurrentFrame()返回当前帧号是驱动一切动画的时间源配合interpolate()把帧区间映射为数值变化interpolate()定义「在哪些帧区间内属性从值 A 变到值 B」可配extrapolateLeft/extrapolateRight控制区间外行为spring()基于物理参数的弹性动画适合入场动效比线性插值更自然Sequence声明式的时序容器把不同场景安排在指定from帧开始是实现三幕式结构的技术基础。「Nothing should be static」的原则本质上是要求每个 UI 元素都用上述 API 包装形成「可见即动画」的编码习惯。九、Phase 7交付与渲染实现完成后提示词要求交付明确的渲染指令# Preview the video in browser npm run dev # Render the final video npm run build npx remotion render Video out/video.mp4 # For specific codec/settings npx remotion render Video out/video.mp4 --codec h264同时交付交付摘要创建内容的简述、视频关键特性、规格时长/格式/尺寸、值得注意的设计决策。最后明确用户可以请求修改时序调整、动画修改、内容更新、风格微调。十、贯穿全程的质量标准提示词从三个维度定义了 Quality Standards是各阶段决策的统一评判尺视觉质量Visual Quality专业级动画平滑、有目的、符合品牌一致的空间与对齐可读的排版与恰当对比度统一的色彩使用。技术质量Technical Quality干净、模块化的代码架构性能优化平滑 30fps 播放正确使用 Remotion APIspring、interpolate、Sequence类型安全若使用 TypeScript。创意质量Creative Quality清晰的叙事结构抓人的开场强有力的行动召唤令人难忘的视觉时刻。十一、在 Claude Code 中如何落地使用这份提示词本质上是一段系统提示词文件落地方式与仓库 10-cli/README.md 中「System Prompt Customization」一节给出的 CLI 用法完全一致场景命令交互模式替换整套系统提示词claude --system-prompt You are a Python expert打印模式从文件加载提示词claude -p --system-prompt-file ./prompts/code-reviewer.txt query在默认提示词后追加指令claude --append-system-prompt Always use TypeScript其中--system-prompt-file明确标注为仅打印模式print mode可用交互模式请改用--system-prompt或--append-system-prompt。因此典型的用法是把 prompts/remotion-video.md 作为提示词文件配合非交互调用执行例如claude -p --system-prompt-file ./prompts/remotion-video.md \ 基于当前仓库的产品描述制作一个 30 秒宣传视频调用后Claude Code 会按照这份提示词的第 1、2 阶段自动探索当前仓库README、package.json、品牌资源、Tailwind 配置随后在第 3 阶段停下来向你确认画幅/时长/风格确认后在第 4–7 阶段自主构建 Remotion 项目并交付渲染命令。使用时的注意事项前提环境最终渲染依赖 Node.js 项目环境与 Remotion 依赖npm run dev/npx remotion render提示词本身只负责生成代码不负责安装运行环境信息边界探索阶段依赖仓库内确实存在的内容README、package.json、品牌资产等若仓库缺少这些文件提示词允许回退到智能默认值外部素材限制除非使用占位图或用户提供素材不得引用外部图片——这保证生成项目可离线自洽运行本地化副本若使用乌克兰语环境请使用 uk/prompts/remotion-video.md该文件与根目录英文版内容一致其余翻译版zh、ja、vi可通过文件头部!-- i18n-source: prompts/remotion-video.md --注释追溯到英文源。结语uk/prompts/remotion-video.md 的价值不在于「一段好话术」而在于它示范了一种可复用的 Agent 工作流编排范式用「自主探索 → 用户确认 → 自主执行」切分人机职责用三幕式结构保证叙事完整用明确的技术栈约束Remotion Tailwind spring/interpolate/Sequence保证产出可渲染、可维护、可修改。这套 7 阶段模式完全可以迁移到其他「描述 → 交付物」型任务如幻灯片、信息图、着陆页生成中是 Claude Code 高级用法中提示词工程的一份优质样板。【免费下载链接】claude-howtoA visual, example-driven guide to Claude Code — from basic concepts to advanced agents, with copy-paste templates that bring immediate value.项目地址: https://gitcode.com/GitHub_Trending/cl/claude-howto创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考