珠宝杂志排版设计：让客户一眼看出高级感

接下来, 说一说它所化解的问题是什么, 个人要怎样去构建自身的排版体系, 还有 Skill 这一事项后续有可能以怎样的方式实现商业化。

01 PART 为什么要做排版？

为什么做排版，很简单，内容的 呈现形式，已经变了很多轮。

原本是纯文字形式, 接着发展成图文形式, 此后又出现了小红书、朋友圈、公众号头图, 开始渐变成为「图片是主要承载形式, 文字仅仅起到配合作用」, 而后进而演变成之后的短视频。

用户的注意力一直在被 更强的视觉形式训练。

纯文字当然能传达知识。但学习本身是一件 反人性的事情。

你致使一个人直面完全是黑色的一整屏正式文字。对此他得主动去调动起注意力, 主动去构筑起结构, 主动去判别出重点。

这对于读者而言要求实在是过高了。要是我们能够运用更为舒适的排版方式, 具备更为清晰的层级结构, 拥有更为优良的图文组织形式, 将AI新知识展现出来, 那么读者阅读起来就会轻松许多。

公众号尤其如此。

因而我们始终这么认为, 排版同样是内容的一部分, 于是跟小李达成一致, 将这个给做了, 而且还开源了！

我们期冀大家于吸纳 AI 新知识之际, 内容自身是清晰的, 形式亦是妥帖的。

让人 愿意读下去，这件事很重要。

02 PART 它解决什么问题？

很多人一听公众号排版，第一反应是：找个模板不就行了？

其实不够。

模板虽说能够处理一次性的样式方面的问题, 然而却无法应对每天都要进行文章撰写的工作流程方面的问题。

公众号排版最麻烦的地方，不在于你不知道哪个颜色好看。

摸鱼绿主题演示 GIF

而在于 每篇文章都要重新做一遍这些细节：

章节标题怎么编号，开头金句怎么做成引言卡

正文关键句怎么标下划线

图片, 以及 GIF, 要防止产生混乱, 代码块、Prompt、命令行, 如何将格式进行保留呢?

这些物件, 单个瞧的时候, 尺寸都不算大。把它们聚拢一处, 便构成了一篇文章在发布之前, 令人最为烦闷的那一小时。

gzh-design做的事很直接，利用 AI 的能力：

你给其一篇 Markdown, 其给你一份能够直接粘贴至微信公众号编辑器的 HTML。

注意，不是普通网页 HTML。

对于公众号编辑器, 想必大家都有所了解, 它是存在诸多问题的, 比如, style标签是不可以使用的, script同样不行, 就连外部字体这类事物也极易被过滤掉。

众多由AI生成的HTML, 于浏览器当中观看时显得挺不错, 然而一旦粘贴至公众号后台, 便会直接呈现出散架的状况。

所以 gzh-design 的目标是：

生成公众号能吃下去、粘进去不掉格式的正文片段。

所有样式内联。

— 示例文章排版，格式保持不变

你全选，复制，粘贴。

格式不掉。这才是它的核心价值。

03 PART 它现在长什么样

目前 gzh-design 里有 6 套精选主题。

说来实则一开始的时候, 我精心堆砌了 20 套模板, 然而最终却都统统被小李给无情否定掉了…（把 选择权还有自主性给予到用户）

因为排版这件事， 主题多不等于好用。

真正重要的是： 每一套都能稳定覆盖一类内容。

— 六套主题，按需选择

这六套中的每一套, 其背后都各自有着组件库, 有着色值，有着标题骨架, 有着正文标记方式, 有着引用块, 有着图片样式, 还有着文章类型配方。

AI 在按 组件库装配。这点很重要。

gzh-design 要先将主题明确清晰地写出来, 接着把组件详细具体地表述清楚, 然后把映射规则准确无误地呈现明白, 之后才让 Agent 依据这些规则去执行。

约束不是束缚。约束是输出下限。

04 PART 真正的核心：Theme Generator

然而, 实实在在地讲, gzh-design 最为值得去观看的, 不能够仅仅只是这6套主题。

