← 回到首页05 / 06 · ITERATIONS
迭代记录ITERATIONS

迭代记录

课程要求「网站必须持续迭代，不能期末一次性补做」。这一页就是证据：每一次改动都记下改了什么、为什么改、效果如何、下一步做什么，每条都带日期和版本号，可以和 Git 的提交时间戳互相印证。

共 27 次迭代 · 2026-09-28 开始 · 最新一次在页面最下面

  1. v1
    第 1 次迭代v12026-09-28

    从零搭好网站空壳

    改了什么
    搭建了项目基础框架。装上 Next.js + Tailwind CSS；建好 data（内容数据）和 app（页面）分离的目录结构；完成导航栏（手机端可折叠）、页脚、首页和 7 个板块页面。
    为什么改
    课程要求网站必须有完整结构并持续迭代。先把「骨架」立起来，之后每次只往里填内容，改起来才不会乱。
    效果如何
    网站在电脑和手机宽度下都能正常显示；8 个页面之间可以互相跳转，没有死链接；姓名、简介等信息集中在一个文件里，改一处全站生效。
    下一步
    填写真实的个人信息（src/data/site.js 里的姓名和邮箱），然后开始做「关于我」和「阶段作业」两页的内容。
  2. v2
    第 2 次迭代v22026-09-29

    完善个人信息

    改了什么
    在 src/data/site.js 里把姓名改成「张海燕」，邮箱改成我自己的常用邮箱（共 2 行）。
    为什么改
    第一次搭建时用的是模板占位文字「你的名字」，不换成真实信息就不算我自己的作品。同时也想验证一下「数据和页面分开」这个设计到底管不管用。
    效果如何
    只改了 1 个文件里的 2 行，首页大标题、导航栏左上角、页脚署名这 3 个地方同时更新了，没有动任何页面代码 —— 说明这种结构确实省事，以后改信息不用一页页找。
    下一步
    开始做「关于我」页的真实内容（自我介绍 + 能力清单），并把第 1 周的作业录入 src/data/works.js，让它自动显示在「阶段作业」页上。
  3. v3
    第 3 次迭代v32026-09-29

    完成「关于我」页

    改了什么
    把「关于我」页从一块占位牌换成了真实内容，共三块——自我介绍、能力清单、学习目标，另加了联系方式。新建 src/data/about.js 专门存放这一页的内容。
    为什么改
    占位牌上写着「这一页还在建设中」，不能一直空着；而且「个人简介与能力」是课程要求的第一个板块，应该先把内容最确定的一页做出来。内容单独放一个 data 文件，是为了以后调整时不用碰页面代码 —— 这是第 2 次迭代验证过好用的做法，这次继续沿用。
    效果如何
    能力清单按「熟练 / 会用 / 学习中」三档如实标注，并分成「编程与开发工具」和「AI 工具使用」两类，老师能一眼看清我的真实水平，不用自己判断；还没写的自我介绍会显示成黄色草稿框，提醒我这里是空的，不会误把草稿当成品交上去。
    下一步
    把自我介绍的三段草稿换成我自己的话；然后从第 1 周的作业开始录入 src/data/works.js。
  4. v4
    第 4 次迭代v42026-09-29

    对照评分标准补齐结构

    改了什么
    拿到课程的详细评分标准后逐条对照，新建了 5 个数据占位文件（项目成果、过程证据、迭代记录、标志性成果、最终复盘），把每个页面必须包含的要素做成数据字段；README 加了「课程要求对照表」任务清单。
    为什么改
    之前只按「要有 7 个板块」搭了空壳，但没有对照每一页必须包含哪些要素。对照后发现两个问题：一是大部分页面还只有占位牌；二是迭代记录只写在这个文档里，老师在网站上看不到，而课程要求它必须是网站内容。
    效果如何
    7 大模块现在每个都有对应的数据文件和明确的字段，填内容时不会漏项；任务清单能随时看出哪项做完了、哪项没开始，也能直接对着它安排下一步。
    下一步
    按优先级逐页做内容 —— 先做「过程证据」（评分标准里最重要的一页），再做「阶段作业」，并补上「关于我」页缺的「方向」这一项。
  5. v5
    第 5 次迭代v52026-09-29

    完成「过程证据」页

    改了什么
    把「过程证据」页从占位牌做成完整页面，5 个要素配上内容。需求部分写了课程的四条底线；提示词部分整理了 3 次真实的 AI 对话（问技术栈、问 Git 提交、拿评分标准来对照）；版本部分列出了 v1~v5 的时间线；问题解决部分记录了 4 个真实遇到的问题（项目名不能含大写字母、Google 字体联网失败风险、Git 邮箱泄露手机号、没对照评分标准就动手）。「原型」这一项当时还空着。
    为什么改
    这是评分标准里要素最多的一页，也最能证明「过程」是真实的。里面的提示词和问题解决都不是编的，是这次开发中真实发生的事 —— 与其写漂亮话，不如把真实经过记下来。
    效果如何
    页面顶部有 5 个要素的跳转目录，老师一眼能看到 5 项都齐了；「我自己做了什么」单独用蓝色框标出来，能看出 AI 只是辅助、判断和修改都是我做的；没填的原型项显示成明确的操作指引，不会假装做完了。
    下一步
    补上「原型」这一项；然后开始做「阶段作业」页。
  6. v6
    第 6 次迭代v62026-10-12

    补上「原型」证据

    改了什么
    「过程证据」页的「原型」从空白改成了两份「文字结构描述 + 方块线框图」——首页和「关于我」页各一份，用线条方块画出每页从上到下的板块排布；把之前写好的「关于我」页自我介绍（3 段）和学习目标（2 条）随这次提交一起归档。
    为什么改
    评分标准要求有「原型」，但我没有专业画图工具，手绘拍照也不方便。文字加方块同样能把页面结构讲清楚，而且放在数据文件里随时可以改。「关于我」的内容之前改完一直没提交，趁这次一起归档，保证 git 记录完整。
    效果如何
    「原型」不再是空的提示框，5 个要素全部齐了。线框图可以和最终页面放在一起对照，能看出页面结构是照着原型排的；「关于我」页也从此不再是草稿状态。
    下一步
    开始做「阶段作业」页（需要整理每次作业的信息：阶段、标题、时间、内容和完成程度）。
  7. v7
    第 7 次迭代v72026-10-12

    完成「阶段作业」和「项目成果」两页

    改了什么
    把两个页面的数据按新结构重建。projects.js 变成「项目档案」（功能/入口/关键页/技术说明四要素，3 个项目各一份）；works.js 变成「课程时间线」（第几周、作业要求、真实过程、技能），用 projectId 和档案关联。两页重做：阶段作业页按课程顺序竖排展示，每张卡片带「访问项目 ↗」按钮（新窗口打开）和「查看项目详情」跳转；项目成果页每份档案按四要素分区展示。AI 辅助（低代码平台、AI 提示词思路、Trae 辅助写代码）如实写进了技术说明。
    为什么改
    课程要求「阶段作业按课程顺序且不只有截图」和「项目成果包含功能/入口/关键页/技术说明」，之前的占位数据完全不符合；而且两个板块本是一体，用 id 关联后改一处两页同步，以后加第 4 个项目只需要加两条数据。
    效果如何
    3 个已上线的项目现在都能从作品集一键访问（新窗口打开，不打断浏览）；无网址的项目会自动显示「即将上线」标签而不是死链接；作业卡片上能同时看出课程顺序、作业要求和我真实做了什么。
    下一步
    补填 3 个项目的「我的收获」；核对 AI 草拟的功能/关键页描述；然后做「迭代记录」页（把 README 里的记录搬到网站上）。
  8. v8
    第 8 次迭代v82026-10-12

    完成「迭代记录」页

    改了什么
    把 README 里 7 条迭代记录全部搬到网站的 src/data/iterations.js，新建「迭代记录」页：按时间线展示，每条带「第 N 次迭代」编号、版本号（v1~v8）和日期，以及「改了什么 / 为什么改 / 效果如何 / 下一步」四要素；顺手把 projects.js 里的平台名称统一成「秒哒」。
    为什么改
    课程要求「迭代记录」必须是网站内容之一。之前记录只写在 README 文档里，老师浏览网站时看不到，起不到证据作用；搬到网站上之后，老师和我在任何地方打开作品集都能看到完整迭代过程。
    效果如何
    /iterations 页上线，8 条记录按时间顺序展示，每一条都能和 Git 的提交时间戳对上；README 里的记录和网页上的记录互为印证。
    下一步
    做「标志性成果」专题页（问题/用户/方案/演示/复盘）；然后把网站部署到公网，满足「可访问」底线。
  9. v9
    第 9 次迭代v92026-10-12

    部署上线，满足「可访问」底线

    改了什么
    在 next.config.mjs 里开启静态导出，npm run build 生成 out 文件夹；把 out 文件夹拖拽上传到 Netlify，拿到公网网址 https://zhymy-portfolio.netlify.app/；site.js 增加网址字段，页脚显示「本站已上线」。
    为什么改
    课程四条底线第一条就是「可访问」——网站必须能在公网正常打开，只在本机（localhost）能看到不算数。
    效果如何
    8 个页面在公网全部能正常打开（实测 HTTP 200），无死链接，不带斜杠的网址会自动跳转，乱输网址会显示 404 页；手机和电脑都能访问。
    下一步
    做「标志性成果」专题页（问题/用户/方案/演示/复盘）。以后每次改完内容，重新 npm run build 再拖一次 out 文件夹即可更新线上。
  10. v10
    第 10 次迭代v102026-10-25

    部署备用网址到 Vercel

    改了什么
    用 Vercel CLI 把项目关联到 Vercel（项目名 my-portfolio，团队 zhhy）并部署成功，拿到备用网址 https://my-portfolio-d8uz1evf2-zhhy.vercel.app；site.js 增加备用网址字段，页脚同时显示两个网址。
    为什么改
    只有一个托管平台不保险，多一个备用网址，两个平台互为备份；而且 Vercel 项目已关联好，以后把代码推送到 GitHub 就能自动部署。
    效果如何
    Vercel 部署状态 READY（生产环境），构建成功；两个平台现在都有完整的网站。
    下一步
    做「标志性成果」专题页（问题/用户/方案/演示/复盘）。
  11. v11
    第 11 次迭代v112026-10-25

    解决 Netlify 部署 404 问题

    改了什么
    排查并解决 Netlify 上全站 404 的问题。先用命令行检测发现服务器上放的是「源代码」（package.json 能打开、网页文件没有），确认原因：上传时拖错了文件夹，把项目源代码文件夹拖了上去，而 Netlify Drop 不会编译代码。解决：把打包好的 out 文件夹内容制作成一个 zip 文件（桌面上的「作品集网站上传包.zip」），重新拖拽上传，网站恢复。
    为什么改
    上传后所有页面都打不开（404），直接威胁「可访问」这条底线；必须查清原因、恢复线上，不能糊弄过去。
    效果如何
    8 个页面全部恢复正常（HTTP 200），首页标题、页脚双网址、迭代记录都正常显示；以后改用「拖一个 zip 文件」的方式更新，不会再拖错。
    下一步
    做「标志性成果」专题页；把这次 404 排查的完整经过补进「过程证据」页的问题解决。
  12. v12
    第 12 次迭代v122026-10-25

    搭建「标志性成果」页框架（代表作待定）

    改了什么
    把「标志性成果」页从占位牌换成完整的页面框架：5 个要素（① 问题 ② 用户 ③ 方案 ④ 演示 ⑤ 复盘）的分区、草稿框机制，以及「选定代表作后，④ 演示自动从项目档案取入口和关键页」的联动逻辑都做好了。内容暂时全部留空（【待填】），等选定代表作后再填写。
    为什么改
    课程要求这一页必须包含问题/用户/方案/演示/复盘五个要素；先把页面框架搭好，之后只需要填内容，不用再动页面代码。
    效果如何
    页面上 5 个要素的分区齐全，没填的内容都显示成黄色草稿框，不会把空页面当成成品；以后在 featured.js 里填好 projectId，④ 演示会自动出现访问按钮和关键页。
    下一步
    选定一个代表作（想清楚哪个项目最有故事、自己最满意），然后填写这一页的内容；再做最后一个模块「最终学习复盘」。
  13. v13
    第 13 次迭代v132026-10-26

    打通 GitHub 与 Netlify 自动化部署，彻底解决样式丢失问题，网站正式上线

    改了什么
    ① 把代码推送到 GitHub（仓库 Zhy-246-bd/my-portfolio），Netlify 改用「Import from Git」连接 GitHub；② 新建 netlify.toml 写明构建命令（npm run build）和发布目录（out），彻底解决之前网页端 Publish directory 设置不对导致的样式丢失问题；③ 全站旧网址统一替换为新网址 https://zhymy-portfolio.netlify.app/；④ 「关于我」页新增 AI 辅助说明，新建「引用声明」页如实说明 AI 辅助等情况。
    为什么改
    手动拖拽上传太容易出错（之前拖错文件夹导致全站 404）；改成 GitHub 推送自动部署后，改完代码 git push 一下网站就自动更新，不再依赖手动操作。课程「真实」底线也要求 AI 辅助必须如实声明，所以要补上专门的声明。
    效果如何
    现在 git push 之后 Netlify 自动构建部署，网站样式正常、8 个页面全部能打开；新网址正式上线；AI 辅助声明覆盖页脚、「关于我」、「引用声明」页三处。
    下一步
    删除旧的 Drop 站点；选定「标志性成果」代表作并填写内容；做最后一个模块「最终学习复盘」。
  14. v14
    第 14 次迭代v142026-10-26

    「引用声明」页如实确认：没有请教过同学或老师

    改了什么
    把「引用声明」页里「同伴与老师帮助」的黄色草稿行替换成如实说明：本网站由我本人独立完成（在 AI 编程助手辅助下），没有请教过同学或老师。
    为什么改
    课程「真实」底线要求如实说明 AI 辅助等情况，同样也应该如实说明「没有其他人参与」——没请教过就是没请教过，直接写明比留空或含糊带过更真实。
    效果如何
    「引用声明」页 5 个板块全部是真实内容，不再有黄色草稿框；5 个板块（框架模板、AI 辅助、同伴与老师、素材与部署平台、隐私安全）都完整。
    下一步
    删除旧的 Drop 站点；选定「标志性成果」代表作并填写内容；做最后一个模块「最终学习复盘」。
  15. v15
    第 15 次迭代v152026-11-01

    大改版前先做完整版本备份

    改了什么
    在尝试首页大改版（横向手风琴效果）之前，先把当时的完整版本提交存档，并在 README 顶部加了一条「存档标记」：写明这次提交的用途，以及改版出问题时怎么用 git log 找到提交号、再用 git checkout 恢复。
    为什么改
    首页改版会同时动布局、样式和交互，风险比平时补内容大得多。如果改到一半发现效果不好，需要一个确定能回去的「干净版本」，而不是凭记忆往回改。
    效果如何
    改版有了明确的回退点；README 里写清了存档提交和恢复命令，以后换工具、换电脑也能照着找回这一版，不会因为改版失败把整个作品集弄乱。
    下一步
    尝试横向手风琴式首页；如果效果不如预期，就回退到这一版。
  16. v16
    第 16 次迭代v162026-11-03

    做了一版「3D 活页本」首页（没有接入）

    改了什么
    新增 BookHome.js 组件和 8 张封面、纸张、装饰素材（约 5.4MB），把首页做成一本文具风格的活页本：封面照片切成左右两层，左侧 12.5% 固定住金属圈，右侧 87.5% 作为可翻的纸页，点击后绕左边缘 3D 翻开约 0.8 秒，再点内页合上。但首页 page.js 始终没有引入这个组件，访问网站看到的仍然是原来的卡片式首页。
    为什么改
    想让首页第一眼更有记忆点，用「翻开作品集」这个动作代替普通的卡片列表，也更贴合「作品集」这个主题。
    效果如何
    组件代码写完整了，翻页动画和封面接缝都按设计算好了；但因为没有接入首页，访问者根本看不到，反而多出约 5.4MB 用不上的素材和一份没人引用的代码，构建时还会被一起复制到 out 目录。
    下一步
    决定这个方案要不要用：要用就接入首页并补内容；不用就删掉，避免留死代码和无用体积。
  17. v17
    第 17 次迭代v172026-11-03

    删除未采用的「3D 活页本」方案

    改了什么
    删除 BookHome.js 和它专用的 8 张素材（cover-bg、cover-cropped、decor、decor-frame、decor-letter、decor-tape、paper-bg、torn-paper），public/images 只保留 .gitkeep；首页继续使用原来的卡片式布局，并更新全站的「最近更新」日期。
    为什么改
    这个方案最终没有接入首页，留着只是死代码和无用体积。课程评分看的是能打开的页面和真实过程，不需要把没采用的实验留在仓库里；需要回顾时，Git 历史里仍然找得到。
    效果如何
    源码里不再有无人引用的组件，public/images 从约 5.4MB 降到 0；构建和部署不再携带这些图片，仓库更干净。
    下一步
    把精力放回课程要求的两块空白：选定「标志性成果」代表作并填完 5 个要素，再写「最终学习复盘」。
  18. v18
    第 18 次迭代v182026-11-03

    补充第 7-8 周的 4 个阶段作业

    改了什么
    把第 7-8 周做的 4 个项目（待办事项网页、番茄钟、Markdown 笔记、天气查询）录入 works.js 和 projects.js：每个项目都写清楚功能、技术说明和入口，前 3 个配了关键页截图；阶段作业从 3 条增加到 7 条。天气项目线上版缺少 OpenWeatherMap 的 API Key，先把入口留空显示「即将上线」，等配置好再填。
    为什么改
    课程要求阶段作业按课程顺序完整展示，之前只录了前 3 次；这 4 个是最近一次作业，应该尽快补上，不能拖到期末一次性补做。
    效果如何
    「阶段作业」页从 3 条变成 7 条，「项目成果」页从 3 个变成 7 个；前 3 个新项目可以直接点开，天气项目会显示「即将上线」而不是死链接。
    下一步
    在 Netlify 给天气项目配置 VITE_WEATHER_API_KEY，重新部署后把 entry 填回 projects.js；然后再继续内页排版和封面替换。
  19. v19
    第 19 次迭代v192026-11-03

    给天气项目配置 API Key，恢复线上查询

    改了什么
    天气项目的线上版一直提示缺少 VITE_WEATHER_API_KEY。把 Key 配到 Netlify 的环境变量后重新部署 dist，线上已经能正常查北京天气；projects.js 把 project-7 的入口填回原网址，works.js 第 7 条改回「已完成」，并补了天气项目的关键页截图。
    为什么改
    课程「有入口」底线要求项目入口能真正打开；一个点进去报错的链接，比「即将上线」更扣分。
    效果如何
    天气项目从「即将上线」变成可访问，7 个阶段作业和 7 个项目全部有可点击入口；4 个新项目的关键页截图也补齐了。
    下一步
    继续内页排版和封面替换；天气的 API Key 在前端 bundle 里可见，后面如果要做安全加固，可以换成服务器代理并作废重发。
  20. v20
    第 20 次迭代v202026-11-03

    内页改成分页排版：每页固定、右页开章、去掉日期

    改了什么
    把笔记本内页从「一章一页、页内滚动」改成真正的分页：内容按页切好，一页放不下就顺延到下一页，桌面端页内不再出现纵向滚动条；每个模块第一页固定在右边那一页，左边留白等手账素材；删掉模块首页顶部的 DATE 和日期。桌面端左右页点击翻页保留，手机端改成一页一页切换。
    为什么改
    课程要求阅读顺畅、重点突出；一页里塞太多内容再滚动，翻页书的感觉会被打断，也不方便老师在页面上找信息。模块首页放右边、左边留白，也方便后面贴手账素材。
    效果如何
    桌面端每一页都是固定高度，内容不会在页内滚动；翻页一次前进/后退一页；模块第一页在右侧，左侧留白；日期已移除。手机端单页显示，用底部「上一页 / 下一页」切换。
    下一步
    继续补封面和手账素材；检查手机端每一页是否还有内容溢出，必要时再细分页。
  21. v21
    第 21 次迭代v212026-11-03

    项目页加「胶带照片」：7 个项目都贴上真实截图

    改了什么
    给 7 个项目都补了页面截图，在项目文字下面用两张半透明胶带、米色相框和编号印章贴成一张照片；点击照片跳到 /projects#project-id 的完整项目档案。项目模块改成一项目一页，避免照片和文字挤在一起。
    为什么改
    参考 April Leihuanani 的拼贴/软木板效果，让项目页更像手账里的实物照片，而不是纯文字列表；照片同时给了项目一个直观入口。
    效果如何
    7 个项目页都有可点的胶带截图；项目模块从 4 页变成 7 页；点击图片会离开手账、打开完整项目档案。
    下一步
    下一步做 Paper Turning Book 的 3D 翻页/阴影原型，先评估 WebGL 卷页 overlay 的可行性。
  22. v22
    第 22 次迭代v222026-11-03

    项目模块改成「开章页 + 两页满贴截图 + 项目说明」

    改了什么
    项目第一页只保留章节标题和一句说明；后面插入左右两页纯图片拼贴：7 张项目截图用胶带、米色相框贴满，大小交错、旋转、互相叠压，页面不再放任何文字；再往后是按两个项目一页的项目说明。
    为什么改
    之前每个项目下面贴一张图太规整，不像手账；要的是翻开项目后先看到一整面照片墙，视觉上更满、更像实物。
    效果如何
    项目模块变成 7 页：1 页开章 + 2 页拼贴 + 4 页说明；拼贴页没有页码、页眉和页脚，只有图片和胶带。
    下一步
    继续做 Paper Turning Book 的 3D 翻页原型。
  23. v23
    第 23 次迭代v232026-11-03

    纸张做旧、加厚页块：往「真实旧本子」的方向调

    改了什么
    把内页换成做旧的米黄纸（柔化褶皱、暖色、斑点/纤维），正文改用宋体；页面外缘增加厚纸页块：多层纸边、深色封底板、波浪裁边和投影；封面与内页统一暖光，侧标签、页码、环扣一起做旧；项目拼贴图加轻微褪色。
    为什么改
    之前的页面太干净、太像矢量网页，缺厚度和光；想要参考图里那种厚、旧、有手工感的本子，而不是卡通的纸质界面。
    效果如何
    页面更黄、更厚，书口能看到一层层纸边和阴影；正文更像印刷字；整体从扁平网页变成有重量的旧手账。
    下一步
    如果还要更像参考图，下一步把封面换成旧皮/米色布面，并做 3D 翻页原型。
  24. v24
    第 24 次迭代v242026-11-04

    首页改成全屏流体墨迹标题

    改了什么
    首页从普通卡片改成黑色全屏流体场：巨大的 ZHANG HAIYAN 由染料生成，鼠标经过时局部墨迹被搅开；左侧七个模块入口改成玻璃卡片侧栏。
    为什么改
    原来的首页更像常规个人主页，和我想做的「数智编程」流体视觉不够贴合；希望第一眼就能看出这个作品集有自己的动态语言，而不是套模板。
    效果如何
    首页有了连续的墨迹流动和鼠标搅拌；模块入口固定在左侧，页面内容不再被大标题挤乱。也确认了不使用粒子或烟雾，保留纯流体墨迹。
    下一步
    把同样的墨迹语言带到模块页，并处理长页面里标题和鼠标墨分开的问题。
  25. v25
    第 25 次迭代v252026-11-05

    模块页合并单画布，标题随滚动缩小

    改了什么
    模块页原来标题和背景是两条独立画布，改成一张固定视口的全屏流体画布；标题随页面下滑逐渐缩小、上移、淡出，滚回去时恢复；鼠标墨只在指针附近生成。
    为什么改
    两张画布时，鼠标在页面下半部分只能推动背景，推不到标题；强行把指针坐标映射到标题，又会在字母旁边平白多出一团墨。标题固定在背景上也不符合正常阅读。
    效果如何
    鼠标墨和标题处在同一套流场里，只有墨真的漂到字母附近才影响字母；标题不再固定在背景上，下滑时自然缩小消失。
    下一步
    修掉标题缩小时内部高光不跟着缩放的问题，然后整理项目成果页。
  26. v26
    第 26 次迭代v262026-11-05

    项目成果改成漂浮截图

    改了什么
    项目成果页去掉木板和图钉，7 张项目首页截图直接浮在深色背景上；每张图有不同漂浮周期和相位，鼠标靠近时按距离和指针速度施加推力，停住后回到漂浮轨迹。
    为什么改
    木板、图钉和照片堆叠试过之后都和网站整体的流体气质不搭；希望项目图片像被水托着，而不是钉在板子上。
    效果如何
    项目图片有了连续漂浮和鼠标推动，靠近才明显，离开后回位；页面不再有木板边界，图片和深色背景连成一片。
    下一步
    把项目索引改成单项详情框，补上缩略图和可读性更好的介绍文字。
  27. v27
    第 27 次迭代v272026-11-05

    项目索引改成单项详情框

    改了什么
    原来的项目列表改成一个详情框，只显示当前一个项目；左上是可点击的页面缩略图，右侧是项目名和角色，下面是放大的项目介绍、3 个核心功能、工具标签和入口；左右按钮与键盘方向键切换，首尾循环。
    为什么改
    原来的列表一次铺开所有项目，信息密度太高，也不方便突出单个项目；希望一次只看一个项目，同时保留快速切换。
    效果如何
    项目介绍的字号从 12px 提高到 14px，缩略图可以直接打开项目；左右按钮和方向键都能切换，右上角显示当前序号。
    下一步
    统一检查七个模块页的滚动、鼠标和移动端显示，再把过程证据与迭代记录补齐。
← 回到首页