上一轮重构解决的是架构问题:博客、研究、教程、工具和游戏有了统一的内容注册表,也有了可重复执行的静态生成流程。
这一轮解决的是识别度问题。keplace.top 不应该只是一个干净的内容列表,它还需要有自己的性格:更 Geek、更炫酷、更像一个持续运行的个人控制台。
Tiger 作为主符号
新的视觉系统把 🐯 设为全站 logo。它不是装饰性的贴纸,而是站点的品牌锚点:
- Header 使用 Tiger mark 和电路化 SVG 外框。
- Hero 区域使用 Tiger HUD、扫描线、节点和轨迹动画。
- favicon 使用 🐯,让浏览器标签也保持一致。
- 导航、卡片、标签和工具入口都加入 emoji 与 SVG 双重识别。
风格原则
这次升级的目标不是单纯变暗或堆渐变,而是建立一个可长期维护的视觉语言:
- 黑底作为舞台,青色、橙色、粉色和荧光绿作为状态信号。
- SVG 负责结构感:电路线、雷达、节点、终端、工具和游戏图标。
- CSS 动画只做轻量增强,避免引入前端框架或构建依赖。
- `prefers-reduced-motion` 保留降级路径,避免动效影响可用性。
- 内容架构不变,视觉迭代不破坏路由、RSS、sitemap 和部署边界。
为什么仍然保持静态生成
炫酷不等于复杂。这个站点现阶段最重要的能力仍然是低成本、可审计、可回滚。
因此我没有引入新的前端框架,而是在现有 Python 生成器里升级模板和样式。这样做的好处是:
- 新增文章仍然只需要写 Markdown。
- 工具、游戏和研究报告仍然通过 `content/registry.json` 分发。
- 构建命令仍然是 `python3 scripts/build_site.py`。
- 校验命令仍然是 `python3 scripts/validate_site.py`。
- 线上部署边界继续保持清晰。
后续方向
接下来这个视觉系统可以继续演化成更完整的个人平台设计语言:
- 给工具和游戏增加独立的运行状态徽章。
- 给系列页增加时间线和依赖图。
- 给研究报告增加主题级封面和阅读进度。
- 给内容注册表增加 `visual_theme` 字段,用来控制不同资产的视觉强度。
- 在不牺牲静态部署稳定性的前提下,引入更丰富的局部交互。
这次升级的核心判断是:keplace.top 既要像博客,也要像实验室;既要能长期沉淀内容,也要一眼看出这是一个属于自己的系统。