mcpField
H
html-ppt-zhangzara-creative-mode

html-ppt-zhangzara-creative-mode

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

关于 html-ppt-zhangzara-creative-mode

用于制作富有表现力的 HTML 演示文稿的技能,采用奶油色画布、多种浓郁点缀色和 Archivo Black 标题字体。它帮助在创意评审以及部分技术或商业演讲中沿用统一模板。

主要功能

  1. 01奶油色画布与多色点缀
  2. 02Archivo Black 标题字体
  3. 03装饰性幻灯片系统
  4. 04复制版式调整文稿长度
  5. 05保留键盘导航运行时

适用场景

  1. 01创意机构提案
  2. 02品牌与艺术指导评审
  3. 03设计工作室演示
  4. 04采用表现力风格的技术演讲或财务评审

安装

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

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

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

包含的文件

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

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

详细介绍

创意模式

奶油色纸张画布,搭配醒目的多色(绿色、粉色、橙色、黄色)点缀和 Archivo Black 展示字体。

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

概览

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

适用场景

任何需要展现设计感和自信气质的场合:创意机构提案、设计工作室幻灯片、广告公司资质介绍、品牌创意评审、艺术指导评审。当演讲者希望以品味而非惯例作为主导时,它也是技术演讲、研究成果或财务评审的绝佳意外之选。

不适用场景

需要体现机构的克制与沉稳权威感的场合——高饱和度的多色点缀会显得富于表现力,而非正式。

工作流

  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-creative-mode" 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