Back to Details

html-ppt-retro-quarterly-review

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

Retro Quarterly Review Template

复古季度回顾模板

A high-contrast, print-inspired quarterly review template with three cinematic slides:
  1. Cover (hero title lockup)
  2. Three priorities (triptych grid)
  3. Roadmap timeline + KPI strip
这是一个高对比度、印刷风格的季度回顾模板，包含3张具有电影质感的幻灯片：
  1. 封面（主标题布局）
  2. 三项优先事项（三联网格）
  3. 路线图时间线 + KPI栏

Resource map

资源结构

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

Workflow

工作流程

  1. Read active 
    DESIGN.md
    first and map any requested token changes into CSS variables while preserving the retro blue/orange/cream visual grammar.
  2. Start from 
    assets/template.html
    ; do not rebuild from scratch.
  3. Preserve the three-slide information architecture and typographic hierarchy.
  4. Keep interactions and motion quality:
    • keyboard 
      1/2/3
      quick jump
    • R
      restart
    • page indicator updates per scene
    • premium wipe transitions and staggered reveals
  5. Keep output self-contained (single HTML, inline CSS + JS, no framework runtime).
  6. If adapting copy/data, keep content realistic and internally consistent.
  7. Validate against 
    references/checklist.md
    before emitting artifact.
  1. 首先阅读当前的
    DESIGN.md
    ，将任何要求的标识变更映射为CSS变量，同时保留复古蓝/橙/米白的视觉风格。
  2. 从
    assets/template.html
    开始制作；不要从头重建。
  3. 保留3张幻灯片的信息架构和排版层级。
  4. 保持交互和动态效果质量：
    • 键盘
      1/2/3
      快速跳转
    • R
      键重启
    • 页面指示器随场景更新
    • 高级擦除过渡和错落式展示效果
  5. 保持输出文件独立（单个HTML文件，内联CSS + JS，无框架运行时）。
  6. 如果调整文案/数据，确保内容真实且内部一致。
  7. 在生成成品前，对照
    references/checklist.md
    进行验证。

Output contract

输出规范

Emit one short orientation sentence and then the artifact:
xml
<artifact identifier="retro-quarterly-review" type="text/html" title="Retro Quarterly Review">
<!doctype html>
<html>...</html>
</artifact>
先输出一句简短的说明语句，然后生成成品：
xml
<artifact identifier="retro-quarterly-review" type="text/html" title="Retro Quarterly Review">
<!doctype html>
<html>...</html>
</artifact>