恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
浅析android系统中的4大提示控件
0.0°
2017-06-16 原创文章 经验/观点 举报 3493 9 13 0

在安卓app的交互设计中,在不同的交互场景下,针对不同提示控件的使用总结,心得与注意事项。欢迎大家多多探讨与指点。

刚刚毕业任职于一家初创公司的小主管(从倒垃圾到修电脑什么都管),同时android小码农一枚。为记录自己的学习开始挖坑写文,记录自己的学习心得,分享自己的工作方法论。希望各位多多指点。


自己负责开发的是android App,目前采用android系统的原生控件做的UI在国内(墙内)已经不多见,但其实google设计的交互设计规范已经非常完备精确。这里从我的实际项目经验中重新为大家整理一遍android自带的原生提示控件用法与使用体会,就当抛砖引玉。


1. toast 我翻译成吐司框。这个控件的整套交互流程其实就和大家用烤面包机定时烤吐司的流程差不多,其本质上就是没有交互(不要打我),因为用户不需要也不能对其操作。


Image title

控件隐喻:不重要信息提示,仅传达,用户任务流无需打断,就算错过信息也不会对交互流程有太大影响。


关键词:快速,轻量,不中断,无交互。


使用注意:既然是一个暂态下的提示控件,根据人因工程的记忆有限原则,自然不能叠加太多且需要用户记忆的重要信息,这个控件不占据主交互的权重,是一个暂态。这点在google的原生设计上就提现的十分明显。半透明的颜色与短暂的弹出时间( 这里我很温馨地给各位不懂代码的设计师去找了源码,Toast有2种持续时间,分别是Toast.LENGTH_LONG(3.5秒)和Toast.LENGTH_SHORT(2秒) ),以上特征足以说明它的地位,避免过度去阻挡用户界面,传递简单的结果信息。


2. snackbar 我翻译成甜点框。这个控件作为material的新规范还是蛮多人关注的。从底部弹出并使用实色为底色,外加一个可选的交互按钮是其最明显的特征。


Image title


引用一下google的官方文档:“Providing lightweight, quick feedback about an operation is a perfect opportunity to use a snackbar.”


控件隐喻:从官方文档解读过来,就是提供轻量化,快速反馈,恰当时间来提供恰当操作机会的控件。轻量化和快速反馈想必大家都明白了,就是不中断用户的视觉轨迹,操作轨迹与任务流。这里我想探讨一下什么叫恰当的时间提供恰当的操作。

我在工作中喜欢把操作分为4大类。


第一种是终端全局操作,这种操作凌驾于一些应用之上,控制的目标是终端。比如我用back键退出了一个app,用menu键进入了一个2小时前用的app。终端为应用提供运行环境与载体,那么就不难理解终端服务凌驾一切。


第二类是应用入口操作,比如切换tabhost,拉出drawer等等,这些在应用内用户选择要进入的信息结构的操作都可以被认为是入口操作。而我们所绘制的页面,其实就是同类或不同信息结构的聚合。比如商品展示界面是商品这个信息结构的聚合,而可能也包括了一些优惠信息(优惠券和会员卡又是另外一种信息结构,程序上叫数据结构)。按照设计规范,入口操作应该是易发现的,而且是因人而异的。比如电商首页有搜索框也有分类按钮,这是因为不同诉求的客户需要浏览不同页面。


第三种是信息结构操作,对于一个信息结构(商品)又分2种操作,一种是永久操作,所谓永久你可以理解为,交互动作是这个信息永久持有的,只要信息存在,这个交互动作就一定应该存在。这种交互应该是自然的。比如点击一个商品图片进入详情,每个商品都有详情,也都允许消费者去查看对比。还有另外一种是对于商品的状态操作,商品发货了可以查看物流信息,而商品签收了才能评价。不同状态下我们的交互会发生改变,所以在恰当的时间去展示恰当的操作非常重要。


由此,snackbar诞生了,他的交互应该永远绑定触发他的交互,也就是说,触发snackbar的动作与snackbar上的按钮一定是有强关联的。比如我删除了一封邮件,邮件被删除这个动作触发了snackbar,snackbar上面的按钮可以让我撤销这个操作。这就是所谓的强关联(snackbar上按钮的交互行为,一定是我们触发snackbar交互行为的衍生)。这样既保证了这些重要操作不被隐藏而降低了可发现性,同时也可以帮助你的界面不出现按钮满天飞的情况。


