前端与 UI

Hallmark

反平庸的设计流程,58 道闸门,强制结构多样。

这是什么

一个给 AI 编程助手用的设计 Skill,一条默认构建流程加三个动作:审查、改版、研究。它逼出结构多样性,两次构建不会共用同一套页面节奏。

Anti-AI-slop design skill for greenfield pages, audits, redesigns, and design extraction from URLs or screenshots. Use when the user asks to build a new app or landing page, wants to redesign something, invokes Hallmark
来自上游 SKILL.md

它对设计意味着什么

  • 多样化规则逼着连续几次构建换不同的大结构、导航和页脚。
  • 锁定的 token 禁止绕过 token 区去写内联色值或 font-family。
  • 每次产出都在 320、375、414、768 像素宽度下校验。

包含哪些内容

  • How to use this skill
  • Disciplines that hold across every verb
  • When the brief is a component, not a page
  • Design flow (default)
  • Hallmark study
  • Output contract and scope

如何安装

Hallmark

  1. 克隆这个仓库。

    git clone https://github.com/Nutlope/hallmark
  2. 把 Codex 指向这个 Skill 文件。

    skills/hallmark/SKILL.md
  3. 然后描述你想要的界面,Codex 会照着这个 Skill 来做。

如何配合 Codex 使用

  1. 先让起飞前扫描读一遍现有的字体、配色和动效库。

  2. 回答受众、场景和调性这道闸门,或者直接说「继续」。

  3. 对页面跑 hallmark audit,拿到一份排好序的问题清单,不改动代码。

这里的每个插件都免费开源,并附上真实的上游源地址。

在 codex-design 清单上了解更多 ↗

下一步

用 Open Design 做设计,省掉那些配置

你可以自己装这个插件,也可以用 Open Design 在 Codex 外面套一整层精选设计层。自带 API Key,产出归你所有。