免费在 GitHub 公开中文介绍

html-ppt-zhangzara-raw-grid

将音乐节海报系列从概念、视觉规则到不同媒介的应用整理为HTML幻灯片，以粗边框和偏移阴影构成统一风格，用于案例展示与提案。

原文查看原文说明

A brutalist poster-series case study for a music festival — the concept, the system, and how it scaled across formats. Built as a decision-grade design craft deck for design peers, client.

nexu-io/open-design

AI 评分100分/ 100 查看安装方法

适用场景

展示音乐节海报设计案例
说明品牌视觉规则与媒介应用
制作视觉风格鲜明的作品集
将数据、比较与制作流程制成幻灯片

中文介绍

功能

制作介绍音乐节海报系列的HTML幻灯片，说明概念、视觉表达规则，以及如何应用到不同媒介。采用粗边框和偏移阴影的新粗野主义风格，统一使用粉色、鼠尾草绿和墨色。整理大纲、幻灯片正文与视觉方向，并从设计角度进行审视。

适用场景

适合向设计同行或客户介绍制作案例，也可用于品牌提案和视觉风格鲜明的作品集。支持数据展示、比较表和制作流程说明。演示样例共十页，可通过复制现有布局或删除页面调整长度。

使用示例

“把音乐节海报的设计案例做成面向客户的HTML幻灯片。”
“为这份品牌材料安排结构，加入比较表和制作流程。”

注意事项

本介绍由 AI（OpenAI Codex）根据公开的 SKILL.md 撰写。准确的规格请查看下方原文。

客观评估

AI 仅根据 SKILL.md 的内容，从 4 个方面进行了评估。星标数和热度不计入评估。

指令清晰度能否看出何时使用、做什么: A良好明确说明音乐节海报案例的用途、受众和必须保留的视觉风格。
步骤具体性步骤、输入输出和示例是否具体: A良好规定复制example.html、替换内容、调整页数及HTML输出格式。
安全性发送数据、删除文件、执行命令等是否有说明: A良好操作范围为工作区内的HTML，删除仅涉及幻灯片，并指定需保留的结构。
安装难易度所需工具和 API 密钥是否少且有说明: A良好复制自包含的example.html即可开始，未指定API密钥或付费服务。

总分按每项 A=25 分、B=15 分、C=5 分相加。由 AI（OpenAI Codex）于 2026年10月20日评估。仅供参考，安装前请同时查看原文。

如果您认为评估有误，请申请复核

包含的文件（4）

SKILL.md4.8 KB
example.html32.5 KB
LICENSE1.0 KB
template.json1.7 KB

SKILL.md（原文）

安装前可以查看交给 AI 代理的指令内容。

Raw Grid

Neo-brutalist deck with thick borders, offset shadows, and a pink/sage/ink palette.

A single self-contained HTML deck — typography, palette, decorative system, and slide vocabulary are all tuned together. Mixing layouts across templates breaks the system; stay inside this one.

At a glance

Scheme: light
Formality: medium-low
Density: high
Slides in demo: 10

Best for

Anything that should feel direct and graphic-confident: founder pitches, accelerator demos, brand decks, indie launches, creator portfolios. Strong for stat slides, comparison tables, and process flows. Equally good for tech, research, or finance when the speaker wants the deck to feel scrappy-confident rather than buttoned-up.

Avoid for

Contexts that need to feel soft, warm, or intentionally quiet — the brutalist borders and offset shadows commit to a graphic voice.

Workflow

Clone example.html into the user's workspace as the working file.
Replace placeholder content with the user's real headlines, body copy, numbers, names, dates, and section labels. Match existing dimensions when swapping image placeholders.
Preserve the design system. Never substitute fonts, recolor the palette, restructure the layout grid, or strip decorative elements (corner brackets, paper grain, geometric shapes, illustrated SVGs). They are part of the identity.
Adjust deck length by duplicating layouts. If the user has more content than the demo holds, duplicate an existing slide of the most appropriate layout. If less, drop slides from the bottom. Update page-number labels.
Designing missing layouts: if a slide needs a layout the template doesn't have, design it from scratch using the same fonts, palette, decorative vocabulary, spacing rhythm, and component grammar — never bail to a different template.
Keep the navigation runtime as shipped. If the deck ships an assets/deck-stage.js or inline keyboard handler, leave it intact.

Output contract

Emit between <artifact> tags:

<artifact identifier="zhangzara-raw-grid" type="text/html" title="Deck Title">
<!doctype html>
<html>...</html>
</artifact>

Source & license

Vendored from upstream MIT-licensed zarazhangrui/beautiful-html-templates.

The full upstream MIT license text — including the original copyright notice — ships in this skill at LICENSE and must be redistributed alongside any copy of example.html, template.json, or any vendored assets/ runtime. See template.json for the upstream metadata snapshot.

评价

还没有评价。欢迎分享你的使用感受。

无需登录即可发表。欢迎分享使用感受、提问，或说明在哪些环境下无法运行。

还没有评论。来写第一条吧。

同一仓库的技能