一步步拆解设计决定
- 01
先排信息顺序
先识别任务,再理解说明,最后决定是否执行。把这个顺序写下来再改样式。
- 02
减少争抢
降低辅助信息的视觉重量;不靠把字缩到看不清来实现。
- 03
只留一个主操作
“开始专注”获得强调,其他动作保持次要。
- 04
检查边界内容
标题变成两行时,操作仍在内容之后,不使用绝对定位。
把规则带进代码
IMPLEMENTATION NOTE
.task-title { font-size: 1.5rem; font-weight: 650; }
.task-meta { color: var(--text-secondary); }
.task-actions { margin-top: 1.5rem; display: flex; gap: .75rem; }