"所有博客都长一个样"
内容千差万别，呈现千篇一律——我想改变这件事
传统博客系统——Hugo、Jekyll、Hexo、Gatsby——把大量精力投入到内容管理、构建流程、部署管线上。这些工程问题它们解决得很好。但对于"文章应该怎么呈现"这个问题，答案永远是同一个：一套模板，套所有文章。
这不只是"不好看"的问题。
一篇讲述从 VS Code 迁移到 Neovim 心路历程的文章，它是叙事性的——有困惑、有挣扎、有顿悟的瞬间。它需要情绪起伏，需要在转折点制造视觉冲击，需要在结尾留下余韵。
一篇分析分布式系统一致性算法的技术长文，它是分析性的——有数据、有对比、有层层递进的逻辑。它需要清晰的信息层次，需要代码块的沉浸展示，需要让读者在复杂概念之间建立联系。
但在传统博客里，这两篇文章看起来几乎一样——同样的标题字号，同样的段落间距，同样的代码块样式，同样的白底黑字。换了个标题，其他什么都没变。
去年十月的某个周末，我做了一个让同事觉得我疯了的决定：卸载 VS Code，全面转向 Neovim。起因很简单——我发现自己花在"操作编辑器"上的时间，比花在"思考代码"上的时间还多。
第一周是痛苦的。最基本的操作都需要查文档，效率断崖式下跌。但第三周出现了转折——当我用宏命令在十秒内完成了以前需要五分钟的重复操作时，我知道这条路走对了。
Raft 和 Paxos 的核心区别不在于正确性，而在于可理解性。Raft 的论文标题就是"In Search of an Understandable Consensus Algorithm"。
heartbeat interval: 50ms
log replication: append entries RPC
在我们的测试中，三节点集群的写入延迟 p99 约为 12ms，五节点时上升到 18ms。
两篇完全不同的文章，看起来几乎一模一样。
内容是多样的，但呈现形式是单一的。
AI 作为"导演"
BeautiBlog 的核心想法很简单：让 AI 成为每篇文章的"导演"。
就像电影导演拿到剧本后，不是照着念台词，而是要做大量的创造性工作——设计分镜、选择镜头语言、编排节奏、把控情绪曲线。AI 拿到一篇 Markdown 笔记后，要做的也不是简单的格式转换：
阅读理解
这篇文章在讲什么？情绪基调是什么？哪些是核心论点？哪里是全文的高潮？
体验设计
读者打开页面首先看到什么？往下滚动时应该有怎样的节奏？哪里需要视觉冲击，哪里需要留白让人喘息？
视觉执行
选什么配色？用什么布局？代码块怎么展示？引用怎么突出？每个细节都要服务于这篇特定文章的内容。
这里有一个关键的区分：这不是让 AI 生成一段好看的 HTML。这是让 AI 先理解你在说什么，然后为你说的话选择最好的表达方式。 格式转换和内容理解，是完全不同层次的事情。
在品牌层面，BeautiBlog 通过 CSS 变量实现统一与个性的平衡。base.css 定义了品牌级的设计系统——字体栈、间距体系、暗色模式适配——保证所有文章有一致的基础品质。但每篇文章通过 article.css 覆盖变量，拥有自己的配色和布局风格。就像一个服装品牌——调性统一，但每件衣服的剪裁不同。
还记得前面那两篇"长得一样"的文章吗？经过 BeautiBlog 处理后：
暖色渐变、大字引言、情绪转折用全宽深色背景冲击、结尾余韵
冷蓝基调、终端风格代码、数据可视化柱状图、清晰的信息层次
同样两篇文章，现在它们看起来完全不同了——因为它们的内容本来就不同。
一个人的工作流
BeautiBlog 不是一个孤立的工具，它是一个完整知识工作流的最后一环。
我现在每天 80% 的时间都在和 AI 对话——写代码、解决技术问题、讨论设计方案、探索新想法。这些对话中产生了大量有价值的思考和结论。但如果不做任何处理，它们会随着聊天窗口关闭而消失。
所以我建立了这样一条工作流：
每天和 AI 持续对话，解决问题、深入思考、探索新方向
AI 自动将对话中的关键进展整理成结构化的 Obsidian 笔记——判断归属哪个主题、更新还是新建、维护笔记之间的关联关系。不需要手动整理
在 Obsidian 知识库中浏览沉淀的笔记，挑出有价值、值得公开分享的内容
笔记是碎片化的内部记录，不能直接当文章发。AI 重新分析内容，提取核心洞察，补充论证深度，和我讨论编排方案
AI 为确认后的内容设计阅读体验——首屏、节奏、布局、配色
根据故事脚本生成最终的网页——CSS、HTML、JavaScript
从思考到发表，中间经过了三层 AI 协作——第一层帮你记录，第二层帮你提炼，第三层帮你呈现。每一层人都可以介入和纠正。这不是"AI 替你写博客"，而是"AI 在每个环节做它擅长的事，你做你擅长的事"。
设计先于实现
从工作流的全景回到最核心的一环：BeautiBlog 是怎么把一篇笔记变成一个网页的？
答案是两个阶段：
Obsidian 中的原始内容
首屏设计、节奏编排、布局选择、配色情绪
渲染产物——可独立编辑的三段中间文件
嵌入模板壳，浏览器直接打开
一个自然的问题是：为什么不一步到位？直接让 AI 读完 Markdown 就输出 HTML，中间那个"故事脚本"似乎多此一举。
但这恰恰是整个系统最重要的设计决策。它的深层原因是一条软件工程中的老原则在 AI 工作流中的应用——设计先于实现。
纠偏成本完全不同
AI 生成的质量不稳定，这是目前大语言模型的现实。如果让 AI 一步到位从 Markdown 生成完整的 HTML 页面，出了问题——比如配色不对、布局选择不好、节奏编排有问题——你面对的是几百行 CSS 和 HTML 代码，改起来痛苦且低效，很多时候不如整个重来。
但如果拆成两步，故事脚本是纯文本——几十行的 Markdown，描述"首屏用什么标题、第三段用什么布局、整体偏冷色调"。人审阅的成本是几分钟，修改的成本是改几个字。确认设计方向正确后再让 AI 写代码，大幅减少了返工的概率和成本。
关注点分离
"规划一个好的阅读体验"和"写出正确的 CSS/HTML 代码"是两种完全不同的思维模式。前者是设计思维——考虑情绪、节奏、视觉层次；后者是工程思维——考虑语义化、响应式、性能优化。
让 AI 同时做这两件事，容易两头都不好——设计思考被代码细节干扰，代码质量被设计要求拉低。分开后，每一步的 prompt 更聚焦，AI 的输出质量明显更高。
可观测性
单步黑盒生成，你只能看到最终结果好不好。不好的时候，你不知道是 AI 对文章理解有误，还是视觉设计方向不对，还是代码实现有 bug——你只能重新措辞 prompt 碰运气。
两步流程让你能看到 AI 是怎么"想"的。故事脚本就是 AI 的设计思路：它认为这篇文章的基调是什么，它打算在哪里制造高潮，它为什么选择这种布局。不满意的时候，你可以在思路层面精准纠正——"这篇文章的重点不在第三段，而在第五段"——而不是在代码层面修修补补。
这个原则其实可以推广：任何让 AI 做的复杂任务，都值得拆成"规划"和"执行"两步，而不是一个 prompt 走到底。
白盒而非黑盒
从两阶段分离再往前推一步，它背后其实是一个更普适的话题：我们应该怎么和 AI 协作？
大部分 AI 工具的工作方式是黑盒。你给一个 prompt，它给你一个结果。如果结果不好，你能做的只有接受或拒绝。你不知道 AI 在中间做了什么判断、走了哪些弯路、在哪一步出了偏差。唯一的调整手段是重新措辞 prompt，本质上是碰运气。
BeautiBlog 追求的是白盒过程。AI 在每一步的决策都以中间产物的形式保存下来：
故事脚本记录了 AI 的设计思路——它怎么理解这篇文章，打算怎么编排体验。article.css 记录了它的视觉执行——选了什么颜色，为什么这样布局。article.html 记录了它的内容处理——原始笔记被怎样重组、扩展、呈现。
这意味着你可以在任何一个层面介入：对设计方向说"不"——改故事脚本，重新渲染。微调某段样式——改 CSS，重新组装页面。理解每篇文章的视觉从何而来——所有决策都有迹可循。
AI 不是黑盒，而是一个可以和你协作的搭档。 当 AI 做的事情越来越复杂，"中间产物"的价值会越来越大——它是人类保持对 AI 工作可理解性和控制权的关键机制。
纯静态的选择
没有选择 React、Vue、Astro 或任何前端框架。BeautiBlog 最终输出的就是 HTML + CSS + 少量 vanilla JavaScript。
原因很朴素：
- 没有框架的运行时开销，浏览器拿到 HTML 就直接渲染
- 不需要 Node 服务器，任何静态文件托管都能跑——GitHub Pages、Cloudflare Pages、或者一台最便宜的 VPS
- 纯 HTML 文件十年后还能打开，框架十年后可能已经没人维护了
- 部署就是 rsync 到服务器，没有构建步骤
但更重要的是想清楚一件事：纯静态是当前阶段的最优解，不是终态。
现在的目标很明确——以最小的代价（服务器性能、CDN 部署的低成本），做出最简单、最美观的博客。这个基础打好之后，要加搜索功能、评论系统、访问统计这些能力是很轻松的。静态页面本身不排斥这些，只是当前阶段不需要。
先做对一件事——让每篇文章有独特的视觉叙事——再考虑扩展。这是工程上的克制，不是技术上的局限。
这不是又一个博客框架
Hugo、Jekyll、Hexo、Gatsby、Astro——博客框架已经太多了。BeautiBlog 不是在做第 N+1 个。
它们解决的是同一个工程问题：如何高效地把 Markdown 变成网页。答案是模板引擎和构建管线——定义一套主题，所有文章按同样的规则渲染。这个问题已经被解决得很好了。
BeautiBlog 试图回答的是一个不同的问题：如何让每篇文章获得最适合它的呈现方式？ 这不是工程问题，是设计问题。而它的答案不在模板里，在 AI 的内容理解能力里。
这是一个还在成长的实验。它依赖 AI 大模型的能力——但不绑定任何特定厂商或工具。GPT、Claude、Gemini、开源模型，任何有足够能力的大模型都可以驱动这套流程。真正的"引擎"不是某个软件，是 AI 本身。
你正在读的这篇文章，就是 BeautiBlog 生成的。
从 Obsidian 里的两篇碎片笔记，到你眼前这个有结构、有节奏、有设计感的页面——中间只隔了一次 AI 对话。