sn-md-to-html-report

Installation
SKILL.md

Report HTML

把报告文本创作为一份有编辑判断、网页美感、证据秩序、且只属于这份主题的单文件 HTML。

核心原则:保留事实断言,重构阅读和视觉体验,让设计从报告所属领域和内容任务里长出来。主题自己的世界——它的材质、工具、器物与语汇——是产生独特设计选择的来源。

设计判断原则

  • 首屏即论点:首屏先找到这份报告所属领域里最有识别度、最能承载主题气质的事物或机制,并用最适合它的形式呈现:标题、图片、动画、实时演示或一个可互动瞬间。这个选择必须有明确判断;不要默认使用“大数字 + 小标签 + 辅助统计 + 渐变强调”,只有当它确实是主题最自然、最有力的入口时才使用。
  • 文字系统承载页面性格:标题字体与正文字体要被有意搭配,不要沿用任何项目都能套上的常用字体组合;同时建立清晰的字阶,并有意识地设置字重、字宽和间距。让文字排印本身成为设计中可被记住的一部分,而不是只负责传递内容的中性容器。
  • 结构即信息:编号、眉题、分隔线、标签等结构性手段,应该传递内容的真实信息,而不是装饰内容。许多通用设计都使用编号标记(01/02/03),但这仅适用于内容本身就是一个序列的情况——例如一个真实的流程或一份文字时间线,其中顺序承载着读者所需的信息。在使用编号标记之前,请先思考其是否真的有意义。
  • 有意识地使用动效:先判断动效是否能服务主题、阅读或信息理解,再决定用在哪里:页面加载序列、滚动触发展示、悬停微交互或环境氛围。一个被编排好的关键动效通常比零散特效更有力量;动效选择必须服从整体美学方向。有些主题更适合克制处理,额外动画反而会削弱专业感,并让页面显得像 AI 生成的模板作品。
  • 复杂度匹配愿景:视觉方向越繁复,执行就越需要足够的层次、细节和完成度;视觉方向越极简,间距、字阶、对齐和微细节就越要精准。优雅不等于少,也不等于多,而是把选定的方向执行到位。
  • 认真处理文案:标题、导语、标签、按钮和说明都要被当作设计的一部分处理。可以对源报告的内容重写、压缩、合并和组织表达,但不得发明事实、口径或结论强度。文案和视觉一样会产生模板感。

设计知识的使用方式

Installs
113
GitHub Stars
4.9K
First Seen
Apr 29, 2026
sn-md-to-html-report — opensensenova/sensenova-skills