mcpField
H
html-ppt-zhangzara-peoples-platform

html-ppt-zhangzara-peoples-platform

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

关于 html-ppt-zhangzara-peoples-platform

以行动主义海报风格为核心的 HTML 演示文稿技能,采用奶油底色搭配蓝、橙、红。它提供统一的幻灯片系统,并指导如何调整内容与篇幅,适合表达鲜明的演示。

主要功能

  1. 01蓝、橙、红配色
  2. 02Alfa Slab 与 Caveat Brush 字体
  3. 03可复用的 HTML 幻灯片布局
  4. 04键盘导航运行时
  5. 05演示文稿篇幅调整指南

适用场景

  1. 01公民与社区主题演示
  2. 02竞选与使命提案
  3. 03文化评论与设计演讲

安装

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

$npx skills add https://github.com/nexu-io/open-design --skill html-ppt-zhangzara-peoples-platform

安装后在 Claude Code 中输入/html-ppt-zhangzara-peoples-platform确认已加载。

包含的文件

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

example.html
LICENSE
template.json
assets/
deck-stage.js

详细介绍

人民平台(方块与粗体)

活力四射的行动主义海报风:奶油色底上搭配蓝色、橙色和红色,使用 Alfa Slab + Caveat Brush。

这是一个完全自包含的 HTML 幻灯片稿——字体、配色、装饰系统和幻灯片语汇都经过统一调校。混用不同模板的布局会破坏这一系统;请始终使用本模板。

一览

  • 配色方案: 浅色
  • 正式程度: 中低
  • 信息密度: 中高
  • 演示中的幻灯片数: 10

适用场景

任何需要显得真诚、有力且富有视觉表现力的场景:文化评论、宣言、公民与社区演示文稿、设计演讲、竞选提案。非常适合展现创始人愿景、阐述使命,或任何希望呈现抗议海报气质而非企业精致感的演示文稿——无论行业。

不适用场景

以克制、稳重的机构风格为实际目标的场景——饱和的政治海报配色会坚定地呈现鲜明的表达能量。

工作流

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

输出要求

在 <artifact> 标签之间输出:

<artifact identifier="zhangzara-peoples-platform" 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。

评论

支持 Markdown