关键词:快速,轻量,不中断,提供恰到好处的操作。


使用注意:不要设置一个以上的操作,仅显示最重要最直观的那个即可。同时注意因为和toast一样是一个暂态控件,用户的理解和操作时间其实是有限而有一定惯性的,所以在短时间,短提示的这种非主任务流交互环境下,不要放置“弹射座椅”操作(比如放一个全部删除按钮就不合适)。


3. 底部对话框bottomSheetDialog。你可以发现这个是对话框的升级版(搬家版),换了一个控件位置就当发布了一个新系统特性这个事情我已经司空见惯了。其实这个控件和dialog对话框还是有很多区别的,这些区别直接决定了他们的使用方式不同。


Image title


控件隐喻:不像dialog直接在整个屏幕的居中位置出现,还带有蒙层或是阴影这样简单粗暴地去占据(抢劫)用户的视觉焦点,底部对话框显然在交互的位置和方式上让用户更容易接受。和对话框一样的标题,内容,按钮,但却又更加接近用户大拇指的位置,使得这种交互更显然也更直接。


对话框的一般使用形式会占据更长的时间,因为这种打断任务流的交互其实会让用户的操作惯性直接“嘭”地一下撞碎。这好比在你考虑今天中午点寿司的时候,告诉你,我们有新版本哦亲你要不要下载一下呢?用户内心OS如下,有什么新功能,我会得到什么收益,我现在处于什么网络环境能不能下载,下载了我的空间能不能安装,我正要急着点外卖能不能先把这个东西弄走。。。


我们会把这种打断交互惯性的比较唐突功能用对话框来做,是因为它的天生突兀,让用户切换掉之前的想法集中精力思考做出反馈,这也就可以理解为什么一些确认的不可逆操作喜欢用对话框确认。


底部对话框在交互地位上没有那么唐突,反而是一种温和的提醒口吻。下载完成了你是要打开还是以后再说呢?因为信息简短,同时就当下的操作给予提示(浏览器下载),用户还处于这种操作环境下(浏览网页),自然会快速惯性交互。这也增加了整体的交互舒适度。


关键词:柔和,无需长时间思考的快速惯性交互。


使用注意:快速惯性操作不要加入“弹射座椅”操作。仅使用与主任务流的相关交互动作提醒,而非抢占用户注意力到其他地方。


4. 底部弹框popwindow。底部弹框最大的特征是,在这个弹框里面的每个操作的地位,指向后果都是一样的。没有建议用户选哪个,没有积极消极按钮的区别。这里我总结了底部弹框隐喻的两个一致。


Image title


控件隐喻:第一是地位一致,用户选择照片从相机选择还是从相册选择,其操作地位是一致的,我们不建议他选哪个,因为这个是用户自己决定的,自由度可以100%交个用户去处理。第二是动机一致,用户发出的动机,不管点击哪个按钮一定是能获得同一形式的本质结果。比如用户分享图片,分享到哪个社交平台本质上都是把图片传递到一个公共的空间供其他用户浏览评价,产生社交行为。


这种对话框多用于用户的途径选择,包括了应用的出和入,入指的是选择图片,文字,或联系人等等加入到主任务流,因为用户在产品的主任务流中我们需要他提供这些信息,但只要提供了信息我们根本不在乎那个途径来的。出指的是用户交互结果的出口,我们不在乎用户要分享到什么平台,要导出什么格式,对于我们产品来说,交互结果物(要分享的新闻,照片)都是不变的。


关键词:应用的出入口,分流选择。


使用注意:两个一致原则。

更新:2017-06-16

收藏

9人已收藏

珂珂就是珂珂

区块星球产品经理

  • 5

    作品

  • 12

    粉丝

  • 0

    关注

  • 云赞校园3.0.2 全新改版
  • 福利 | Final_Item列表项设计库源文件V1.0
  • 云赞校园V2.1改版
  • 云赞校园——高校赞助APP界面REDESIGN

    猜你喜欢

      2017-06-16 原创文章 经验/观点 举报 3493 9 13 0

      浅析android系统中的4大提示控件

      0.0°

      你确定要举报浅析android系统中的4大提示控件

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2017年06月15日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      13
      9
      0

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录