引言

经过几天的时间,终于将目前博客的主题给写的差不多了,想想还是写一篇文章来“感慨”一下。

审美?

当我在电脑创建文件夹准备立项的时候,心里犯了难?前端应该如何设计,我反复看了很多做的比较优秀的博客,例如HEO、Innei等前端开发者的作品,打心里感叹,他们做的前端是多么优美和优雅,从字体和布局,再到配色,几乎每个地方的细节都做的恰到好处,最重要的是观感上非常舒服,Innei的Yohaku,看起来就像是一本书籍,它和其他的网站不一样,不全靠布局,卡片的堆砌,而是使用文字的排版来进行刻画,少量的线条和留白作为基调,拒绝了千篇一律的卡片设计;而HEO博客则是使用大量的卡片作为网站的设计核心,但是它的卡片设计的设计的非常统一,色彩恰到好处,很难想象这个博客是从Butterfly魔改来的,经过HEO擅长的图片设计,博客的效果只能说用惊艳去形容。 简单称赞一下我觉得两位做的好的前端开发者,那么我该怎么去增强自己的审美呢? 尝试使用AI去设计,发现每次都达不到自己的意思,依旧是千篇一律的设计,没有一点新意,也花费了很多时间在设计这上面,可是这么耗下去始终是无法做出自己想要的效果,所以我决定去模仿,去吸取大佬的设计标准,也可以说是抄袭,说白了,就算我抄袭也达不到他们的标准。

设计!

于是我从Innei的项目那里找灵感,他开源了新主题的设计思路,其中有个网站吸引了我,kami这是一个排版设计系统,在设计前端的时候,字体的排版大于布局的设计,例如一些博客,非常精简,但是它的字体排版优美,可读性非常好,这就已经打败了大部分堆砌UI效果的博客,所以这个标准是非常重要的;字体和排版借用kami,那么排版我应该怎么去做呢,之后我在Github发现一个前端秘籍美的源代码 这可能是AI写的一本设计书,不过它能规范AI在编程时候按照这个标准去做,其中涉及到配色,字体以及布局等方面内容,我将这两个分析之后,做成设计skill,为我后面的博客网站做铺垫。 设计做好了,网站的后端该怎么去解决,这里我没有想自己开发后端,而是借用Innei的mix-space core系统作为后端,其一是这套系统是非常现代化的技术栈,很多新特性和思路都在这里,再者我非常喜欢它内部的操作逻辑,书写起来会比较沉浸。 让AI部署好之后,就可以开始之后的设计。

AI Coding

我使用的是GLM5.2的大模型,编程平台是claude code+zcode,首先./init项目目录,将目录下的开发文档转化成CLAUDE.md,之后便开始我的coding time…… 看我的博客首页就可以看出来,我大部分借鉴的都是Yohaku的设计,这是一套非常清新和简约的设计方案,我放弃了使用组件库,大部分的UI全部让AI手搓js进行构建,布局也使用了巧思,关键词大量使用书籍的观感和排版,尽可能对称和统一文字大小,并让自己较细,让页面看起来非常文艺,并带有日式简约的效果;Hover使用了紫色强调色,我一开始并不知道该使用什么颜色比较好,但是问了一个女生,她说她喜欢紫色,所以我看了很多紫色配色,最终定下来现在的紫色。 然后后面一通修修改改,前端大体是完成了,功能性却还没做,于是又是一轮复杂的后端对接工作。 给出AI指令,将前端全部对接后端API,所有功能全部对齐,删除不需要的模块,增加后端需要的模块…… GLM5.2也非常给力,基本上做完没有出现大的问题。

完活!

OK,主题目前已经做到百分之九十了,还有很多BUG还没有完善,UI还需要打磨,之后我还会在基础上继续更新主题的开发。👌