玄玑洞府国风3D个人主页源码拆解：六场景沉浸式游历与暗色后台适配

做个人主页最怕千篇一律。这

原文参考

原标题：玄玑洞府 · 国风3D个人主页系统开源_搭建168

原文简介：

简介：
玄玑洞府 · 国风3D个人主页系统开源
以东方水墨为骨、低多边形科技为魂的个人主页系统。 前端 3D 洞府沉浸式游历 + Ant Design 水墨修仙后台可视化管理，内容与展示完全分离。
已实现的完整能力
前端 3D 主页
六大场景：山门候客（加载）→ 洞府前厅 → 筑基概况 / 修行履历 / 丹器馆藏 / 传讯玉符
镜头系统：GSAP 插值（power2.inOut，1.2s）、前厅待机公转（20s 周期 ±15°）、鼠标跟随偏移、转场期间禁用交互
虚拟形象：用户提供的开源人物模型（男生小孩，Tripo 生成 GLB），经自研减面管线把 43MB / 149 万三角形压到 3.14MB / 11 万三角形；统一染「生宣暖白」色调融入青绿水彩，待机呼吸、微摆、悬停放大、点击抱拳行礼 + 随机问候
场景交互：玉简悬停展开、灵脉节点悬停涟漪与点击展开、法宝拖拽 360° 环绕与分类高亮、玉符点击复制/跳转
彩蛋：修为值（浏览累积并进阶）、灵签、昼夜轮转
全局：御剑归宗、精简模式、移动端底部导航、篆文进度加载、弱网提示
降级：WebGL 2.0 检测失败自动切换 2D 水墨版主页（内容完全一致）
贴图：全部由 Canvas 2D 程序化生成（八卦纹、玉简篆文、匾额、卷轴、光晕、水墨噪声），无额外静态资源；石壁卷轴会按当前档案内容实时排版竖排文字（右起，含落款印）
管理后台
登录

原文截图：

免责声明

⚠️ 本文仅供学习研究和技术交流，相关源码仅用于了解系统架构与部署流程，请勿用于非法用途。任何商业运营行为均与作者无关。