← 返回
未分类

winson-html-scenario-deliverable-skill

将任意方案、构想或策略转化为结构化HTML推演交付物。输出包含逻辑推导链、可视化原型、执行排期、成本测算的交互式单页应用,支持打印/PDF导出。采用咨询级客观冷静风格。
将任意方案、构想或策略转化为结构化HTML推演交付物。输出包含逻辑推导链、可视化原型、执行排期、成本测算的交互式单页应用,支持打印/PDF导出。采用咨询级客观冷静风格。
winson
未分类 community v1.0.0 1 版本 100000 Key: 无需
★ 0
Stars
📥 8
下载
💾 0
安装
1
版本
#latest

概述

HTML 方案推演交付生成器

一、核心哲学

1.1 唯一铁律

> 方案的价值不在于写得厚,而在于推得清、看得见、落得地。

一份好的方案推演交付物,必须让决策者在5分钟内理解核心逻辑,在15分钟内看到完整执行路径,在30分钟内做出go/no-go决策。HTML交付物不是PPT的替代品,而是PPT的进化形态——它用交互和结构化推导替代了静态罗列。

1.2 三个底层认知

认知说明
------------
推导优先于展示先展示"为什么这么做"的逻辑链,再展示"怎么做"。没有推导的方案是命令,有推导的方案是共识
可视化即说服力人脑处理图像的速度是文字的6万倍。关键概念必须可视化,数据必须图表化,流程必须结构化
闭环优于开环方案必须包含"假设→验证→迭代"的闭环。没有反馈机制的方案,执行到一半就会迷失方向

1.3 核心公式

用户输入(方案/构想/策略)
  → 需求解构(目标+约束+假设)
    → 逻辑推导链构建(Why → What → How)
      → 模块拆解(设计+流程+话术+排期+成本)
        → HTML结构化输出(单页交互应用)
          → 交付

二、完整执行流程

Phase 1:需求解构

Step 1.1:识别输入类型

输入类型判断

输入类型特征处理方式
--------------------------
方案文档已有完整文字方案,需可视化推演提取核心逻辑,重构为推导链
构想/idea只有一句话或片段思路补全假设,推导完整路径
策略指令领导/客户给出的目标性要求逆向推导执行路径
问题陈述描述现状痛点,需解决方案从问题出发构建解决路径

检验标准:明确回答"这个方案要解决什么问题、面向谁、在什么约束条件下"。

Step 1.2:提取关键要素

从输入中提取以下要素:

目标: [方案要达成的核心目标]
受众: [方案的最终使用者/决策者]
约束条件: [预算/时间/资源/合规等限制]
核心假设: [方案成立的前提条件]
关键变量: [影响成败的可量化指标]

检验标准:提取的要素能让陌生人快速理解方案背景。


Phase 2:逻辑推导链构建

Step 2.1:构建"Why → What → How"推导链

Why(为什么)

  • 现状痛点是什么?
  • 不解决会有什么后果?
  • 解决后的理想状态是什么?

What(做什么)

  • 核心策略是什么?
  • 关键举措有哪些?
  • 预期产出是什么?

How(怎么做)

  • 执行步骤如何排序?
  • 资源如何配置?
  • 风险如何管控?

检验标准:推导链中的每一步都能回答"所以接下来要做什么"。

Step 2.2:设计逻辑推导可视化

每个模块顶部必须包含一个Logic Chain组件:

[起点状态] → [关键动作1] → [关键动作2] → [关键动作3] → [终点状态]

设计规范

  • 每个节点用卡片呈现
  • 节点间用箭头连接
  • 起点和终点用不同颜色区分
  • 整体横向排列,支持响应式换行

Phase 3:模块拆解

根据方案类型,选择适用的模块组合:

模块适用场景输出内容
--------------------------
设计原型涉及物理/视觉交付物尺寸、材质、工艺、正反面设计稿
流程设计涉及多步骤操作流程图、负责方、时效、控制点
话术/脚本涉及人机交互分场景话术、触发条件、预期效果
执行排期涉及时间线按天/周排期、里程碑、决策阈值
成本测算涉及资源投入成本结构、ROI推导、敏感性分析
数据追踪涉及效果评估关键指标、追踪方式、分析维度

