作品集 on 404_@林达

Signal Atlas Three.js 作品集实验室

Wed, 08 Jul 2026 00:00:00 +0000

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 仓库：linsk27/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 的参考实现。