spectra-lab/DESIGN.md

Spectra Lab 设计语言

关键词

• future luxe
• spectral glow
• glassmorphism
• editorial typography
• cinematic depth
• interactive gallery

视觉原则

1. 黑底 + 彩色光谱高光
2. 大标题排版要有海报感
3. 卡片不做普通 SaaS 面板，要像展馆展签
4. 动效要柔和、缓动、分层，不要廉价弹跳
5. 让页面每一屏都有明确主角

首版结构

• 顶部导航：极简悬浮
• Hero：巨大标题、动态背景、主 CTA、次级信息
• Live Metrics：用设计化仪表呈现虚构实时数据
• Scene Gallery：三到四个主场景卡片
• Manifesto：更情绪化的品牌段落
• Footer：简短收束

动效策略

• 鼠标跟随高光
• 轻量视差
• 背景网格缓慢漂移
• 卡片 hover 的透视和边缘发光
• KPI 数字缓动增长

响应式原则

• 桌面端强调沉浸和横向层次
• 移动端保留光效，但结构收成单列
• 保证标题、按钮、卡片在窄屏仍有冲击力