第 04 课 · 4 学时
AI 网站改造
心法: 不要写系统,改系统
本节任务
从基础到挑战三个层次,根据自己的节奏推进
基础任务
跟着步骤,完整体验一遍流程
在上节课的个人网站上,用 AI 加一个新页面或新版块(比如读书清单、相册、技能树)
进阶任务
在基础上自由发挥与改造
深度改造:换主题色、改字体、调动效、加暗色模式切换
挑战任务
突破舒适区,做出个性化作品
把别人的开源项目(博客系统、画廊、笔记应用)整体改造成自己的版本
提示词参考
点击右上角"复制"按钮即可一键拷贝到剪贴板
看懂别人的项目结构
这是我 clone 的项目:[项目 URL]。
请帮我看一遍这个项目,告诉我:
1. 它的整体架构(用什么框架、文件怎么组织)
2. 哪些文件是配置、哪些是内容、哪些是组件
3. 如果我想 [加一个版块 / 改个颜色 / 换个字体],应该改哪里
用通俗语言,不要太多术语。
在现有页面加一个版块
我想在主页加一个"正在读的书"版块,要求:
- 卡片样式,横向滚动
- 每张卡片显示:书名、作者、封面图、我的简评
- 数据来源用一个 JSON 文件,方便我以后手动维护
- 视觉风格和当前主页保持一致
请告诉我具体改哪些文件、改成什么样。
改主题色
帮我把整个网站的主色从 [当前颜色] 换成 [新颜色]。
要求保持配色和谐,不只是简单替换:
- hover 态、激活态、文字、背景的关系都要协调
- 暗色模式(如果有)也要一起调整
列出所有需要改的文件和具体位置。
心法解读
做产品的人 95% 的时间都在”改”,而不是”写”。
很多大型产品的开发,本质就是在已有代码上做修改、加功能、改 bug。 学会”读懂别人写的东西并修改它”,比”自己写一个新的”更重要、更高频。
课堂动作
打开你第 3 课的网站,挑一个最不满意的地方,让 AI 帮你改 5 个版本,选一个最喜欢的留下。