语言技术
HTML5、CSS、JavaScript系统类型
Web行业分类
内容平台
项目立项原因
"数字纪念碑"——不只是个人网站，而是一座数字空间中的纪念碑。
该项目立项的核心驱动力有三：
① 个人数字身份的品牌化构筑 用户（万星辉 / Nexus / Lira）横跨全栈开发、渗透测试、安全运维、UI/UX 设计四大角色，同时任职于HONOR 战略企划部（产品经理/售前/市场研究），需要一个超越传统简历的综合性数字空间来承载多维度的职业身份。
② 设计哲学的实践载体 项目并非简单的个人主页，而是 "数字纪念碑主义"（Digital Monumentalism） 设计哲学的完整落地——将界面重塑为纪念性空间，每一个像素承载重量，每一次交互如同触摸一座现代纪念碑的表面。这一理念在 design-philosophy.md 中有完整宣言。
③ 多 Agent 协作方法论的展示窗口 作为"三省六部制 Agent 工作流"的践行者，需要一个实际运行的项目来展示：
多智能体协作生态派的理念
A2A 标准化通信协议
AutoGen / CrewAI / MCP 协议的工程实践
一、主站 index.html — 数字纪念碑
1. 黎明碑文（Intro Overlay）
启动时全屏覆盖的电影级入场动画
建筑风格边框（portal frame）+ 浮动粒子 + 暖色调地平线光晕
背景图片渐显 + 字母盒（letterbox）展开/收起
自动进入主站，一次性体验，无重复
2. 英雄区域（Hero）
Canvas 动态粒子背景（WebGL 驱动）
四柱角色标识：全栈开发 / 渗透测试 / 安全运维 / UI/UX 设计
理念宣言：「三省六部制 Agent 工作流 · 多智能体协作生态派」
导航按钮：阅读博客 / Explore My Work / 联系我
3. 关于我（About）
个人简介 + 专业背景
视觉化框架展示：角色数量、年限、技能标签徽章
终端式 $ whoami 交互元素
4. 职业轨迹（Experience）
时间线（Timeline）展示三段职业经历
每段含：时间区间、角色、公司、详细描述
5. 技能矩阵（Skills）
分类展示技能项（前端、后端、安全、设计、Agent AI 等）
每项技能带熟练度指标
6. 项目展示（Projects）
4 个项目卡片：低空防御系统、Agent 协作平台、设计系统、博客平台
点击卡片弹出全屏 Modal 弹窗，展示项目详情（200-400 字正文、技术栈标签、GitHub 链接预留）
毛玻璃遮罩 + 滑动入场动画 + Escape 键关闭
7. 联系（Contact）
联系表单或联系方式展示
8. 页脚（Footer）
三栏 Grid 布局：品牌区（Logo + 座右铭）/ 导航区 / 社交图标
社交链接：GitHub + 邮箱
底部终端式签名：$ whoami · 匠心之作
背景十字线装饰图案
9. 交互增强
自定义光标（Custom Cursor）
自定义滚动条（Custom Scrollbar
HTML5 + CSS3（CSS 变量主题系统）+ Vanilla JavaScript（Canvas 粒子引擎 + IntersectionObserver + RAF 动画循环），零框架、零构建工具，两个自包含 HTML 文件构成完整的个人数字纪念碑。
评论