设计技能 · Hallmark v2

不是设计师，把博客设计交给 AI 之后，好到旧版都显得丢人

给 Claude Code、Codex 这类编程 AI 装上 Hallmark，再让它做一个落地页，AI 会先问页面给谁看、想让访客点什么，然后选好主题再动手。做完的页面会在真实浏览器里打开，找出一眼就是 AI 做的地方并改掉。韩国时间10月23日，从头重做的 v2 正式发布。已有的页面也可以保留链接和输入框不动重新设计，或者只做一次检查。我们收集了把自己网站交给它的人的案例。

2026年10月26日·3 个案例

Nutlope/hallmark README（AI 味清单、v2 的48个主题和755张照片、redesign 安全机制）

Hallmark 官网 — 开发方演示（Five Mile Gin）、挑选三个主题与真实浏览器检查的说明, 2026-10-22

Hassan — We rebuilt Hallmark from scratch（v2 发布）, 2026-10-22 UTC（截至10月26日浏览148,729、收藏3,395）

韩国时间10月23日凌晨（UTC 10月22日），设计技能 Hallmark 的开发者、Together AI 的 Hassan 在 X 上写下"We rebuilt Hallmark from scratch."（我们把 Hallmark 从头重做了一遍），宣布推出 v2。v2 的发布帖四天内获得14.8万次浏览、3,395次收藏。5月发布的 v1 上线帖，截至10月26日的五个月里，浏览量超过89万次，收藏超过1万次。

慕尼黑一家汽车数据公司的 CTO Brian Porter 坦言自己不是设计师。7月，Brian 用 v1 重新设计了自己的博客，并写道："What came out was so much better it made the old version look embarrassing."（做出来的效果好太多，好到旧版都显得丢人。）

Hallmark 把这些列为“AI 味”的标志：每个标题上方都有的小标签、标题里只把一个词换成别的颜色、每个页面末尾都有的邮件订阅框，以及什么都不提交、只说一声谢谢的表单。

从开发方的演示来看，AI 不会马上动手，而是先提问。输入一行"/hallmark a site for Five Mile Gin, a small distillery that forages its botanicals"（为一家亲自采集植物原料的小型蒸馏厂 Five Mile Gin 做个网站）后，AI 先问的是"Any photos of the still?"（有蒸馏器的照片吗？）、"Who buys a bottle?"（谁会买一瓶？）、"The one thing to click?"（最想让人点的那一个是什么？）。

这个技能由 Together AI 免费公开，v2 内置48个主题和755张开放许可的照片。据开发方介绍，Hallmark 会挑出三个符合需求的主题，并在真实浏览器里用八种屏幕宽度检查做好的页面。重新设计已有页面时，它会先记下链接、输入框和标题，只要少了任何一个就判定为失败。

Reference 01慕尼黑汽车数据公司 CTO Brian Porter · 个人博客（7月，v1）

从四个设计方向里选定一个，AI 就自己截图检查桌面端和移动端，把整个博客重做了一遍

在此之前，Brian 的博客是先用 Google Stitch 搭版式、再用 Claude Design 打磨出来的。Brian 把 Hallmark 装成 Claude Code 技能，请它重新设计博客和主页，AI 先确认范围："just the blog, or everything?"（只改博客，还是全部？）接着给出四个风格各异的设计方向。Brian 选定一个后，它又让 Brian 在这个方向里再挑一轮变体，比如要不要加深色模式。

之后就全交给 AI 了。它自己操作浏览器，截下桌面端和移动端的画面，一边检查自己的成果一边修改，持续了40多分钟。Brian 写道："It doesn't just hand me pixels. It does the part I'd skip."（它不只是把画面丢给我，连我会跳过的那部分也做了。）

poornerd 旧设计的 About 页面。浅灰色背景上写着“Technologist. Entrepreneur. Programmer.” — 旧设计的 About 页面，用 Google Stitch 和 Claude Design 做成。

用 Hallmark 重新设计的 poornerd 首页。胶囊形顶栏和深色模式按钮、“poornerd”标题、“Read journal”按钮和文章卡片 — 用 Hallmark 重新设计的首页。顶栏右侧是深色模式按钮。

Reference 02运营 AI 应用课程和会员社群的日本讲师ウミノ · X（6月，v1）

只说了句“重新设计我的网站”，AI 就看出网站的目的，把免费课程入口放上了首屏

ウミノ在 Codex 里装上 Hallmark，对自己的官网运行了重新设计（redesign）命令。看到结果后写道："「メルマガの無料講座に登録してもらう」という一番の目的を、サイトの構成からAIが自動的に汲み取ってくれたんです。"（AI 从网站结构里自己读出了我最主要的目的：让人报名邮件杂志的免费课程。）首屏从大字摆放宣传语的布局，变成了直接通向免费课程报名的布局。ウミノ说："一番クリックしてほしいものがファーストビューに入って、かつクリックするとちゃんとそこに飛ぶのが嬉しい。"（最想让人点的东西进了首屏，而且一点就能准确跳过去，这点很开心。）

让它检查（audit）同一个网站后，得到了一份报告。结论是："結論として、見た目と導線はかなり良い状態です。"（结论是，外观和用户动线都相当不错。）下面列了几条意见：首屏是 iframe 结构，滚动略不稳定（P1）；报名链接没有直接写在 HTML 里，而是之后用 JS 加上的（P2）；index.html 约 6MB，偏重（P2）。最后一行是要优先修的两件事："優先して直すなら、次は iframeのスクロール問題とリンクのhref直書き化です。"（如果按优先级修，接下来是 iframe 的滚动问题，以及把链接的 href 直接写进 HTML。）