检验标准:每个模块的内容可以直接指导执行,不需要额外解释。


Phase 4:HTML结构化输出

Step 4.1:确定视觉风格

默认风格:咨询级客观冷静

元素规范
------------
主色调深海军蓝 (#1E3A5F)
辅助色青绿 (#2C5F5D)、琥珀 (#8B6914)、暗红 (#8B2635)
背景浅灰 (#F7F7F7) + 白色卡片
字体Noto Sans SC / 系统无衬线字体
排版扁平、直角、无阴影、留白充足
数据等宽数字、右对齐、千分位分隔

替代风格(根据方案类型可选):

  • 科技未来风:深色背景 + 霓虹蓝紫渐变
  • 温暖亲和风:暖色调 + 圆角 + 柔和阴影
  • 极简黑白风:纯黑白 + 大量留白

Step 4.2:页面结构

页面结构:
├── Header(项目标题 + 版本 + 日期 + 负责人)
├── Navigation Tabs(模块切换标签)
│   ├── Tab 1: 设计原型
│   ├── Tab 2: 流程设计
│   ├── Tab 3: 话术/脚本
│   ├── Tab 4: 执行排期
│   └── Tab 5: 成本测算
├── Tab Content(各模块详细内容)
│   ├── Logic Chain(逻辑推导链)
│   ├── Visual Preview(可视化预览)
│   ├── Detail Tables(详细表格)
│   └── Hypothesis Box(假设与决策阈值)
└── Print Button(打印/PDF导出)

Step 4.3:核心组件规范

Logic Chain(逻辑推导链)

背景:浅灰底色 + 左侧3px海军蓝边框
标题:"逻辑推导" + 12px大写字母间距
节点:等宽卡片,横向排列,箭头连接
终点:浅蓝底色,加粗

Hypothesis Box(假设框)

背景:浅蓝底色
边框:左侧3px海军蓝
标签:"核心假设" / "决策阈值" / "敏感性分析"
内容:12px正文,行高1.7

Derivation(推导过程)

背景:白色
行:label + value + operator + result
最后一行:加粗 + 上边框分隔
数字:等宽字体 + 千分位

Data Table(数据表格)

表头:浅灰底色 + 底部2px深灰边框
行:白色/浅灰交替
悬停:浅灰高亮
数字:右对齐 + 等宽
高亮:暗红色(负面)/ 青绿色(正面)

Timeline(时间线)

轴线:左侧1px浅灰竖线
节点:11px圆点,里程碑为海军蓝填充
内容:白色卡片 + 浅灰边框
日期:海军蓝 + 11px + 字间距

Step 4.4:交互功能

  • Tab切换:点击标签切换内容区域,带淡入动画
  • 打印/PDF导出:固定右下角按钮,调用window.print()
  • 响应式适配:1200px/768px/移动端断点

Phase 5:交付与验证

Step 6.1:质量检验清单

交付前逐项检查:

  • [ ] 需求解构完成?目标/受众/约束/假设已明确?
  • [ ] 逻辑推导链完整?Why → What → How 闭环?
  • [ ] 模块拆解到位?每个模块有可执行内容?
  • [ ] HTML结构正确?所有Tab可正常切换?
  • [ ] 视觉风格统一?配色/字体/间距一致?
  • [ ] 打印功能正常?PDF导出格式正确?
  • [ ] 响应式适配?移动端可读?

Step 6.2:文件命名规范

[方案主题关键词]_[交付类型]_[版本号].html

示例:
- 包裹卡引流方案_全链路推演_v1.0.html
- 新产品上市策略_执行推演_v2.1.html
- 会员体系升级_方案推演_v1.0.html

三、常见陷阱与避坑指南

陷阱表现后果修正
------------------------
逻辑链断裂模块之间没有推导关系,像拼凑的PPT决策者看不懂"为什么要这么做"Phase 2必须构建完整推导链
信息过载一个Tab塞入过多内容,没有层次用户找不到重点每个Tab只聚焦一个模块
风格不统一不同模块用不同配色/字体显得业余、不专业严格遵循Step 4.1视觉规范
结论先行推导链过长,决策者失去耐心方案被搁置每个模块先给结论再给推导
只有展示无推导直接给结论,没有推导过程无法说服决策者每个结论前必须有Logic Chain
时间线模糊写"第1周""第2周"没有具体日期执行者不知道今天该干什么必须按天排期,标注星期

四、场景适配指南

场景重点模块风格建议特殊处理
------------------------------------
产品营销方案设计原型 + 流程 + 话术 + 成本咨询级冷静
运营活动方案流程 + 排期 + 话术 + 数据追踪温暖亲和强调时间敏感性
战略咨询方案逻辑推导 + 成本 + 敏感性分析咨询级冷静强化MECE结构
技术实施方案流程 + 排期 + 数据追踪科技未来增加技术架构图
培训/教育方案话术 + 流程 + 排期温暖亲和增加互动环节设计

五、实战示例

示例背景

用户输入:"我们想做一个包裹卡引流方案,让消费者扫码加微信,然后送他们一个小工具让他们做实验,实验完把结果发给顾问,顾问再引导复购。"

Phase 1 执行记录

输入类型:构想/idea(只有片段思路)

提取要素

目标: 通过包裹卡实现私域引流并推动复购
受众: 已购买产品的消费者
约束条件: 预算有限,需控制小工具成本
核心假设: 消费者愿意做实验并分享结果
关键变量: 扫码率、实验完成率、复购率

Phase 2 执行记录

推导链

消费者已购买产品 → 需要验证产品效果 → 提供可量化实验方法 → 消除执行障碍(小工具) → 引导进入私域 → 实验结果驱动复购

Phase 3 执行记录

模块组合:设计原型 + 流程设计 + 话术/脚本 + 执行排期 + 成本测算

Phase 4 执行记录

HTML输出

  • 5个Tab:卡片设计 / 小工具套装 / 私域承接SOP / 执行排期 / 成本与ROI
  • 视觉风格:咨询级冷静(海军蓝主色调)
  • 核心组件:Logic Chain、Hypothesis Box、Derivation、Timeline、Data Table

交付物

文件:包裹卡引流方案_全链路推演_v1.0.html

六、执行原则

  1. 推导优先:宁可多花时间在Phase 2的逻辑推导,也不要匆忙进入HTML制作
  2. 模块化思维:每个Tab是一个独立模块,模块之间用Logic Chain连接
  3. 数据驱动:所有结论必须有数据支撑,所有数据必须可溯源
  4. 假设显性化:把隐藏假设写出来,让决策者知道风险在哪里
  5. 闭环交付:方案+推演+排期+成本,四者缺一不可
  6. 结论先行:每个模块先展示核心结论,再展开推导过程

七、联系与反馈

📧 winson_dasein@163.com

如有合作交流意向,欢迎联系。

版本历史

共 1 个版本

  • v1.0.0 牛马专用 当前
    2026-06-10 12:11 安全 安全

安全检测

腾讯云安全 (Keen)

安全,无风险
查看报告

腾讯云安全 (Sanbu)

安全,无风险
查看报告

🔗 相关推荐

office-efficiency

Word / DOCX

ivangdavila
创建、检查和编辑 Microsoft Word 文档及 DOCX 文件,支持样式、编号、修订记录、表格、分节符及兼容性检查等功能。
★ 474 📥 157,027
office-efficiency

Gog

steipete
Google Workspace 命令行工具,支持 Gmail、日历、云端硬盘、通讯录、表格和文档。
★ 937 📥 187,622
data-analysis

winson-ai-pioneer-herald-skill

user_add7f3d3
报纸定位 AI先驱导报 — 以"AI as Dasein"为口号,意为"AI作为存在的方式"。 这不是一份消费互联网风格的"早报",而是一份结构克制、逻辑清晰、观点驱动的AI领域信息导报。采用铁幕·Iron设计系统: 零圆角:直线设计,
★ 0 📥 155