三个作品 · 点开就是成品
想法要能被点开。
一塔五境、广州经济看板、87 键键盘——一个讲空间，一个讲数据，一个讲产品结构。 三个都是可以直接在浏览器里操作的东西：不用下载，不用登录，也不用先听我解释。
建议用电脑打开 手机也能看，3D 那个建议横屏 每个页面都能离线运行
作品 / Works
按推荐观看顺序排列
一塔五境 · 广州塔的垂直城市
把广州塔拆成五段真实结构，用滚动驱动一条连续的镜头与爆炸时间线，讲完六个章节。
33 万三角形 · 204 draw calls · 8.6 MB，进去前先看说明
- Three.js
- 滚动叙事
- 移动端适配
广州经济运行监测看板
从统计局公开 PDF 里抽出 1978—2025 年的数据，做 11 区横向对比，再用三张卡片解释「数字为什么反常」。
11 区合计对得上全市 · 8 个工作表 · 单文件离线
- Python
- ECharts
- 数据校验
87 键 TKL 机械键盘 · 爆炸图
十个零件、八十七颗轴，按装配逆序炸开。一套 A3 双页规格图，外加一个可以逐层点开的网页版。
10 个零件 · 87 颗轴 · A3 双页 + 交互页
- Blender
- Cycles
- 版式设计
每个作品，真正难的地方
面试时可以只讲这三段
滚动不能和三维时间线脱节
章节边界最容易硬切：镜头刚到位，文字已经走了。
做法：把 scrollY 归一化成连续进度 f，章内前 54% 保持构图、后段用 smoothstep 过渡；爆炸位移每次都从 baseY 绝对计算，来回滚不会累计误差。
结果：六章可以正着看、倒着看、停在任意一帧，塔的五段始终对得上标签。
官方只给 PDF，没有干净的表
数字抄错一次，后面所有占比和贡献都白算。
做法：用 Python 标准库写了个 PDF 表格提取器；再做三项闭合校验——11 区 GDP 合计 = 全市 32039.46 亿、人口合计 = 1910.10 万、社零合计 = 11032.38 亿，三项精确相等才往下算。
结果：单文件网页 + 8 表 Excel；「固投 −6.7%」被拆到黄埔、番禺、增城三个区，而不是一句「全面下滑」；统局没单独披露的年份留空并标注，不插补。
爆炸图很容易变成一堆零件
炸得太开看不出装配关系，炸得太紧又看不清层次。
做法：十个零件按装配逆序展开，间距按可读性手动调，不按等比放大；网页版把每层做成独立图层，点哪层、哪层浮起来，其余压暗。
结果：A3 双页讲清「轴体—定位板—夹层」的受力关系，网页版可以一层层点开看。
这一页想说明的事
三个项目分别对应三种表达能力：把空间讲清楚、把数据讲清楚、把产品结构讲清楚。共同点是都能真的跑起来——不是效果图，也不是截图。
如果时间有限，建议先看 02（30 秒能看懂结论），再看 01（体验一次滚动），最后看 03 的细节。
把这一页带走
这段二维码就是本页地址：印在简历上、贴在作品集 PPT 里、发在微信里都能扫开。手机上打开后，三个作品都在，不用登录。
portfolio.example.com