html-ppt-zhangzara-pin-and-paper

Pin & Paper

黄色纸张与安全别针插画、墨蓝色手写 Caveat 字体、纸张纹理。

一套独立完整的 HTML 幻灯片——字体、配色、装饰系统和幻灯片词汇都经过协调整合。混用不同模板的布局会破坏整体系统；请始终使用这一套。

概览

• 方案： 浅色
• 正式程度： 中等
• 信息密度： 中等
• 演示幻灯片数量： 11

适用场景

任何希望呈现手工质感、温暖而富有文学气息的内容：定性研究发现、创始人感想、品牌长篇故事、工作坊复盘。标志性的安全别针插画和纸张纹理，让它尤其适合任何希望展现个性与温度、而非精致感的幻灯片——包括科技或商业主题。

不适用场景

需要呈现数字原生的精致感或严谨数据驱动风格的幻灯片——手写 Caveat 字体有意采用了非正式风格。

工作流

1. 将 example.html 和 assets/ 文件夹克隆到用户的工作区。 此模板包含 assets/deck-stage.js 运行时（键盘导航、舞台渲染）和 assets/styles.css 样式表。HTML 中引用的路径为 assets/deck-stage.js 和 assets/styles.css，因此这两个文件必须与克隆的 HTML 文件放在一起，否则这些路径在生成的成品中会返回 404， 导航和样式也会悄然失效。如果需要单个独立文件，也可以将 JS/CSS 内联到 HTML 中的 单个 <script>/<style> 块。
2. 将占位内容替换为用户的实际标题、正文、数字、姓名、日期和章节标签。替换图片占位内容时，请匹配现有尺寸。
3. 保留设计系统。 切勿替换字体、改变配色、重构布局网格或移除装饰元素（角括号、纸张纹理、几何图形、SVG 插画）。这些都是设计风格的一部分。
4. 通过复制布局调整幻灯片长度。 如果用户的内容多于演示稿所能容纳的内容，请复制布局最合适的现有幻灯片。如果内容较少，请从末尾删除幻灯片。更新页码标签。
5. **设计缺失的布局：**如果幻灯片需要模板中没有的布局，请使用相同的字体、配色、装饰元素、间距节奏和组件规则从头设计；切勿改用其他模板。
6. 保留原有的导航运行时。 如果幻灯片包含 assets/deck-stage.js 或内联键盘处理程序，请保持原样。

输出约定

在 <artifact> 标签之间输出：

<artifact identifier="zhangzara-pin-and-paper" type="text/html" title="Deck Title">
<!doctype html>
<html>...</html>
</artifact>

来源与许可

移植自上游采用 MIT 许可证的项目 zarazhangrui/beautiful-html-templates。

完整的上游 MIT 许可证文本（包括原始版权声明）随此技能一同提供，路径为 LICENSE；分发 example.html、 template.json 或任何移植的 assets/ 运行时副本时，必须同时附上该许可证。上游元数据快照见 template.json。