真正的核心模块，是 Theme Generator。

简单说，它解决的问题是：

每一个人, 皆能够将自身的颜色, 比例, 审美偏好, 去生成一套专属的公众号排版风格。

你可以给它一句话：

prompt

比照「黑白杂志、克莱因蓝点睛、衬线字体」这般的气质, 去为公众号排版打造创建生成一套全新的主题。

跑完之后，直接给生成一套新主题。

— 关键在于组件化

也可以给它一张参考图：

prompt

按这张参考图，做一套公众号排版组件库。

它会先抽取你的 视觉偏好。

比如说, 像那主色, 还有背景色, 以及正文色, 再有强调色还有装饰色, 然后是字体倾向, 圆角, 阴影, 信息密度, 标题结构, 卡片形式, 分割方式。

然后生成一整页 Block 区块库预览。

— 留白禅意风

先让你来确认一下风格, 之后, 把它转变成标准主题库, 登记到那个theme-index.md里, 再去跑一遍component_lint.py。

从那以后，这套主题就和内置主题一样，可以 反复调用。

除了配色，关键是组件化。

一套主题不是一张封面图。

它起码得涵盖封面, 以及章节标题, 还有小标题, 再者正文段落, 另外引用块, 还有提示卡, 接着图片, 再是GIF, 跟着代码块, 之后表格, 而且FAQ, 还有作者信息, 最后结尾互动区。

它是在给一个账号做 一套排版系统。

— 红白风格

这件事对个人创作者有用，对 企业内容团队更有用。

Theme Generator 的价值就在这里：

将「审美偏好」转变为「主题变量」, 把「设计经验」转化为「组件库」, 把「品牌规范」化作「Agent 能够执行的规则」。

排版设计的组件化很重要！

例如, 每一段, 关键词下划线是需要给到的, 代码块做了自身的组件兼容, 命令行也做了自身的组件兼容。

图片、GIF、视频当然要支持。

但这里有一个现实限制要说清楚。

公众号平台针对图片自有相应机制, 因此假定文章之中打算放置真实图片, 那么图床问题就得自行去解决。

gzh - design 才不会一丁点儿缘由 也不依赖任何支撑 就平白无故地给自己弄活 帮你搞出一个能长时间持续使用着的公众号图床链接哟。

后续考虑做一层中转，然后复制的时候自动上传到公众号后台。

但它可以帮你先把 位置留好。

比如你在原文里写：

【插入：文章开头视频截图】

它会把这里转成一个 「待补素材」占位板块。

— 如图所示，留出占位板块

图片, 视频, GIF, 成果图, 均能够如此这般, 先预留接口。待嗣后你获取到素材之后, 再将其替换进去。

另有一点是源自藏师傅的Skills所学到的思路来做AI工作, 流最怕发生的一点事为看起来可跑, 然而实际上并不稳。

你不清楚它此次会不会发生遗漏的情况, 不晓得复制到公众号时格式会不会出现丢失的情况, 这般的不确定会致使人们不敢将工作交付给AI。

所以 gzh-design 里有 两道关。

第一道叫 源头关。

component_lint.py扫描组件库, 查看检不检查有关于平台禁用的写法, 看查有没有那种容易致使代码块出现大空白的white-space:pre, 审视有没有笨重的正文虚线框。

第二道叫 产物关。

运行validate_gzh_html.py, 扫描最终生成出来的HTML, 核查禁用标签、文字包裹以及半角标点等方面的问题。

组件库干净，产物再检查一次。这套循环不复杂。但很有用。

它将「我觉得没问题」这般表达, 转变成为 「脚本跑过没问题」这种表述 , 对于AI Agent而言 , 这一步骤极度关键。

因为 模型负责理解内容，脚本负责执行红线。

不能让模型猜测那种可以确定的事, 这同样是存在于Harness里的意思。

05 PART Skill 即产品，可商业化

Skill 这种东西， 本质上是一个产品。

既然是一个产品，就应该有一个系统。

— 项目目录结构

它是一个可以 被维护、被扩展、被验证的小系统。

