mcpField
H
html-ppt-retro-quarterly-review

html-ppt-retro-quarterly-review

github.com/nexu-io文档处理104.6k2.8k 次安装今天更新
代码仓库

关于 html-ppt-retro-quarterly-review

这项技能用于制作包含三张幻灯片的独立 HTML 季度回顾演示文稿。它指导使用所提供的模板进行调整，同时保留视觉风格、交互和信息结构。

主要功能

  1. 01三页季度回顾模板
  2. 02复古蓝、橙、奶油色风格
  3. 03键盘切页与重启
  4. 04场景指示器和动画转场
  5. 05单文件 HTML 输出

适用场景

  1. 01展示季度重点
  2. 02呈现路线图和 KPI 栏
  3. 03按 DESIGN.md 令牌调整回顾稿

安装

复制下面的命令，在终端中运行。

$npx skills add https://github.com/nexu-io/open-design --skill html-ppt-retro-quarterly-review

安装后在 Claude Code 中输入/html-ppt-retro-quarterly-review确认已加载。

包含的文件

除 SKILL.md 外，安装时一起下载的参考资料和脚本。

example.html
assets/
template.html
references/
checklist.md

详细介绍

复古风季度回顾模板

一款高对比度、受印刷风格启发的季度回顾模板，包含三张电影感幻灯片：

  1. 封面（主视觉标题组合）
  2. 三项优先事项（三栏网格）
  3. 路线图时间线 + KPI 指标栏

资源映射

html-ppt-retro-quarterly-review/
├── SKILL.md
├── assets/
│   └── template.html
├── references/
│   └── checklist.md
└── example.html

工作流

  1. 首先阅读当前生效的 DESIGN.md，并将任何请求的设计令牌更改映射到 CSS 变量，同时保留复古蓝色／橙色／奶油色的视觉风格。
  2. 从 assets/template.html 开始；不要从头重建。
  3. 保留三张幻灯片的信息架构和字体层级。
  4. 保持交互与动效质量：
    • 使用键盘 1/2/3 快速跳转
    • R 重新开始
    • 页面指示器随场景更新
    • 高级感擦除转场与交错渐显效果
  5. 保持输出自包含（单个 HTML，内联 CSS + JS，无框架运行时）。
  6. 如果调整文案／数据，请确保内容真实且前后一致。
  7. 输出成品前，根据 references/checklist.md 进行验证。

输出约定

先输出一句简短的使用说明，然后输出成品：

<artifact identifier="retro-quarterly-review" type="text/html" title="Retro Quarterly Review">
<!doctype html>
<html>...</html>
</artifact>

评论

支持 Markdown