我和 Codex、Claude 一起把博客“装修”了一遍

Mon, 12 Oct 2026 00:00:00 +0800

春节那会儿，我用当时大火的 OpenClaw 搭起了这个博客，在第一篇文章里写下：希望自己能坚持下去保持更新吧～

然后，首页上那行“1 篇文章”就这么挂了大半年。

这次我也没先憋出第二篇文章，倒是先把博客从里到外“装修”了一遍：换了新的视觉，多了作品集和更顺手的中英文切换，文章里能插视频，还有了一个能在浏览器里写文章、预览、发布的“本地工作室”。

说实话，这些东西我一样都不会做。CSS、Hugo 模板、Git、Cloudflare 部署……放在以前，光看到这几个词我就会默默关掉页面。但这一次，我没有写代码，只负责提想法、做选择、挑毛病，剩下的交给了两个 AI 搭档：Codex 和 Claude Design。

第一次，是 OpenClaw 帮我把博客搭了起来；这一次，是 Codex 和 Claude 帮我把它装修好。

一个甲方，一位设计师，一支施工队

如果把这次升级比作装修房子，分工大概是这样的：

我是甲方：说清楚想要什么，看方案、做选择，住进去试试哪里不顺手。
Claude Design 是设计师：负责“好不好看”，给出视觉方案和可以点来点去的原型。
Codex 是施工队：负责“能不能用”，把想法变成真正能跑的功能，把设计稿接进博客，再测试、发布、上线。

整个过程就是图里的这个循环：我提一个想法，AI 做出一个能看的版本，我试一试、挑挑毛病，再接着改。转着转着，博客就变了样。

从“统一一下字体”开始，越改越多

最开始的需求其实很小。博客用的是 Hugo 的 Stack 主题，左中右三栏的结构我挺喜欢，只是觉得中文字体、标题和卡片看起来不太统一，想整理一下。

Codex 先在本地做了一版预览，确认没问题了才去动正式的博客。可改着改着，新想法就一个接一个冒了出来：

我平时会用 AI 做图片和视频，能不能有个作品集放它们？
视频文件太大，能不能继续放在 B 站、YouTube 上，博客里只放封面和链接？
博客有中英文，切换语言时能不能停在当前页面，而不是跳回首页？
每次更新都要改文件太麻烦，能不能在浏览器里写好、预览、发布？

这些都是我用大白话说出来的。Codex 会先帮我把事情想清楚——哪些现在就做、哪些先不做、做了以后有什么限制——然后一件一件实现。最后那个想法，变成了一个只在我自己电脑上运行的“本地工作室”：写文章、存草稿、管理作品、选封面、预览、发布，都可以在这里完成。

当然，也不是一路顺风。测试文章为什么没出现在预览里，发布为什么卡住了，我都一头雾水过，还遇到过 GitHub 登录授权的问题。每次我把看到的情况描述给 Codex，它就去查原因，把我带过这一关，顺手把界面上的提示改得更清楚，下次就不会再懵了。

请 Claude 当设计师

功能差不多齐了，接下来就想让它更好看一点。

这一步我学到的是：不能只跟 AI 说一句“帮我设计得好看一点”。Codex 先帮我整理了一份完整的设计资料包——每个页面现在的截图、哪些功能不能丢、当前用的字体和颜色、相关的代码、几张用来测试排版的示例图，还有一套分步骤的提示词。某种意义上，这是一个 AI 在给另一个 AI 写需求文档。

我把这份资料交给 Claude Design。它先把资料认真读了一遍，列出它看到的问题，然后给出了两套方向：A 方案“纸页阅读”，暖白底色、宋体标题，偏向写作；B 方案“中性画廊”，灰白干净、首页带上作品，偏向展示。

我挑了 B 的整体风格，但更喜欢 A 的手机菜单：它只在顶部展开一小块，不会把整个屏幕都盖住。AI 给的方案不用整套照单全收，完全可以“这个要那个、那个要这个”。

第二轮，Claude 就按我的组合把整个网站细化成了一个可以点来点去的原型，浅色深色、中文英文、作品多一件少一件，都能切换着看效果。

从设计稿到真正的网站

原型再好看，也只是设计稿。拿到第二轮的文件后，我把它交给 Codex，由它接进现有的博客：新的视觉要套上去，原来的文章、作品数据、草稿、本地工作室和发布流程，一样都不能丢。最后，博客还是那个 Hugo 博客，只是换了一身新衣服。

手机上的菜单，就是从 A 方案“借”来的那个：

接入的过程中还顺手加了点东西：写文章时可以直接插入 B 站、YouTube 等平台的视频；文章封面统一成 16:9，而且可以自己拖动、缩放，选择显示图片的哪一部分。

写在最后

回头看这几天，最大的感受是：这是一件我根本不会、原来也不敢想的事。

从“想把字体统一一下”开始，到新的视觉、作品集、中英文、本地工作室、文章视频、RSS 订阅页一起上线，前后也就几个小时的时间。它不是我输入一句话，AI 就全部搞定的——中间有很多来回的讨论、取舍和返工。但最难的那部分，写代码、调样式、测试、部署，都是 AI 在做；而我做的，是想清楚要什么、在方案里做选择、再亲自去用一用。

几点小体会：

说清楚要什么，比会不会写代码更重要。 给 AI 足够的资料和约束，它给出的东西才会具体，而不是一句“更现代、多留白”。
AI 出方案，选择权在自己。 方案可以拆开挑、混着用，最后拍板的是我。
一定要自己去用。 很多问题，只有真正点一遍才会发现。

Claude Design 负责好看，Codex 负责好用，两边衔接得出乎意料地顺。整个过程最大的成就感，不是“AI 很厉害”，而是我这个外行，第一次把一个想了很久的东西，一点一点变成了真的。

作品集现在还空着，下一步是把自己真正的 AI 作品放进去，然后……继续写。上次说“希望能坚持下去”，这次就不立 flag 了——有了本地工作室，写文章总该没那么难了吧～