这也是我们愿意把它开源的原因。

一个排版 Prompt，开源价值有限。

一个 可维护的排版 Skill，才有机会让更多人一起改。

写道此处, 我想要顺便谈及一个更为庞大的话题, Skill这个事物呢, 它是能够进行商业化操作的。

早前, 众人皆清楚Prompt能够用以商业化。于我身旁便有友人, 一条几百字的Prompt, 借助模型能力, 针对某个极为具体的业务场景予以解决, 可售得几万块钱。购买方所买的是: 此Prompt背后的场景理解、经验压缩、试错成本, 以及它究竟能否切实解决问题。

现在 Skill 的商业化逻辑，其实是类似的。

只是 载体升级了。

随着不一样的Agent平台, 还有Agent自身的能力, 以及模型的执行能力都在不断提升情况之下, 有一个问题会逐渐变得越发重要, 那就是:

你可不可以把自身的经验进行封装, 变为Skill, 朝着外部予以提供者, 并且使得别人能稳定地进行复用?

这件事 大有可为。

我也专门跟藏师傅聊过这件事。

一项共同得出的判断是, 只要你所拥有的Skill足够具备具体性, 并且切实能够解决用户相关的实际需求场景, 那么就必定会有一些人愿意前来开展合作。

虽说 Skill 在 AI 发展进程里或许仅仅是一种“中间状”, 然而就目前阶段而言, 各大厂商所采取的行动却表明了它具备的价值。

06 PART 这个 Skill 怎么用？

最简单的方式，是直接让你的 Agent 安装。

于设计此 skill 的进程之中, 着实考量了诸多因素, 尤为关键的一点便是, 适配于国内的 Agent, 以便于众人能得以便利地运用。

有一段在 README 里的「给 AI 的安装 prompt」, 把它复制粘贴给你的任意一个 AI Agent, 它就会自动去完成安装。

装好之后，对它说下面这句就会触发：

将要用摸鱼绿对这篇名为 article.md 的文章进行公众号排版, 这个操作的指令是 PROMPT。

— 比如我在 workbuddy 中，直接用藏师傅文章为例

若是你所给予的为Markdown, 那么效果最为稳定, 若为其他格式的话, 它也是会先前进行格式归一化之举, 然后方进入排版流程的。

然而, 我依旧提议在正式开展写作之时, 尽可能地选用 Markdown 来进行操作。针对此次所生成的这个页面, 在其右上角的位置, 我同样预备好了「一键复制」的那个按钮, 诸位只要将其点开继而径直前往公众号的后台去实施编辑便可。

操作路径 GIF

结构清楚，AI 也更容易理解。

然而, 确实存在不少缺点, 举例来说, 并非瞬间就能输出, 排版所需时间为几分钟；图床方面的问题需要自行去解决, 后续也会针对这些进行优化处理。

LAST 结语

做完 gzh-design，我对排版这件事又确认了一遍。

好看不是玄学。

它是字体方面、颜色方面、层级方面、间距方面、标记方面、组件方面、规则方面以及边界方面, 一起共同作用所成就的结果, 经过了小李设计审美的叠加。

以前这些东西在设计师和编辑的脑子里。

目前, 我将其拆解为组件库, 并形成主题索引, 制定映射规则, 编写校验脚本, 以使AI能够逐一进行执行。

它可以把一个人的经验，压成一个 可复用的小系统。

要是你平常有写公众号之举, 有写教程之行, 有写产品评测之为, 有写自媒体长文之动, 那就能够把gzh - design安装起来去尝试一番。

isjiamu/gzh-design-skill

如果觉得有用，欢迎顺手给个 star

欢迎提出issue, 欢迎提出PR, 特别是新的主题风格方面的, 还有真实场景反馈相关的哦。

将被普遍知晓的知识转化为条理规范, 把这些条理规范传递给智能代理实施, 人来进行更加具有价值的判断。

以上。

我乃甲木, 很喜欢对一些 AI 干货内容予以分享, 并且还会把 AI 在各行业的落地应用进行分享。

继续浏览有关 排版设计AI工具 的文章