DeFi仪表盘设计：青蓝色如何区分数据与操作

Ardentis的DeFi仪表盘设计把青蓝色放在曲线、选中项和主要按钮上，大部分底色保持接近黑色。总览先用大趋势和小金额卡说明范围，下方资产列表再提供具体对象。色彩统一，阅读密度却有变化。

核心结论

• 大趋势与四张摘要卡并排，整体变化和具体总量各有位置。
• 资产行把名称、数量、估值和动作横向对应，便于逐行查找。
• 市场与个人切换靠近图表，提交面板集中在右侧。

总览先给一个大的观看范围

Yield Overview占据左侧大卡，曲线下面铺很浅的青蓝渐变，当前点用圆形和浮动金额强调。轴线、刻度和其他资料都比较克制，读者容易先看到一段变化，再读到选中位置。

右边四张卡没有完全复制大图。抵押总量用进度线，借入总量用小柱，存入总量用小曲线，可领取金额旁直接放Claim。相近的外框把它们归为摘要，不同图形再表达各自内容。

界达设计认为，这种大小分配适合总览和明细同时出现的工作台。大图负责看变化，小卡负责找主题，但金额的账户、网络与时间范围仍需文字说明。图里的数值是展示内容，不能作为实际账户或收益结果。

明细的动作跟着一行对象

Earn列表把资产标志和名称放在左边，数量与美元值放在同一栏，管理者及动作继续向右排开。图标提供快速辨认，文字则把一行完整地指向某个对象。Deposit和Withdraw没有漂在列表之外，读者能看到它们属于哪一行。

代币数量和美元估值需要分别标明单位，管理者也应有清楚身份。这样的表格适合重复对象较多的后台，重点是行对应准确，再考虑局部图标多漂亮。若进入操作，确认摘要最好重复资产和方向，减少返回列表后重新判断的负担。

范围切换与操作面板是两种控件

详情页把Market和My position放在图表上方，周期下拉留在右上角。资产对名称位于页头，数据卡再排列总量与比例。读者从上往下能依次确认对象、数据范围和时间，比只看一个大百分比更有方向。

右側操作面板另用边框圈起，输入、Max、当前状态和长条主按钮都在这一列。浏览数据与执行动作的区域区别很清楚，是深色金融界面值得借鉴的安排。

不过，图中选中Repay/Withdraw时，输入与按钮仍写Supply及Borrow。建议先让标签、输入名称和提交动词一致，再补预计变化摘要。颜色能指出当前选择，却无法解释相互冲突的动作词。这里是对示例界面语义的检查，不讨论资产选择。

手机把卡片排成一条阅读线

移动版把摘要卡纵向堆叠，另一张手机则先展示收益趋势再接抵押总量。标题和青蓝图形继续沿用，卡片没有被简单缩成桌面里的小方块。

连接钱包、网络选择、设置和菜单仍在顶部。关键操作页可以进一步保留所选资产和方向摘要，让滚动时的判断依据不退到上一屏。现有图片只说明布局，连接入口旁同时出现金额，不能据此判断已经处于连接状态。

常见问题

深色数据工作台怎样使用强调色？

可以给曲线、当前选择和主要动作建立一致规则，再用标题与单位解释具体含义。强调色并不能替代范围与操作名称。

设计检查清单

• 核对资产行中的数量与估值单位。
• 切换Market和My position后检查标题与口径。
• 逐一比对选中标签、输入名称和提交动词。