iOS和Android规范解析:警告框(Alerts)

2017-04-06 08:49
四大新闻-科技
 
iOS和Android规范解析:警告框(Alerts)

在iOS的设计规范以及Android的MD规范中,都有警告框(Alerts)这个组件。笔者研究了这个组件,发现在两种系统中,它们有以下两个共同点:

1.都出现在页面的中央且自带蒙层;

iOS和Android规范解析:警告框(Alerts)

iOS和Android警告框

2.警告框的选项通常是两个,且应避免“是/否“这样的选项,选项应明确告知用户操作的结果。

在其它方面,两种规范都存在着各自的特点。下面我们来一起探究一下。

Google Material Design

先来说说设计师相对不熟悉的Android。MD规范对于警告框的定义是这样神儿的:

警告框是一种紧急的打扰(提示),以告知用户一个发生了的情况。

需要注意的是,警告框和之前提到的snackbars都是在用户进行操作之后出现的提示框,那么同样是提示框,他们出现的时机有什么区别呢?警告框可以看作是操作的确认,可以理解为操作的“最后一步”,只有当用户点击了“确认”按钮这个操作才算是真正完成;但snackbars是当用户真正操作完了之后才出现的提示信息,其信息的重要程度比警告框要低。另外,在很多情况下,snackbars会有“撤销”按钮,留给用户反悔的余地。

MD规范把警告框分成两种:有标题的和没有标题的。

MD规范认为大多数的警告框应该都是没有标题的,用一到两句描述一个告知决定的文案。在写这句文案时,有两点需要注意:

  1. 使用疑问句,例如:“删除这个对话?”
  2. 文案与警告框中的按钮文案要相关联

按钮的文案,应告知用户操作的结果。尽量避免使用“是/否”这样的文案。如下图:

iOS和Android规范解析:警告框(Alerts)

左边的警告框,按钮文案“删除”明确地告知了操作的结果;右边的按钮文案,回答了上面“删除草稿吗?”这个问题,但是没有告知操作的结果(其实也就是告知的不直接),所以不被建议使用。

对于有标题的警告框,MD提出,“只在高风险的操作时使用(如,操作将导致网络失去连接)”。并且,用户通过标题和操作按钮,就应该能明白是在做什么选择。

对于标题,需注意以下两点:

  1. (与无标题的Alerts一样)使用询问操作的疑问句,例如,“清除USB存储内容?”
  2. 避免道歉或者有歧义的问句,例如,“警告!”、“你确定吗?(Are you sure?)”