看哪里 看信息的层级:大数字和涨跌在最上面,趋势图占最大面积,排行用横条长度表示。切换「7 天/30 天」,数字和曲线一起变化;在曲线上移动鼠标会显示当天的数据。手机宽度下侧边栏收成顶部图标
这是什么
仪表盘界面把最重要的数据集中在一屏:左侧导航,顶部时间范围筛选,第一行是几张大数字卡片(KPI),下面是趋势图和排行。NN/g 指出,好的仪表盘利用人一眼就能感知的视觉属性(位置、长度、颜色),让用户不必逐个读数也能看出变化
也叫数据看板后台界面管理后台Admin Dashboard仪表板
关键特征
- 缺了就不像
- 侧边导航顶部大数字卡片趋势图占主位
- 加了更像
- 时间范围切换悬停数据提示排行进度条浅色描边卡片
容易混淆
- Bento 网格Bento Grid
Bento 用格子展示个人信息和功能;仪表盘的格子都是数据,并且可筛选
- 科幻界面FUI / HUD
科幻界面的数据是装饰;仪表盘的数据要能准确读出来
仪表盘界面Dashboard UI
左侧导航、顶部筛选,数字卡片和图表排成一屏,一眼看完关键数据
你可能会说
- 后台那种一堆数据卡片
- 左边菜单右边图表
- 做一个数据看板
适合用在
- 创作者后台、店铺和课程的数据页
- SaaS 产品官网里的界面展示
- 视频里讲数据增长、复盘时的画面
这样描述给 AI
做一个仪表盘(Dashboard)风格的创作者后台首页:浅灰蓝 #f6f7fb 背景;左侧 168px 白色侧边栏,顶部是 Logo,下面是带图标的导航项,选中项浅紫底紫字;主区顶部是页面标题和「7 天/30 天」分段切换;第一行三张白色圆角数字卡片,显示粉丝、播放、约拍询价和绿色涨幅;下面左侧大块是紫色面积折线图,悬停显示当天数据,右侧是热门作品排行,用横向进度条表示热度;卡片用 1px 浅色描边代替阴影,数字用等宽数字