登录 立即注册
安币:

安卓巴士 - 安卓开发 - Android开发 - 安卓 - 移动互联网门户

查看: 1254|回复: 7

Android P & iOS 12 交互动向【Bus Weekly】105 期

[复制链接]

179

主题

168

帖子

6293

安币

管理员

Rank: 9Rank: 9Rank: 9

发表于 2018-7-2 15:11:27 | 显示全部楼层 |阅读模式
一、发展更丰富的交互形式
移动终端在去固键的道路上越走越快。为了实现在大小各异的屏幕上完成不同功能的切换、唤起,在早先的版本的基础上,更灵活和多变的手势交互得到强化:点击、双击、长按、拖动等。
此次更新Google UI给出的范本中下面的3个固定按钮消失了,取而代之的是几乎和iOS一模一样的小短横,这个变化留给锁屏手势更多想象空间。除了屏幕内的手势翻新,更多的屏幕外手势被运用,比如:Android P让你翻转手机就能进入勿扰模式。
3425f1ef64e44f03993a1c8ad98f3c0f.jpg

除了滑动手势更加频繁出现外,Google更加关注在声音交互上的探索: 无障碍功能支持为「通知/响铃」和「触摸反馈」分别设定不同的震动强度。
前者不必多说,后者几乎会影响所有与触摸操作相关的震动反馈手感,比如:屏幕导航按键、虚拟键盘、指纹识别传感器等等。

二、深耕更细腻的微交互
连续升级了诸多版本后,基本的设计逻辑和架构成型,除了补充因为技术进步带来的新功能和场景,丰富完善基本交互组件、模块外,Google和Apple开始在设计上,探求更细致周到的交互转场和动效逻辑。
对于用户来说,微交互提供给了用户直观的反馈和心理预知,同时传递了某种微妙的状态。
“微交互之所以会起作用,是因为它引起了人们总是想了解更多信息的原始欲望。用户在进行某个操作后能瞬间得到视觉上的反馈,这会让人充满继续操作下去的欲望。微交互也可以用来引导用户进行正确的操作。”
  • 即时反馈——视觉反馈符合用户的本能预期,它的存在让用户明白,他们的操作被用户接受;
  • 促进互动——微交互本身就在鼓励用户进行交互,它能够指引用户,教育用户,让用户明白如何使用;
  • 带来愉悦感——微交互本身就是呈现完美体验的良好时机。

相比早些时候不成体系、着重炫技的动画来说,新体系下的交互在探索通过大到场景切换、中到区域加载、小到按钮或icon变化等方式,同时起到引导和明确通知等明确的作用。更多与业务逻辑相关的嵌入式微交互,值得设计师们不断探索和创新。
Dan Saffer提出:
“最好的产品通常会做好两件事情:功能和细节,功能能够吸引用户关注这个产品,而细节则能够让关注的用户留下来。”
典型的习惯环路是由3个要素组成的:
  • 提示——触发交互的提示;
  • 执行——跟着提示的内容,用户执行对应的操作;
  • 奖励——完成操作,用户获得相应的奖励。

高效而有趣的微交互,涉及触发器、规则、循环和模式,从而通过逐渐培育用户习惯让他们留下来。
常见的微交互形式:
全局场景
典型:视差滚动
1db754a1edb347cda06cec6ad2af7322_看图王.jpeg

77dcc5ec90254bb99ff9b3d41624daa5.jpg

2. 色彩
典型:渐变色
d3982681a3db44188e0c85199388e29d.jpg

3. 形状
典型:大小、位置变化
1703fcaf08644b2886ea5d738150fd53.jpg

4. 局部功能性动画
典型:按钮、状态等实时变更
Android p的锁屏痕迹在手指划过的刹那消失,这个极小的交互细节很巧妙的化解了用户的安全焦虑。
34a72e4154734aa387b48800693795bc.jpg

三. 转向更年轻热烈的视觉表现
多彩的颜色、自然舒畅的动效、流畅的线条都预示着接下来依然会朝着年轻活泼的视觉变现方向发展。
Android P中黑、白、灰三色风格逐渐被更活波的色彩取代。快速设置面板开关被加上了蓝色背景,系统设置界面则变为颜色各异的圆形背景。
240f9110928a4b8f99a03692c93bd39b.jpg

Android P的全局动画中最能带来直观感受的应该是返回、窗口切换和点击三种动作的动画效果,比较之前的机械运动新的动效更加自然流畅。
9060305b67e94c36b36453cf1acd2e42.jpg

d5f05f4bdc444b67bdd317ca6b8db2c4.jpg

Android P中更多的圆角取代方角成为主角,某些地方甚至能明显感觉到与iOS的相似性。快速设置面板变成了一张大面积的圆角卡片,快速开关则以圆形蓝色背景图标的形式分布其上。
77612e8e898e453c8c65e22e20b9318e.jpg

