设计语言

信息有秩序,数据有重点。

ATHLOS 的官网设计只服务产品理解:黑色建立专业感,白色保证阅读,蓝色留给操作、趋势和关键数据。

01

清晰的信息层级

标题负责判断,正文补充依据。

02

克制的色彩策略

黑白构建结构,蓝色只给关键动作。

03

一致的交互体验

控件、状态和反馈保持同一套规则。

ATHLOS 设计体系面板

01 黑色承载专业感

黑色降低视觉噪音,突出内容本身。减少干扰,让数据与信息更具说服力。

02 蓝色只给关键动作

蓝色用于可点击、趋势和关键数据,帮助用户识别行动与变化。

03 截图负责证明能力

真实的产品截图传递信息密度与功能深度,让用户在第一时间建立信任。

Design System

官网先展示能力,再解释原则。

页面语言必须围绕真实工作流:赛训计划如何建立,数据如何进入报告,报告如何支持教练决策。设计原则只帮助信息更清楚,不抢产品截图的主角位置。

ATHLOS 2026 年 4 月日历界面
ATHLOS 全队数据报告界面
01

黑色承载专业感

官网以黑色为基础,让截图、图表和数据成为视觉重心。

02

蓝色只给关键动作

按钮、当前状态、趋势线和重点数据使用蓝色,减少无意义的装饰色。

03

文字服务判断

标题短,正文直接,避免抽象口号和无法落地的设计描述。

ATHLOS 跑动分析报告界面

报告页给结果,管理页给可信度。

客户会被专业报告吸引,但最终会判断系统能不能在球队日常里运行。ATHLOS 官网必须同时证明两件事:数据报告足够清楚,后台流程足够真实。