Uh oh!
There was an error while loading. Please reload this page.
') + ')', 'gi'); if (regex.test(text)) { found = true; var frag = document.createDocumentFragment(); var parts = text.split(regex); parts.forEach(function(part, i) { if (i % 2 === 0) { frag.appendChild(document.createTextNode(part)); } else { var span = document.createElement('span'); span.className = 'userscript-highlight'; span.textContent = part; frag.appendChild(span); } }); node.parentNode.replaceChild(frag, node); } }); } else if (node.nodeType === 1 && node.childNodes) { // element var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT']; if (!skipTags.includes(node.tagName)) { Array.from(node.childNodes).forEach(highlight); } } } highlight(document.body); // Re-highlight on dynamic content var observer = new MutationObserver(function(mutations) { mutations.forEach(function(m) { m.addedNodes.forEach(function(node) { if (node.nodeType === 1 || node.nodeType === 3) highlight(node); }); }); }); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ', 'i'); if (__m === '*' || __re.test(location.href)) { // Strip utm_, fbclid, gclid, etc. from all links on page (function() { var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content', 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid', 'ref', 'ref_src', 'source', 'medium', 'campaign']; function cleanUrl(url) { try { var u = new URL(url, window.location.origin); var changed = false; trackingParams.forEach(function(p) { if (u.searchParams.has(p)) { u.searchParams.delete(p); changed = true; } }); return changed ? u.toString() : url; } catch (e) { return url; } } function cleanLinks() { document.querySelectorAll('a[href]').forEach(function(a) { var clean = cleanUrl(a.href); if (clean !== a.href) a.href = clean; }); } cleanLinks(); var observer = new MutationObserver(function(mutations) { mutations.forEach(function(m) { m.addedNodes.forEach(function(node) { if (node.nodeType === 1) { if (node.tagName === 'A') cleanLinks(); node.querySelectorAll('a[href]').forEach(function(a) { var clean = cleanUrl(a.href); if (clean !== a.href) a.href = clean; }); } }); }); }); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + ', 'i'); if (__m === '*' || __re.test(location.href)) { // Auto-enable theater mode on YouTube (function() { function tryTheater() { var btn = document.querySelector('button[aria-label="Theater mode"], ytd-player #player button[title="Theater mode"]'); if (btn && !btn.classList.contains('activated')) { btn.click(); } } // Try immediately tryTheater(); // Try after navigation (SPA) var lastUrl = location.href; setInterval(function() { if (location.href !== lastUrl) { lastUrl = location.href; setTimeout(tryTheater, 500); } }, 1000); // Also try on player load var observer = new MutationObserver(tryTheater); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ', 'i'); if (__m === '*' || __re.test(location.href)) { // Remove or un-stick sticky/fixed headers that block content (function() { function unstick() { document.querySelectorAll('header, nav, [role="banner"], .header, .navbar, .sticky, .fixed-top, [style*="position: fixed"], [style*="position:sticky"]').forEach(function(el) { if (el.style.position === 'fixed' || el.style.position === 'sticky' || getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') { el.style.position = 'static'; el.style.top = 'auto'; el.style.zIndex = 'auto'; } }); } unstick(); var observer = new MutationObserver(unstick); observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] }); })(); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); })();
There was an error while loading. Please reload this page.
参赛项目名称
电商线框策略工作台|Ecommerce Wireframe Strategist
团队 / 作者
ChecheChat
GitHub:[@ChecheChat](https://github.com/ChecheChat)
我做了什么
我制作了一套面向电商运营与设计师的纯文本分析 Skill,用于解决电商设计在线框形成前缺少系统判断,以及设计上线后数据难以进入下一轮的问题。
在实际工作中,运营或设计师制作主图、详情页、活动页之前,需要先理解商品、研究市场与竞品、提炼卖点、判断品牌调性,并确定页面的信息顺序。这些工作通常分散在聊天记录、表格和个人经验中,容易出现需求不完整、结论缺少依据、运营与设计理解不一致等问题。
本项目将这套隐性的判断过程整理为五个连续阶段:
Skill 不负责生成最终图片,也不连接电商或投放平台 API。它专注于设计前后的决策质量,让调研有依据、线框有目标、反馈能够真正进入下一轮。
为了减少 AI 凭常识补充结论,工作流将所有重要判断区分为“事实、共识、推断、机会、待验证”,并要求核心策略能够追溯到用户提供的材料。
使用的工具
效果展示
项目最终形成了一套可以重复使用的电商视觉线框决策流程。
用户只需要手动提供商品信息、设计任务、品牌规则、市场资料、竞品资料、用户评价及历史数据,Skill 就会按阶段生成:
线框策略不会只给出笼统的“高级感、年轻化”等风格词,而是明确每个模块的目的、主信息、支撑证据、内容元素和验收标准。
例如:
上线后,用户可以继续录入版本变化、表现数据和运营观察。Skill 会区分已经观察到的事实、可能的解释和暂时无法判断的问题,并为下一轮建议一至两个最小测试变量,避免每次把整套方案全部推翻。
项目链接(可选)
GitHub 仓库:
https://github.com/ChecheChat/ecommerce-wireframe-strategist
踩坑记录(可选)
1. 不能在资料不完整时直接生成线框
最初容易把工作流理解成“输入商品信息,立即输出页面结构”。但如果缺少本轮经营目标、核心卖点证据或品牌边界,生成的线框看似完整,实际无法用于设计。
因此增加了“资料台”和阶段门禁。Agent 会先输出已知信息、缺失信息、冲突信息和待验证假设,再判断是否适合进入下一阶段。
2. 竞品常用的表达不等于已经验证有效
多个竞品都采用某种卖点或页面结构,只能说明它是行业常见做法,不能直接证明它有效。
因此调研阶段会分别识别行业共识、同质化表达、可测试机会和潜在风险,避免把竞品分析变成简单照搬。
3. 线框不能只是固定模块模板
如果所有商品都机械套用“痛点—卖点—成分—效果—促销”,就无法反映不同商品和用户的真实决策过程。
现在每个线框模块都必须回答“这一段承担什么用户决策任务”,无法服务本轮目标的模块会被删除。
4. 不能把转化问题全部归因于设计
转化结果还可能受到价格、商品竞争力、流量人群、库存、促销机制和页面承接等因素影响。
因此复盘 Agent 必须同时提供至少一个非设计层面的解释,并指出还需要哪些信息才能进一步判断。
5. 单次数据反馈不能直接证明因果
一个版本表现提升,并不能证明所有修改都有效。一次同时修改过多内容,也会导致下一轮无法复用经验。
因此每轮只建议测试一至两个主要变量,同时记录修改项、保持项、预期影响和实际结果,让反馈逐步沉淀为可以复用的设计经验。