产品方向 · 内部讲述

HTML 作为内容载体—— 不受限于工具,基于内容选择最佳形态

过去要N 种工具·如今一种形态

它不是"更好看的文档",而是让信息第一次获得了与自己匹配的载体。 方案撰写、汇报演示、数据加工、流程梳理、信息收集 —— 过去每一件都被一种工具圈住,也被那种工具的格式所限。 HTML 不挑场景:用同一种介质,为每一段内容挑出最贴切的表达形式

方案撰写Word
汇报演示PPT
数据加工BI
流程梳理流程图
信息收集问卷
向下,开始讲
01  —  它到底是什么

HTML 的特征

传统格式是"先选工具、再填内容";HTML 反过来——内容决定形态。 特征如下:

A

善于呈现

优势
01
表达形式服务于内容本身——根据内容选最恰当的呈现:活动图、流程图、雷达图……可以是静态的,也可以动起来。
02
可交互,读者能参与进来——传统的文档是线性的、只能被动读,还能折叠、点击、切换着看自己关心的部分。
B

构建困难

短板
01
用户难以介入编辑——不像文档,想改哪儿直接改就好。
02
不实时、非所见即所得——哪怕只改一个字,每次都要走一趟 AI 回路。
C

不稳定

风险
01
难以保证一致性——同样的内容,AI 每次生成的结果都可能不一样。
02
处处给你"惊喜"——配色、排版、布局都可能跟上一次对不上。

把优势发挥出来,把短板补上,把下限守住 —— 接下来要做的,就是这三件事。

02  —  我们要做什么

三个核心方向

两条管生产质量(守下限、拔上限),重点打磨编辑体验。

守住下限

对 AI 施加视觉约束,让生成的 HTML 即使"发挥不好"也不丑。
01
建立最底层的约束:通用视觉风格规则——不滥用渐变、不滥用 Emoji、不花哨。
02
提供模板:给用户视觉参考,让人对结果有预期。
03
强调延续:每一次设计都在已有基础上生长,不打破已成型的风格。

拔高上限

不是换个好看的皮肤,而是让 AI 基于内容理解去选择最合适的呈现形式。

同一段内容,能长成图表、时间轴、流程图、对比矩阵、可交互界面——内容本身在挑它最贴切的形态。

按内容的类型特征,看它该长成什么形态 ↓

数字别躺在句子里。让它长出趋势和量级对比,一眼看懂大小。
季度营收走势 · 示意
Q1Q2Q3Q4Q5Q6
主营业务 45%
增值服务 25%
生态合作 18%
其他 12%
155
出生·谯县
184
讨黄巾
196
挟天子
200
官渡之战
208
赤壁之战
220
病逝·洛阳
需求 设计 评审 上线
总目录
概览
方向
链路
官渡之战 · 布局示意
黄河
袁绍军约 11 万
曹操军约 2 万
乌巢袁军粮屯
奇袭乌巢
方案 A备选
方案 B胜出
实时预览设置
开启所见即所得编辑
// 直接点点看 —— 这就是"能交互"

提升编辑体验

缩短反馈回路,让人能高效介入,而不是每个改动都甩给 AI 重来。

能实时就实时

核心是所见即所得——改字、加粗、调色直接生效,不走 AI 回路。

说话费劲的,给直接操作

调字号、删文字、拖图大小——口述费劲,鼠标点两下就好,给到可视化工具。

做好编辑工具,帮传达上下文

批注、圈选、箭头——让用户精准告诉 AI:改哪里、要什么。

03  —  生产之后

后续链路上的其余功能点

前面三个方向解决"做出来"。做完了,"给别人看、看得舒服、管得住"——还有这些能力要补。

01

分发与部署

HTML 产物怎么交到别人手里——一键部署、可分享链接、访问权限控制。

02

多端适配

手机、平板上能正常阅读,响应式不能靠 AI 碰运气,要有保障。

03

多版本对比

AI 出多套方案时,支持并排对比、择优选择。

04

模板体系

让用户对视觉风格有预期,类似 PPT 选模板那样的确定性。

05

历史管理长期

编辑历史、版本回溯,改了什么一目了然。

06

多人协作长期

多人同时编辑同一份内容,评论、分工与冲突合并都顺畅。

04  —  收尾

讲完思路,
直接看东西。

现场演示 Demo,覆盖关键场景的端到端体验。

进入 Demo
本页本身,就是一次"内容决定形态"