القائمة
当用户已经有电商详情页文案、HTML 图、原型图、产品图、包装图，想逐屏判断信息任务、推荐视觉风格、生成单屏详情页设计、逐屏修改确认，并最终拼接成 750px 电商详情页长图时使用。
يُحدَّد Prompt الذي يراجع المصدر أولًا بشكل افتراضي. يمكنك التبديل إلى أمر مباشر أو تنزيل نسخة محلية.
اقرأ SKILL.md وأي ملفات مرافقة يعرضها SkillsMP قبل أن تقرر التثبيت.
التثبيت باستخدام Codex أو Claude انسخ هذا Prompt والصقه في Codex أو Claude أو مساعد آخر ليراجع صفحة Skill ويثبّتها لك.
يتجاوز الأمر المباشر Prompt المخصّص للمراجعة. افحص المصدر قبل تشغيله.
npx skills add https://github.com/saibodafu/e-commerce-skill --skill ecommerce-detail-page-visual-designيبقى الأمر في سطر واحد. مرّر أفقيًا لمراجعته كاملًا قبل النسخ.
تفضّل نسخة محلية؟ نزّل الملفات المتاحة حاليًا لدى SkillsMP.
عرض SKILL.md
| name | ecommerce-detail-page-visual-design |
| description | 当用户已经有电商详情页文案、HTML 图、原型图、产品图、包装图，想逐屏判断信息任务、推荐视觉风格、生成单屏详情页设计、逐屏修改确认，并最终拼接成 750px 电商详情页长图时使用。 |
当用户已经完成详情页文字信息梳理，并提供详情页 HTML 图、原型图、产品图、包装图、品牌图或单屏设计稿时，使用本 skill 协助完成后续视觉设计流程。
本 skill 不负责从零梳理详情页内容结构；如果用户还没有详情页文案、模块顺序或产品信息，应先使用 ecommerce-content-wireframe。
用户需求涉及以下任一情况时触发：
ChatGPT Image 2；不要改用其他生图模型替代。开始前，优先确认用户是否已经提供原型图和包装图。其他材料不限，有则使用，没有则基于现有信息推进，并在输出中标注“假设”。
【原型图】：必须提供，用于判断每一屏结构、文案位置和信息顺序
【包装图】：必须提供，用于提取品牌色、产品气质、包装元素和视觉统一方向
【其他可选材料】：详情页文案、HTML 图、产品图、品牌规范、目标平台、字体要求、禁用表达、必须露出的资质或卖点
如果缺少原型图或包装图，先请用户补充。其他材料不作为启动门槛；缺少时做轻量合理假设，并在输出中标注“假设”。
当用户想进入详情页视觉设计流程时，使用下面的话术，不要直接套用“假如你是……”：
我会基于你已经整理好的详情页文案、原型图和产品图，按“逐屏分析 - 分析确认 - 3 个视觉风格方向 - 逐屏生图提示词 - 单屏生成 - 修改确认 - 长图拼接 - 最终质检”的顺序推进。
我先不直接出图，会先帮你判断每一屏的信息任务、适合的视觉表达、核心视觉元素和需要避开的风险点。确认后，再进入统一视觉风格和逐屏作图。
请先提供详情页文案/HTML 图、原型图、产品图或品牌包装图。已经提供的话，我会先从逐屏分析开始。
如果用户已经提供完整材料，可以直接进入“阶段 1：逐屏分析”。
按以下顺序推进，不要跳步：
目标：根据每一屏文案，判断这一屏承担的转化任务和视觉表达方向。
输出表格：
| 屏序 | 当前屏核心文案 | 信息任务 | 视觉表达类型 | 核心视觉元素 | 不允许出现的内容/风险点 |
|---|
判断标准：
阶段收尾话术：
以上是逐屏视觉分析。你可以确认这版分析，也可以指定某一屏调整信息任务、视觉类型或风险判断。确认后，我会进入 3 个视觉风格方向推荐。
目标：让用户先确认逐屏分析是否准确，再进入视觉风格方向推荐。
如果用户没有明确确认，不要直接进入生图。可以继续修改某一屏的信息任务、视觉表达类型、核心视觉元素或风险判断。
确认话术：
如果这版逐屏分析没有问题，你可以回复“确认”，我会基于已提供的产品信息、品牌包装图和详情页文案，推荐 3 个适合电商详情页的视觉风格方向。
目标：根据已提供的产品信息、品牌包装图和详情页文案，推荐 3 个适合电商详情页的视觉风格方向。每个方向用一句话描述风格、构图、字体方向，方便复用在每一屏作图前的统一视觉风格提示词。
输出格式：
视觉风格方向 1：
一句话描述：[风格、构图、字体、色彩质感、适合复用的屏幕类型]
视觉风格方向 2：
一句话描述：[风格、构图、字体、色彩质感、适合复用的屏幕类型]
视觉风格方向 3：
一句话描述：[风格、构图、字体、色彩质感、适合复用的屏幕类型]
推荐优先方向：
[说明为什么这个方向最适合当前产品、品牌包装和转化目标]
要求：
阶段收尾话术：
你可以直接选一个方向，例如“选 2”；也可以说“1 和 3 融合”，或告诉我想更偏高端、清爽、专业、场景化、货架感。确认风格后，我会基于原型图逐屏生成可用于 AI 生图的提示词。
目标：基于用户提供的详情页原型图，按照原型图中的每一屏文案、版式和信息层级，逐屏生成可用于 AI 生图的提示词。
这一阶段只生成提示词，不直接生成图片。
每一屏提示词必须包含：
第 X 屏 AI 生图提示词
主体：[画面主体]
场景/背景：[画面场景或背景]
核心元素：[必须出现的视觉元素]
构图：[画面主体位置]，[文字位置]，[信息层级要求]
风格要求：[贴入已确认的固定统一视觉风格描述]
尺寸：竖版电商详情页，宽 750px
限制要求：
阶段收尾话术：
以上是逐屏 AI 生图提示词。你可以确认全部提示词，也可以指定某一屏修改主体、背景、核心元素、构图或风格要求。确认后，我会使用 ChatGPT Image 2 从第 1 屏开始逐屏生成。
每次只生成一屏。不要一次性生成全部屏。
生成当前屏图片时，必须调用 ChatGPT Image 2。该模型更适合电商详情页里的中文标题、卖点和长图文案呈现。
如果当前环境无法调用 ChatGPT Image 2，不要改用其他生图模型替代；应先说明限制，并输出可复制给 ChatGPT Image 2 的单屏作图提示词。
单屏生成前，先明确：
当前生成：第 X 屏
使用的 AI 生图提示词：
信息任务：
沿用视觉风格：
核心视觉元素：
需要避开的风险点：
单屏作图要求：
单屏生成后的固定话术：
这是第 X 屏。你可以回复“确认”，我再继续下一屏；也可以告诉我需要修改的地方，例如产品更大、文字更突出、风格更清爽、场景更生活化、色彩更贴近包装。
用户提出修改意见时，只修改当前屏。
修改规则：
修改后的话术：
已按你的意见调整当前屏。你可以继续提出修改，或回复“确认”进入下一屏。
用户确认当前屏后，继续下一屏。
进入下一屏的话术：
当前屏已确认。我会沿用已经确认的整体视觉风格，继续生成第 X 屏；这一屏会根据它的信息任务调整画面重点，避免和上一屏构图完全重复。
当所有单屏都确认后，再执行长图拼接。
长图要求：
拼接前确认话术：
所有单屏已经确认。我接下来会按确认顺序纵向拼接成长图，默认宽度 750px，并检查漏屏、错序、重复、文字裁切和产品裁切问题。
长图完成后必须做最终检查，并输出检查结果。
质检清单：
长图质检结果：
- 屏幕顺序：
- 是否漏屏：
- 是否重复：
- 宽度是否统一：
- 文字是否完整清晰：
- 产品是否被裁切：
- 屏与屏衔接：
- 合规风险复查：
如果发现问题，先列出问题，再修正，不要直接说完成。
当用户提供批量化的电商用户评论数据，希望按固定流程完成数据质检、清洗、字段拆分、结构化打标、购买人群与场景、正负面口碑、竞品参照物分析，并同时输出可筛选编辑 Excel 分析母表和可视化 HTML 完整分析报告时使用。
当用户需要为小红书带货、种草、产品科普、测评对比、避坑选购生成 2-4 张连续图文卡片方案、每页文案、版式结构或 AI 出图提示词时使用。支持科普类、测评类、避坑类三种模式，适合食品、母婴、美妆、健康、数码、日用品等电商品类内容。
当用户希望基于明确的产品信息，梳理电商商品详情页内容、生成详情页内容结构、详情页文案、手机长图 HTML 黑白线框稿时使用。
استنادا إلى تصنيف SOC المهني