尧图网站设计 尧图网站设计YAOTU DESIGN
ARTICLE DETAIL

资讯详情

深耕网站设计与一线实操的经验洞察。

AI+流程SOP:把电商详情页返工从五版压到两版

AI+流程SOP:把电商详情页返工从五版压到两版 上周有个做家居电商的朋友跟我吐槽说他们一款按摩椅的详情页改到第五版了运营、设计、老板三个人已经互相觉得对方“不懂需求”。我让他把五版稿子发我看了一眼第一版嫌不够高级第二版说卖点没讲透第三版觉得信息太满第四版又嫌没有信任背书第五版……其实第五版的问题和第一版一模一样只是换了个说法。我说你这不是设计问题是流程问题。改来改去都是图但从头到尾没有人把“这一页到底要解决什么”这件事写清楚。后来我帮他搭了一套基于 WorkBuddy 的 AI 电商详情图流程 SOP——需求先用结构化卡片写死卖点交给 AI 做分析排序文案和画面脚本由 AI 出初稿设计师只做视觉呈现最后还有一道 AI 合规预审。这套流程跑下来详情页从五版压缩到两版第二版基本就过了。这篇文章我打算把自己搭这套流程的完整思路、每一步的 Prompt 模板、踩过的坑全部摊开来写。适合电商运营、详情页设计师、自己做店的小老板以及所有被“详情页返工”折磨过的团队。就算你暂时不用 WorkBuddy只要手头有一个支持 Skill 或 Agent 编排的 AI 工具这套思路都能直接搬过去。1. 先别急着改图详情页为什么总是改到第五版1.1 返工的五个隐藏原因全都跟图没关系我做电商内容这行快十年发现一个规律详情页返工90% 的问题出在图之外而不是图本身。那些改到第五版第六版的项目翻开聊天记录几乎都能找到下面几个特征。第一个原因是需求源头模糊。运营给设计的需求经常是“做得高级一点”“要有质感”“突出我们的优势”。这些词不是需求是感觉。每个人对“高级”的理解完全不一样有人觉得深色背景配金线是高级有人觉得大留白加细字体才是高级。设计师按照自己理解做了一版运营看了说不对老板看了又觉得可以因为老板也没想清楚。需求没被写死返工就是必然。第二个原因是卖点没有排序。详情页本质上是一篇说服用户下单的文案它应该有清晰的表达逻辑。但很多团队的做法是把产品说明书上的参数全部搬上去把仓库里的证书和授权书全部铺上去把客服话术里的卖点全部堆上去。结果就是详情页变成流水账用户划了三屏还不知道这个产品到底哪里好。卖点一旦没有优先级设计师就不知道该放大什么、弱化什么改稿自然没有方向。第三个原因是信息架构缺失。详情页不是一张图是一套信息流。用户先看什么、再看什么、最后看什么每个板块承担什么任务这些在动手出图之前就应该定好。很多团队跳过了这一步直接让设计师开干结果做到一半发现“信任背书”没地方放“使用场景”又和“产品参数”重复了。信息架构没定画面再怎么优化都是白搭。第四个原因是审核节点混乱。正常的流程应该是需求评审、脚本评审、初稿评审、终稿验收每过一个节点再往前走。但很多小团队省略了中间的评审环节设计闷头做了一整版拉群之后老板一句“整体感觉不对”整个方向推翻。一次推翻可能就是两三天的工作量五版下来一个半月就没有了。第五个原因是缺乏统一的验收标准。改到后来大家不是在解决问题而是在打嘴仗。运营说字体太小设计说这是为了高级感老板说要突出促销信息结果三个人的意见互相矛盾。没有一份写下来的 checklist就没有人说得清什么叫“做完了”。1.2 一个看哭设计师的案例按摩椅详情页的五版返工复盘把上面五个原因落到一个具体例子里会更直观。我朋友那个按摩椅项目真实的返工过程大概是这样的。第一版设计师按“轻奢风”做深色底、金色线条、大字体视觉上确实挺唬人。老板看了一眼说“不够高级”。但“高级”是什么老板自己也说不清。后来我们复盘发现老板想说的是“这个价格段的用户要的是科技感和专业感不是奢华感”。这个信息需求阶段完全没提。第二版设计师换成了科技蓝加产品拆解图卖点倒是都放上去了但运营说“没讲透”。核心卖点是人体工学曲线结果这页被排在了第三屏用户根本不知道产品到底怎么贴合身体。卖点没有被排序核心信息埋没在参数堆里。第三版运营把全部技术参数铺满老板看了皱眉说“信息太满没有重点”。这一版其实不是设计的问题是“信息架构缺失”的问题——哪些卖点放主视觉哪些放中间解释哪些放底部背书没有人定义过。第四版设计师做减法只留三个核心卖点页面清爽了很多。结果老板又问“我们的医疗器械资质和三年质保呢怎么不展示”做减法的时候把信任背书减掉了而背书恰恰是这个品类最关键的转化因素。第五版把所有元素又都加回来了首页超长用户划四五下都看不完一轮核心卖点。我们检查了一遍跟第一版犯的是同一个错误——没有重点。你看五版返工没有一版是因为“图做得丑”被推翻的。问题出在需求、卖点优先级、信息架构、审核节点和验收标准上。而这五件事全部可以用一套 SOP 管起来再让 AI 在每个环节提前生成规范化内容把返工成本压在前期。2. 思路换挡把“换设计师”改成“搭AI流程SOP”2.1 为什么 WorkBuddy 这类 AI 工作台适合干这件事很多人一听“用 AI 做详情页”第一反应是让 AI 生成图片。但我的观点不一样AI 现阶段最大的价值不是替设计师画图而是替团队把流程跑顺。WorkBuddy 这类 AI 工作台核心能力是可以把不同的 AI 任务编排成可复用的 Skill。你可以把“竞品分析”做成一个 Skill把“卖点提炼”做成另一个 Skill把“合规预审”做成第三个 Skill。每个 Skill 有固定的输入、输出和 Prompt 模板团队里任何人调用同一个 Skill得到的结果规范程度是一致的。这带来的好处非常大。以前新人接手详情页项目全靠问老同事、翻聊天记录每个人的理解和表达都不一样。现在需求阶段填一张结构化的需求卡片卖点分析交给 AI 跑文案脚本由 AI 出初稿设计师拿到的不是一句“要高级”而是一份已经排好优先级的信息架构。人的审美和创造力仍然用在刀刃上但那些重复的、模糊的、容易扯皮的工作都被 AI 和流程接住了。我用一个厨房的类比来解释SOP 是菜谱AI 是配菜工设计师是主厨。菜谱规定了每一道菜用什么料、什么顺序、什么火候配菜工负责切菜、备料、称重主厨只管最后下锅调味。以前的问题是——没有菜谱配菜也乱切主厨还得一边炒菜一边打电话问老板要什么口味那不改五版才怪。2.2 SOP 的五个核心节点每道工序都要有“验收签字”这套电商详情图流程 SOP我把整条链路拆成五个节点每个节点有明确的输入、输出、负责人和验收标准。节点之间像流水线只有上一站验收通过才能流到下一站。第一个节点是需求立项。运营或店主填写需求卡片内容是标准化的产品名称、目标人群、价格带、核心卖点候选、竞品参考、信任背书素材、风格倾向、禁忌项。这一站的验收标准是需求卡片里的每一项都写清楚了没有主观形容词。第二个节点是竞品分析与卖点提炼。AI 根据需求卡片收集并分析同类产品的详情页结构与卖点表达输出一份卖点层级树一级卖点决定用户是否停留、二级卖点解决疑虑、三级卖点信任背书。验收标准是卖点之间有明确的主次关系每个卖点都有依据。第三个节点是文案与画面脚本。AI 基于卖点层级树生成每个信息板块的标题、副标题、说明文案、配图描述和设计注意。验收标准是脚本可以直接交给设计师而不需要设计师再反过来猜。第四个节点是设计执行与 AI 预审。设计师按照脚本出图AI 跑合规检查——广告法违禁词、错别字、卖点一致性、信息是否遗漏。验收标准是检查报告里没有红色拦截项。第五个节点是验收与交付。相关人员对照验收清单逐项打钩确认无误后签字交付。后面每一次修改必须先改脚本再改图不允许直接改图。验收标准是修改意见对应到脚本的具体位置而不是一句“感觉不对”。这套流程的关键是把所有模糊的东西在前期用文字定格。图可以重画但信息架构和文案逻辑一旦定了设计返工的次数会急剧下降。3. 实操在 WorkBuddy 里落地这套详情页流程接下来是实操部分。我会按照五个节点把每一步怎么在 WorkBuddy 里落地、用什么 Prompt、产出什么格式都写清楚。你可以直接复制改一改就能用。3.1 第一步需求卡片先把话说清楚AI才好干活需求卡片是整个 SOP 的地基。我建议你把下面这个模板存成一个固定文档每次做新详情页之前必须填完不填完不许立项。- 产品名称___________ - 目标人群年龄/性别/消费特征___________ - 价格带___________ - 核心卖点候选列出5条暂不排序___________ - 目标人群最关心的3个问题___________ - 竞品参考链接或截图描述___________ - 信任背书素材资质/证书/OEM代工/明星背书/权威报告___________ - 风格倾向参考图描述避免形容词写具体参考___________ - 禁忌项不能出现的颜色/词语/元素___________ - 这次详情页的核心目标拉新转化/老客复购/品牌形象___________填这个卡片的过程本身就在逼着团队把话说清楚。比如“风格倾向”一栏不许写“高级感”必须写“参考某洁的米色背景细黑体大量留白”。再比如“禁忌项”很多人第一次填这一栏的时候才发现自己家的品牌色里其实有一个不能大面积使用的颜色。填完之后你可以把需求卡片直接扔给 WorkBuddy 的一个基础 Skill让它做一次“完整性检查”判断哪一项还没说清楚返回需要补充的问题清单。这一步用不了两分钟但能把大量“我以为你懂了”的误会消灭在源头。3.2 第二步用 Skill 做竞品分析与卖点层级树竞品分析这个环节以前靠人肉翻页面费时而且没有统一格式。现在我在 WorkBuddy 里建了一个 Skill叫“竞品详情页分析”输入是需求卡片加竞品详情页的文本内容输出是一张卖点层级树。下面是这个 Skill 的核心 Prompt你可以直接用你是一名资深电商内容策略师。请基于以下需求卡片和竞品信息输出竞品分析结果和卖点层级树。 需求卡片 {粘贴需求卡片内容} 竞品信息 {粘贴竞品详情页文本或描述竞品页面结构} 输出格式Markdown表格 1. 竞品详情页结构拆解按“首屏主视觉/核心卖点/参数区/背书区/溢价款”分类列出竞品每个区块的内容和用途。 2. 竞品卖点表达分析总结竞品用了哪些表达方式哪些表达值得借鉴哪些已经被用滥。 3. 卖点层级树 - 一级卖点首屏必须让用户记住的一句话1条 - 二级卖点解释一级卖点的支撑论据2-3条 - 三级卖点信任背书、资质、服务承诺3-5条 4. 差异化机会结合需求卡片的目标人群提出2-3个竞品没有重点打、但目标人群关心的卖点方向。为什么输出必须是“卖点层级树”因为设计师拿到这棵树就知道首屏放什么、中间解释什么、底部背书什么。运营拿到这棵树就知道文案标题的优先级。三级结构本身就是详情页的信息架构等于把后面最容错的一步提前做完了。要注意AI 做竞品分析时可能会凭记忆编造竞品内容所以我在 Skill 里专门加了一条只基于用户提供的竞品信息做分析不允许编造未提供的数据。这个约束能拦掉大部分幻觉。3.3 第三步AI 生成详情页文案和画面脚本卖点层级树确认之后进入文案和画面脚本生成环节。这一步是整个流程的核心产出设计师后续的工作完全建立在它之上。我在 WorkBuddy 里建了第二个 Skill叫“详情页分镜脚本生成器”。输入卖点层级树输出按浏览顺序排列的分镜表格。Prompt 是这样你是一名电商详情页文案策划师。请根据下面的卖点层级树和产品信息输出详情页分镜脚本。 卖点层级树 {粘贴上一步结果} 产品信息 {粘贴需求卡片中的产品信息} 输出要求 1. 详情页按10-12屏规划每屏一个核心主题。 2. 每屏输出5项视觉区域标题用户看到的第几屏、屏幕目标这一屏要解决用户什么问题、文案标题副标题简短说明、配图描述给设计师的画面提示、设计注意字体/颜色/元素。 3. 首屏必须包含产品主图一级卖点最后一屏必须包含尺寸/服务/售后信息。 4. 文案使用口语化表达禁止堆砌形容词禁止使用“甄选、臻品、尊享”等营销套话禁止编造数据。 输出格式为Markdown表格列名屏序|视觉区域|屏幕目标|文案|配图描述|设计注意这个脚本的价值在于它把设计师最烦的“这屏到底放什么”“文案写多长”“配图要什么感觉”全部写清楚了。设计师不需要再去猜只需要照着脚本做视觉呈现。运营拿到脚本也能提前确认卖点表达是不是自己要的有问题在出图前改五分钟搞定而不是出图后推翻重来。3.4 第四步AI 预审把广告法违禁词和错别字拦在出图前详情页文案写完之后很多人忽略了合规问题结果图做完了平台检测到违禁词直接下架又得全部重来。这一步我也做成 Skill叫“详情页合规预审”。这个 Skill 做四件事一是扫描广告法违禁词比如“最”“第一”“国家级”“100%”这类绝对化表述二是检查错别字和语句病句三是核对卖点与需求卡片的一致性看有没有 AI 或设计师自己加的、产品本身不支持的功能描述四是检查信息完整性看有没有漏掉售后、生产日期、规格参数等必填内容。你是一名电商法规审核员。请检查下面的详情页文案和画面脚本输出审核报告。 内容 {粘贴文案和脚本} 审核规则 1. 标出所有违反广告法的词句并给出替换建议。 2. 标出错别字、语病和语义歧义。 3. 对照需求卡片中的产品信息标出文案中凭空增加、产品本身不支持的卖点。 4. 检查详情页信息完整性是否有产品规格、售后政策、品牌信息、生产信息等平台要求的基础模块。 输出格式表格形式列出“问题位置|问题类型|问题描述|修改建议”。如果没有问题输出“预审通过”。这一步相当于在出图之前先做了一次免费的法务审核。我朋友那个按摩椅项目第一版文案里就写了“最舒适的按摩体验”AI 预审直接标红设计师在出图前就把文案换成了“自适应人体曲线设计”。这个拦截至少省掉了一整轮返工。3.5 第五步交付验收清单改稿必须改文档不能改图最后这道工序表面上最不“AI”但恰恰决定了前面四步的成果能不能稳住。我把验收清单固定成一张表格每次交付都对照打钩。验收清单 [ ] 首页主图是否在首屏完整露出卖点是否一眼可见 [ ] 核心卖点是否按层级树顺序呈现没有跳跃 [ ] 每屏文案是否有错别字、违禁词内容与产品信息一致 [ ] 信任背书模块是否完整资质/证书/售后/品牌信息 [ ] 参数与规格是否准确无夸大或虚构 [ ] 详情页总长度是否控制合理关键信息是否在前3屏出现 [ ] 是否同步了手机端适配检查 [ ] 是否有明确的修改记录修改点是否对应脚本位置重点在最后一条。每次有人提修改意见我会要求对方先说清楚改的是哪个脚本位置、改成什么样然后先改文档再决定要不要动图。如果只是“感觉不对”那就回到需求卡片把“感觉”翻译成具体描述。这一条执行到位之后我发现团队里的设计争吵大幅减少因为大家开始用文字沟通而不是用情绪沟通。4. 踩坑实录与问题速查这套流程用起来没那么美好4.1 我踩过的五个坑给你提个醒第一个坑是 AI 生成内容“营销腔”太重。第一次跑出来的脚本满屏都是“尊享”“臻品”“奢华体验”放在五年前的详情页里没问题现在用户看到这类词只会觉得假。后来我在所有 Prompt 里都加了“禁止使用营销套话、禁止堆砌形容词、优先使用具体数据和行为描述”情况才好转。AI 默认是按照广告文案训练的你得主动纠正它让它说人话。第二个坑是 AI 编造数据。某个详情页脚本里AI 自动写了一行“销量突破十万台”实际上这个新品上市才一个月。这种幻觉极其危险电商平台和广告法对虚假宣传是零容忍的。所以我在合规预审 Skill 和所有文案 Prompt 里都强制加了一条“只能引用输入资料里出现的数据不允许自行扩展或推测”。同时人工复核确认数据来源这一步无论如何都不能省。第三个坑是竞品分析时效性差。AI 的训练数据里关于某个竞品的信息可能是半年前的页面结构早就换了。好在我给它的输入本来就只限定在人工提供的竞品信息所以这个问题影响不大。但如果你试图让 AI 凭记忆分析竞品务必在 Prompt 里加上“如果输入信息不足直接说明不要补全”。第四个坑是多个 Skill 之间上下文丢失。WorkBuddy 里每个 Skill 是独立执行的需求卡片里的信息不会自动流到后面的 Skill 里。我第一次跑的时候每个 Skill 都要重新粘贴一遍产品信息漏一次就出错。后来我建了一个固定的“项目上下文文档”把需求卡片、卖点层级树、脚本版本全部维护在一个文件里每次调用 Skill 的时候明确引用基本解决了这个问题。第五个坑是验收清单流于形式。刚开始团队把清单打印出来却发现没人认真打钩大家还是习惯口头说“没问题”。后来我把验收清单绑定到交付流程里不提交打钩后的清单设计就不算完成项目经理不安排后续工作。流程一旦成为硬约束效果立刻不一样。4.2 常见问题速查表遇到问题先翻这一栏现象可能原因解决方法详情页改了第五版仍然在返工需求卡片缺失或描述模糊回到第一步把需求用结构化卡片重新写清楚禁止使用主观形容词设计师说脚本没法用脚本里的配图描述过于抽象在 Prompt 中要求配图描述必须包含主体、背景、构图、光线四要素文案出现夸大宣传AI 生成了未经验证的卖点在所有 Prompt 中加入“仅引用输入资料中明确出现的数据和事实”第三屏才出现核心卖点卖点层级树没有遵守检查一级卖点是否被放在首屏脚本中必要时人工干预脚本顺序合规预审多次报错原始文案违禁词太多先在文案生成的 Prompt 中强约束“禁止绝对化表述”再进行预审修改意见只有“感觉不对”验收标准没有细化要求修改方对应到脚本的具体位置先改文档再改图不同 Skill 之间信息对不上项目上下文没有共享建立统一的项目上下文文档所有 Skill 调用同一份输入这张表我打印出来贴在工位上每次项目卡壳就先对照一遍大部分问题都能定位到具体环节。4.3 可以直接复制的验收节奏但需要结合你的团队情况最后分享一个在团队里跑通的节奏供参考。第一天上午需求负责人提交需求卡片AI 做完整性检查当天完成竞品分析和卖点层级树第二天AI 生成文案和画面脚本运营和老板对脚本做一次评审修改点记录在案第三天设计师出初稿AI 跑合规预审交付验收清单第五天终稿验收按清单逐项打钩。整个链路里评审只针对文案和脚本出图后不再动方向性的东西。这个节奏不一定适合所有团队但核心原则是通用的需求先写死、卖点先排序、脚本先确认、合规先预审、改动先落文档。只要把这几条做到位详情页返工的概率至少能降一半。我个人在实际操作中最大的体会是做这套流程并不是为了“用 AI 取代任何人”而是为了让团队里每个人的时间和专业能力都花在真正有价值的地方。设计师不该每天揣摩老板的“高级感”到底是什么意思运营不该在客服话术和详情页文案之间反复搬运老板也不该每次都等到出图之后才说“感觉不对”。最后说一句如果下次有人再拿着第五版详情页来找你说“这版感觉还是不对”建议你先别急着开 PS 或者找 AI 重画。打开需求卡片问他一句——“你说的感觉对应到哪一屏、哪一个文案、哪一个卖点”能回答上来就改回答不上来改十版也是白改。
返回列表