d95d8860703145d983d9c55aed83735c.jpg

四、树立模块化与组别化意识
继Android加入通知分组后,iOS12也加入了通知分组功能。原有的同一app消息提示在锁屏上都是分开显示,比如:你可能看到微信消息堆满了界面。新的系统中,来自同一app的消息被收编到一组中,节省空间、整洁页面。
除了主要文字信息之外,图片信息的组别化、精细化筛选也同样加强。iOS12 photo中通过对时间、事件、地点等组别化,可以存储上千种不同分类的图片。
131eef359379435baff9ec5b5501b32c.jpg

模块化组别化的概念最早是在工业设计中产生的概念,它的存在除了优化产品之间的层级关系外,也方便用户对已有高密度信息的统一和高效管理。分组的意义在于秩序化信息,而反向搜索的时候又能作用到快速定位到的图片。
iOS12及Android P对此概念的加强再次引导大家关注这一概念,因为用户的阅读惰性与可视化技术的进步,图片、视频等展示方式越来越普遍。
通过技术手段对这些信息进行加工、编码、标签化是不错的解决方式,同时交互应该关注对于模块化信息的嵌套展示、筛选结果的分类展示。
技术限制带来的准确性局限,也应被纳入交互设计中,通过引导、纠错、人性化话术等修正模块化展示是值得探讨的方向。

本篇内容主要回顾了iOS 12和Android P在比较具体交互场景中的应用。
开发者版本还有很多信息点值得挖掘,期待后续正式版的发布。
Android与iOS图片来自Google与Apple官方,其他图片来自Behance.com,图表为笔者整理。
来源:CtripUED



【Bus Weekly】105 期

【一周优秀博文】

Android应用瘦身,从18MB到12.5MB

Android App启动时Apk资源加载机制源码分析

技术解读美团外卖Android Crash治理之路!

Glide最新V4版使用指南

写给Android App开发人员看的Android底层知识(1)




【一周Android精品源码推荐】

RecyclerView侧滑菜单,Item拖拽,滑动删除Item,自动加载更...

android:ListView、RecyclerView两种方式实现聊天界面

基于Material Design的todo待办记事应用源码

RecyclerView两侧菜单功能、侧滑删除、 拖拽、根据type显示菜单

android在视频中加入广告预览效果源码

自定义基础掌握的16种模式示例图

使用React Native(Android和iOS)实现的 知乎日报效果源码

android实现高德地图轨迹效果源码

一款,整合百度翻译api跟有道翻译api的翻译君

RxEasyHttp一款基于RxJava2+Retrofit2实现简单易用的网络请求框架


111523hoclkl9bxvxk5yjq.jpg
安卓巴士官方微博链接

Bus Weekly回顾
安卓巴士菁英会会员招募中~
111523w9yhkh5ufqi9qhih.jpg

6

主题

9488

帖子

2888

安币

Android大神

Rank: 6Rank: 6

发表于 2018-7-2 15:12:32 | 显示全部楼层
楼主威武,以后多发干货,多办活动~!

20

主题

9214

帖子

2356

安币

Android大神

Rank: 6Rank: 6

发表于 2018-7-2 15:17:14 | 显示全部楼层
感谢分享,楼主V5~

475

主题

1104

帖子

5801

安币

手工艺人

发表于 2018-7-2 15:28:25 | 显示全部楼层
不错不错,楼主辛苦了。。。

0

主题

9459

帖子

1156

安币

Android大神

Rank: 6Rank: 6

发表于 2018-7-2 15:35:15 | 显示全部楼层
支持,感谢,祝巴士越来越好~

0

主题

9197

帖子

2075

安币

Android大神

Rank: 6Rank: 6

发表于 2018-7-2 15:40:05 | 显示全部楼层
支持楼主,支持安卓巴士!

501

主题

1157

帖子

2070

安币

手工艺人

发表于 2018-7-2 15:40:55 | 显示全部楼层
楼主威武,以后多发干货,多办活动~!

0

主题

27

帖子

261

安币

攻城狮

Rank: 3Rank: 3

发表于 2018-7-11 14:29:01 | 显示全部楼层
精华内容,楼主V5!
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

站长推荐

通过邮件订阅最新安卓weekly信息
上一条 /4 下一条

下载安卓巴士客户端

全国最大的安卓开发者社区
联系我们
关闭
合作电话:
15618560077
Email:
805941275@qq.com
商务市场合作/投稿
问题反馈及帮助
联系我们

广告投放| 广东互联网违法和不良信息举报中心|中国互联网举报中心|下载客户端|申请友链|手机版|站点统计|安卓巴士 ( 粤ICP备15117877号 )

快速回复 返回顶部 返回列表