Challenge
挑战
官网需要准确说明工作室是谁、首个产品做什么、当前进展如何,并让访客能够找到真实内容和有效联系入口。
Approach
做法
A-01
按内容域组织信息
工作室、产品与作品分别维护内容,页面按真实业务关系组合,避免同一事实在多处自由发挥。
A-02
复用同一套视觉语言
玉绿与晨雾色、衬线标题与正文层级由 Token 统一承载,后续页面复用现有结构而不是重新发明样式。
A-03
Inline SVG 与 CSS 动效
LivingBloom 使用 inline SVG 绘制、CSS keyframes 驱动,不引入动画库,并支持减少动态效果设置。
A-04
静态化与分享信息
页面运行时字体自托管,配套 metadata、sitemap 与 OG 分享图;OG 生成过程仍需获取字体资源。
Outcome
当前交付
- 首页、产品、作品与博客均支持静态生成和独立分享信息
- 以真实桌面与手机截图记录主要设计版本
- 为后续真实作品提供可复用的内容结构
Tags
#品牌网站#设计系统#工程实践
Screens
成品展示



