mcpField
H
html-ppt-zhangzara-retro-zine

html-ppt-zhangzara-retro-zine

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

关于 html-ppt-zhangzara-retro-zine

Retro Zine 是用于制作自包含 HTML 幻灯片的技能,采用手工感的 risograph 印刷风格。它指导使用者基于模板设计系统调整内容,适用于出版、艺术及其他适合低保真视觉风格的演示。

主要功能

  1. 01自包含 HTML 幻灯片模板
  2. 02米色纸张与绿色点缀
  3. 03Bebas Neue 和 Caveat 字体
  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-retro-zine

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

包含的文件

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

example.html
LICENSE
template.json

详细介绍

Retro Zine

米黄色纸张搭配绿色点缀,以及 Bebas Neue + Caveat:以 HTML 形式呈现的孔版印刷风小志。

一套独立完整的 HTML 幻灯片,其中的字体、配色、装饰体系和页面表达方式都经过整体调校。混用不同模板的版式会破坏这套系统;请始终遵循本模板。

概览

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

适用场景

任何需要呈现印刷感、低保真质感和手工制作感的场景:独立小志和出版物、音乐 / 艺术品牌、创作者作品集、小批量手工艺品发布、社区演示文稿。对于希望呈现孔版印刷的温暖感而非数字化精致感的科技、研究或商业演示文稿,它也是一个出人意料的好选择。

不适用场景

需要原生数字产品般精致感或现代科技感的场景——层叠的小志美学刻意营造了手工制作的感觉。

工作流

  1. 将 example.html 克隆到用户的工作区,作为工作文件。
  2. 将占位内容替换为用户的实际标题、正文、数字、名称、日期和章节标签。替换图片占位内容时,请保持现有尺寸。
  3. 保留设计系统。 不要替换字体、重新着色、重构布局网格或移除装饰元素(角括号、纸张纹理、几何形状、插画 SVG)。这些都是设计标识的一部分。
  4. 通过复制版式调整幻灯片数量。 如果用户的内容多于演示文稿可容纳的内容,请复制最适合的现有版式幻灯片。如果内容较少,请从底部删除幻灯片。更新页码标签。
  5. 设计缺失的版式: 如果幻灯片需要模板中没有的版式,请使用相同的字体、配色、装饰元素、间距节奏和组件语法从头设计;不要改用其他模板。
  6. 保持随附的导航运行时不变。 如果演示文稿随附 assets/deck-stage.js 或内联键盘处理程序,请保持原样。

输出约定

在 <artifact> 标签之间输出:

<artifact identifier="zhangzara-retro-zine" 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