Signal Atlas 是一个 Three.js 作品集实验室。它把个人主页做成一个可进入的 3D 开发者工作台:外层是 WebGL 房间、桌面和显示器,显示器里通过 CSS3D/iframe 投影一个真实可交互的 Vue 项目图谱。

上图来自公开演示站的真实运行画面,只展示作品集引擎、项目入口和公开截图,不包含私人账号、凭据或真实业务数据。
为什么做这个
普通个人主页经常只展示一句简介、几个项目卡片和一组链接。Signal Atlas 的目标不是再做一个静态 profile,而是把项目变成可以被检查的 signal:有截图、有项目说明、有标签、有入口,也能继续扩展成不同主题的作品展示系统。
这个方向适合展示视觉项目、开发者工具、数据看板和开源工作流。它让访问者先看到作品的运行状态,再决定是否继续进入 GitHub 仓库、博客文章或线上演示。
它解决什么问题
- 用 Three.js 场景承载作品集,而不是只用普通卡片列表。
- 用 CSS3DRenderer 和 iframe 把真实网页界面放进 3D 显示器。
- 用 Vue 项目图谱管理项目、模块、标签、说明和链接。
- 用本地 manifest 维护内容,后续替换身份信息和项目截图更直接。
- 用静态站点方式部署,适合 GitHub、Vercel 和个人域名承载。
- 用自有截图和过程化场景素材,避免依赖不可控的第三方模型或图片。
技术栈
- Scene: Three.js, CSS3DRenderer, Canvas textures
- Interface: Vue browser ESM runtime, manifest-driven UI
- Build: Vite, JavaScript, CSS
- Deployment: Static site, Vercel
项目边界
当前版本更像一个可二次开发的作品集引擎雏形,而不是完整 CMS。它适合 fork 后替换身份、项目 manifest、截图和主题,也适合继续扩展主题包、相机 preset、typed manifest schema 和更完整的项目详情页。
项目没有捆绑第三方 3D 素材、复制的品牌资源或私有数据。真正可复用的是技术模式:用 WebGL 外壳承载一个实时 HTML 应用,并把个人项目整理成可浏览、可证明的作品图谱。
项目入口
- GitHub 仓库:linsk-labs/signal-atlas
- 线上演示:linsk27-signal-atlas.vercel.app
- 项目总览:404_@林达 Projects
- GitHub 项目索引:404_@林达 GitHub 项目索引
Signal Atlas 适合作为 Three.js portfolio、CSS3D monitor projection、Vue project atlas、WebGL personal site 和 evidence-first portfolio engine 的参考实现。