AOVIS 设计系统索引
这份文件是 AOVIS 前台站点的本地 AI 可读设计参考。 它的作用是让编码代理和 UI 工具在修改界面之前,先索引当前产品的视觉风格和支持入口规则。
参考来源:
- 受公开的
VoltAgent/awesome-design-md集合启发 - 与当前 AOVIS 前台保持一致,而不是通用模板
产品身份
- 品牌:AOVIS
- 当前子品牌:NEXA
- 风格:高端消费电子电商、编辑型留白、干净白底、板岩灰中性色、克制的青绿色点缀
- 不要把前台改成卡片墙或仪表盘式布局
- 保持当前以产品为中心的结构和视觉层级
视觉方向
- 使用充足留白和清晰的分区
- 保持产品图像足够突出
- 使用圆角,但要克制
- 用轻微阴影和浅边框替代重面板
- 保持界面安静、现代、可信
- 避免不提升理解的装饰性动效
排版
- 标题保持粗体、可读、编辑感强
- 正文在手机和桌面上都要易扫读
- 标签要简洁、偏行动导向
- 支持页避免过度花哨的字体
按钮和链接
- 主 CTA 要清晰、直接、以动作驱动
- 次级操作的视觉权重要低于主 CTA
- 支持按钮要足够大,适合触控
- 所有交互元素都要保证可访问对比度和可读性
支持和联系规则
- 网站主支持动作是 Chatwoot
- 主支持按钮优先使用
Chat with Us或Get Support - 如果按钮跳转到支持中心页面,就标为
Support Center support@aovis.us作为次级兜底和小字号联系选项- 有 Chatwoot 时,不要把 email 放在主支持 CTA 上
- 隐私、DMCA 和法律邮箱保持独立用途和独立路由
支持 UX 约束
- 支持页要优先给出最快的帮助路径
- 网站 widget 应该始终是第一互动支持渠道
- 帮助中心页面仍然可以提供 FAQ 和文档
- 不要增加额外的支持导航行或重复支持入口
- 调整支持入口时,要保持现有前台风格
要做
- 支持入口标签保持简短明确
- 联系层级保持:Chatwoot 第一,支持页第二,邮件第三
- 复用当前 AOVIS 的配色和间距系统
- 支持兜底文案保持小字号和低存在感
不要做
- 不要重做首页
- 不要把整个支持系统换成新的信息架构
- 有 Chatwoot 时,不要把 email 放在它前面
- 不要引入新的、卡片很多的支持界面
- 调整联系 UI 时,不要碰其他业务流程