文末附有ウミノ自己课程的链接。

ウミノ网站原来的首屏。白色背景上大字写着“AIを相棒にして、仕事・発信・商品づくりを、前に進める。” — 重新设计前的首屏。

新首屏。深绿色背景上写着“AIで、今日の仕事をひとつ軽くする。”，下面是三张免费课程卡片，卡片周围有红框和“ここが追加”标注 — 用 Hallmark 重新设计后的首屏。红框和“ここが追加”（这里是新增的）是ウミノ自己标注的。

Reference 03罗马尼亚软件工程师 Mihai-Cristian Farcaș · X（10月24日，v2）

Hallmark 新版（v2）发布才两天，一款学习应用的书库、复习卡片和概念图谱就换上了统一的新设计

v2 发布两天后，Mihai 用 Hallmark v2 重新设计了自己学习平台的界面，并发布了效果视频。视频开头是奶油色背景上用衬线字体写的"Good afternoon."问候语和"Ask your library anything…"输入框，还有正在读的书的进度和复习卡片。接着依次闪过摆着书封的书库（Library）、笔记（Notes），以及把概念互相连起来的图谱（Brain）界面。

Mihai 写道："I used @nutlope 's Hallmark v2 skill to redesign my learning platform and I'm pretty impressed! Smooth transitions, clean animations, mindful of the layout."（我用 @nutlope 的 Hallmark v2 技能重新设计了自己的学习平台，效果相当惊艳！转场流畅，动画干净，布局也很用心。）

大家怎么说

好评

“the only one that didn't make up stats or testimonials: every number is labelled "sample data".”
唯一一个没有编造数据或用户评价的：每个数字都标着“示例数据”。
这篇文章给8个热门设计技能下达同样的落地页需求，把结果并排比较（10月，基于 v1）。
Paralect · 开发公司的设计技能对比文章paralect.com
“Every page without the skill had the tell; half the pages with it did not.”
不用技能做的页面全都有这个破绽；用了技能的页面有一半没有。
亲自统计了页面是否使用纯黑、纯白：不用技能时40个里有40个，用了技能后28个里有14个（9月，v1，claude-haiku-4-5）。
ktlesr · GitHubgithub.com
“Hallmark by nutlope for UI its a deductiv list and forces AI to make anti slop UI instead of forcing a pattern that quickly becomes recognisable(an issue i spotted with impeccable and others).”
UI 方面推荐 nutlope 的 Hallmark。它是一份做减法的清单，逼 AI 做出没有 AI 味的 UI，而不是强加一种很快就会被认出来的套路（我在 impeccable 等工具上发现过这个问题）。
v2 发布之前（10月16日）的评论。impeccable 是另一个设计技能。
u/General_Cap_6316 · Reddit r/ClaudeAIreddit.com
“Nice skill, much needed these days; I know I'm not the only one that yearns for variety, even in our internal tool pages.”
不错的技能，现在正需要。我知道渴望多样性的不止我一个，哪怕是内部工具页面。
v1 介绍帖下的评论。
mondainx · Hacker Newsnews.ycombinator.com
“Impeccable and https://www.usehallmark.com/ works well for me.”
Impeccable 和 https://www.usehallmark.com/ 对我来说很好用。
v2 发布三天后的帖子。
Thet Hmuu · Xx.com

不足之处

“12 of the 40 attempts with the skill ended without building anything”
用了技能的40次尝试里，有12次什么都没做出来就结束了
写到即使需求里已经给出了答案，它还是一直提问，然后就停下了（9月，v1，claude-haiku-4-5）。
ktlesr · GitHubgithub.com
“The catch: cream, a serif and one accented word is close to the default frontend-design bans.”
问题在于：奶油色、衬线字体加一个强调词，和默认 frontend-design 明令禁止的东西很接近。
同一篇对比文章里对 Hallmark 成果的评价（10月，基于 v1）。frontend-design 是 Anthropic 公开的默认设计技能。
Paralect · 开发公司的设计技能对比文章paralect.com
“Has anyone got this or impeccable or any other to actually work? For me it still pretty much looks like slop.”
有人真的把这个、impeccable 或者别的什么用好过吗？在我看来还是一股 AI 味（slop）。
v1 介绍帖下的评论。评论者接着说，最后还是得不停下指令、反复修改。
aleksiy123 · Hacker Newsnews.ycombinator.com
“Loving the collage of screenshots where every one screams of being AI generated”
真爱这组截图拼贴，每一张都在大喊“我是 AI 生成的”
讽刺 v1 README 里的示例截图合集。示例中只认可 Cold Snap 和 Mend Assembly 两个。
loopmonster · Hacker Newsnews.ycombinator.com

怎么开始

把下面的提示词粘贴到 Claude Code、Codex、Cursor、OpenCode 等编程智能体里就行。免费，也不需要 API key。如果要做浏览器检查，电脑上需要装有 Chrome，智能体可能会请求你允许安装 puppeteer-core。

起步提示词
我想试试 Hallmark 这个设计技能。请参考这篇文章：https://www.working-ref.com/zh/reference/hallmark-v2-2026-10 如果还没装，用 npx skills add nutlope/hallmark -g 安装。然后根据我的兴趣和当前这个项目，提出三个可以用 Hallmark 做的事（例如：只检查现有页面、保留链接和输入框不变重新设计、做一个新的落地页）。我选一个你就直接开始；如果都不合适，就先检查（audit）这个项目里的页面。

分享此参考

每周一期 · 免费

这篇参考对你有帮助吗？

每周海量 AI 资讯里的 BEST
只挑 3 条，直接送到你的邮箱

Work Smarter with AI

订阅成功下一期起，我们在你的邮箱见。