开源一个公众号排版 Skill:彻底解决排版难题(建议收藏!)

0 评论 220 浏览 1 收藏 17 分钟

大家好啊,我是甲木,

这几天趁着还能用「天才程序员」,跟小李一起把 公众号排版 Skill 打磨了一下。

之前我们每次发布内容,都会有朋友问文章怎么进行排版的,今天直接把 方法论和代码库开源出来 供大家使用~

AI 排版要保证既有阅读路径,又不影响复制粘贴。 既有审美判断,又能稳定复用 。试了几轮之后,效果比我们预期好很多。

而且在 国产 Agent 上统统适用 !WorkBuddy、TraeWork、QoderWork、Dumate、KimiWork 等等,都能直接加载!国产模型通通适用!

先来看看效果,小李的经典 摸鱼绿

— 摸鱼绿

我之前常用的 红白风格

— 红白风

还有 橄榄手记 风格等等。

— 橄榄手记

我们看了觉得效果不错,于是把这套东西整理成了一个 Skill,叫 gzh-design-skill

今天把它开源出来。

GitHub 开源地址(欢迎 star ⭐️)

isjiamu/gzh-design-skill

— GitHub 首页

下面聊聊它解决什么问题、个人如何 搭建自己的排版体系 ,以及 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 套模板,结果都被小李否定了…(把 选择权和自主性给到用户

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

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

— 六套主题,按需选择

这 6 套,每一套背后都有自己的 组件库、色值、标题骨架、正文标记方式 、引用块、图片样式和文章类型配方。

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,它会 自动完成安装

装好之后,对它说下面这句就会触发:

PROMPT 用摸鱼绿把这篇文章进行公众号排版:article.md

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

如果你给的是 Markdown,效果最稳,如果是其它格式,它也会先做 格式归一化 ,再进入排版流程。

当然,我还是建议正式写作时尽量用 Markdown。生成的这个页面,右上角我也准备了 「一键复制」的按钮 ,大家打开直接去公众号后台编辑即可。

操作路径 GIF

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

当然也有不少缺点,比如 非秒出 ,排版时间需要几分钟; 图床问题需要自己解决 ,后续也会针对性优化。

 

LAST 结语

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

好看不是玄学

叠加上小李的设计审美,它是 字体、颜色、层级、间距、标记、组件、规则和边界 共同作用的结果。

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

现在我把它拆成组件库、主题索引、映射规则和校验脚本,让 AI 可以 一条条执行

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

如果你平时也写公众号、写教程、写产品评测、写自媒体长文,可以把 gzh-design 装起来试试。

isjiamu/gzh-design-skill

如果觉得有用,欢迎顺手给个 star ⭐️

也欢迎提 issue、提 PR,尤其是 新的主题风格和真实场景反馈

把常识写成规则,把规则交给 Agent,人去做更值得做的判断。

以上。

我是 甲木 ,热衷于分享一些 AI 干货内容,同时也会分享 AI 在各行业的落地应用。

本文由作者@甲木未来派,授权发布于平台,未经许可禁止转载。

更多精彩内容,请关注人人都是产品经理微信公众号或下载App
评论
评论请登录
  1. 目前还没评论,等你发挥!