今天是2019年5月20日,一个充满了爱意的日子,和朋友、家人互相问候了,表达了爱意,开始进入学习工作状态了。
看到星球的一个话题,关于按钮的使用场景以及设计样式,因此整理一下,为日后所用。
按钮无论是在移动端、网页端都是有重要作用的,最常见的反馈状态。
按钮使用的场景:
1.按钮的样式:
a.面型按钮 b.线型按钮 c.文字按钮 d.图标按钮 e.单选按钮 f.复选按钮 g.开关按钮
其中a/b/c/d可以互相组合使用
2.按钮使用场景
2.1面型按钮使用场景:用来触发页面的主要操作,一般比较醒目,位置比较明显。a.非常重要的操作,如购买,支付等;b.影响很大的操作,如注册、退出账号等。
2.2线性按钮使用场景:重要程度较高的场景(低于面型按钮),较重要,醒目、尺寸较小,有任务性。a.非任务型页面内的轻量级操作,如评价等页面 b.辅助与主任务的子任务操作,如发送验证码等。
2.3文字按钮使用场景:通常为辅助型操作、重要性低于面型、线型按钮。a.辅助型操作,如:编辑、添加等 b.需要用明确的文字内容表达的操作,避免歧义,如修改、添加等。
2.4图标按钮使用场景:通常为辅助型/惊喜型操作,一般低于面型、线型。 a.辅助型操作,如修改icon; b.惊喜型操作:如点赞。
web竞品使用:
1.微博采用的是icon+文字的形式,放在线框中,增强点击感,属于辅助惊喜型按钮;
2.YouTube采用的是图标按钮的方式,拓展性强,屏效高,属于辅助惊喜型按钮;
3.淘宝订单列表采用的是文字按钮,属于辅助型操作;确认收货采用面型按钮,属于需要用户执行的重要操作。
整理的第一篇,整理继续中......