从交互设计的角度,看iOS11的5点不足

提前下载了开发者版本的iOS11体验了大半个月,除了很耗电、手机很烫以外,道长打算从交互设计的角度去浅析一下个人对iOS11部分交互以及可改进的地方,为了避免篇幅过长,所以只挑几点出来讲。


提前下载了开发者版本的iOS11体验了大半个月,除了很耗电、手机很烫以外,道长打算从交互设计的角度去浅析一下个人对iOS11部分交互以及可改进的地方,为了避免篇幅过长,所以只挑几点出来讲。

从交互设计的角度,看iOS11的5点不足

一、WP风格的标题栏及导航条功能

从交互设计的角度,看iOS11的5点不足

熟悉WinPhone(以下简称wp)交互风格的同学都知道,这种设计方式是wp一直推崇的,wp的风格就是标题左对齐并很大,不过它的UI界面操作是在底部浮动着,这个主要是跟硬件特性带来的操作习惯有关,另外本身wp自动的物理操作按键是在底部,所以iOS11这次这个改变道长个人觉得还是考虑没那么周全。

1、普通导航条

从交互设计的角度,看iOS11的5点不足

iOS11的页面操作功能还是在导航条上面,用户往上滑动页面时,大标题会隐藏、导航条的中间会把标题按照iOS7以后的显示方式显示居中,首先动画过度上来说还是蛮奇怪的,其次是会显得大标题多余,破坏UI整体性。可以改如下图:

从交互设计的角度,看iOS11的5点不足

改进:上滑时大标题导航条在左边变小,返回按钮依然在,另二三级后页面如果没有左右滑动切换页面造成冲突的情况下,统一考虑采用左滑返回上一级页面。

2、不统一的大标题+tab标签导航条

从交互设计的角度,看iOS11的5点不足

比如导航条里面有分tab标签的情况,iOS11就是不统一的,我们首先抛开说是tab导航条是包含于或不包含于大标题导航条的场景,更何况在最近通话和我的消息这两个场景里面,tab标签是大标题的分类,而iOS11却不统一。

改进:tab标签在大标题导航的下面,向上滚动时大标题变小,tab吸顶。

3、导航条功能的不统一

从交互设计的角度,看iOS11的5点不足

看两个界面里导航条的功能,个人收藏这一帧里的“添加”功能在左边,“编辑”功能在右边,而短信的却反过来,添加在右边,编辑在左边,同样是一级页面,承载相同能力的功能入口却放置在相反的位置,我考虑了不同的场景或可能性,但还是觉得很奇怪。

改进:统一“添加”在右边,“编辑”在左边。

二、Appstore里面不能统一的“返回”

从交互设计的角度,看iOS11的5点不足

Appstore的改变很大,业务上改最多,但在交互上,不得不提的是第一帧“今天”的APP详情页面,如上图一,想要返回到一级页面有两个操作方法,第一个是点击右上角的关闭按钮,第二个操作方法是长按界面向下拉一定距离后松开,则回到上一级页面。

而在App这一帧点击到某个APP的详情页面后,返回上一级页面的两个操作方法分别是点击导航条左边的“返回”按钮或长按页面向左滑动一定的距离。

改进:统一点导航左上角的“返回”按钮和长按向左滑动一定距离后返回上一级,下拉一定距离放开返回这个方案看起来不错,但很多页面都是需要下拉刷新的,而在物理动作上面,这两个会造成冲突,所以舍弃掉长按下拉一定距离放开返回上一级的操作。

三、3D touch真的那么好吗?

从交互设计的角度,看iOS11的5点不足

改动最大的这个地方,全都支持3D touch特性,使劲长按后弹出更多的操作界面,首先不讲这个界面看起来有多乱,苹果可能也考虑到不支持3D touch的机型怎么处理,所以就在调整屏幕亮度和调整音量的两个操作上面兼容了轻轻长按也能上下滑动来调整,而使劲长按(3D touch)是跳转到一个新的界面去,在这个页面用户有事轻轻的长按来调整亮度或音量大小。

讲真3D touch好费力啊。

那么像“长按”这么省力的交互手势真的比3D touch差吗?我和身边的小伙伴争论加“似乎达成共识”后觉得,长按和3D touch唯一能解决的问题是——在桌面上长按图标会触发的结果是icon上有删除按钮,而使劲长按能出快捷方式,所以我个人感觉这个3D touch真心没那么好。我们看一个长按的例子:

从交互设计的角度,看iOS11的5点不足

长按真的可以做很炫酷的事情啊,比如UC浏览器在新闻详情页面长按出现的“老罗大爆炸”功能,轻轻长按和使劲长按(3D touch),你选哪个?

#专栏作家#

芒果道长,人人都是产品经理专栏作家,起点学院特聘导师。腾讯课堂【30天教你做一个APP】作者。

本文独家首发于人人都是产品经理,未经本站许可,不得转载。

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/20729/

(0)
CatherineCatherine
上一篇 2017-08-04 09:24
下一篇 2017-08-04 10:25

相关推荐

  • 交互设计师修炼指南!教你从零开始成为优秀交互设计师

    本文全系列满满干货,是从众多交互设计前辈们分享的宝贵经验里挑选出的最实用的方法,不仅能让你彻底了解交互设计,还能帮有志在这个领域发展,却苦于没有老师的童鞋,从零开始学习成为一名优秀的交互设计师。 在校…

    2016-02-26
  • 交互设计9种交互状态的设计

    现在的UI设计团队通常先设计组件,多数界面几乎就是各种组件的结合。这会在用户的“异常路径”上留下不容小觑的断档。由于我们构建的是整个系统,而非几个页面,我们必须投入精力打磨这些常常被忽略的状态的设计,创…

    2015-11-09
  • 成都UI-UE交互设计免费试听课了解一下!

    周一见!周一见!周一见!没错下周一!成都UI-UE交互设计免费试听课开课啦!与其宅在家里浪费时间不如来体验一下UI设计前五天免费试学4月16日--4月20号机会有限,先到先到得哦!UI-UE交互设计是什么?UI-UE交互设计就是指对产品的人机交互、操作逻辑、界面美观的整体设计!为什么要学习UI-UE?人才需求旺盛,成IT行业职位新宠人才缺口大,行业势头发展迅猛虽然UI这么好,但是不仅对人才的需求大,要求也越来越高,所以,培训,是提高水平...

    2018-04-17
  • 从京东注册优化谈如何做到细节设计

    作者: 厚江   京东注册优化是来京东后第一个相对完整的设计项目。毕业后初涉交互设计工作,导师对我的第一个要求就是在设计过程中,重视对细节的设计。本文即从京东注册优化项目的一些方面谈谈对细节设计的体会。 …

    交互专题 2017-08-07
  • Axure RP软件

    长按链接复制链接到浏览器打开Axure RP 7.0软件及安装教程下载地址:链接:https://pan.baidu.com/s/1mkqu1Ws密码:467u长按链接复制链接到浏览器打开Axure RP 8.0软件及安装教程下载地址:链接:https://pan.baidu.com/s/1c3h7c1i密码:esqr给大狮兄一个赞赏大狮兄想生存下去,我还想以后给你更多好用的软件赞赏的狮粉记得备注名字,大狮兄想记得你的名字大狮兄资源吧专...

    2018-03-04
  • 交互设计 ▏如何在作品集中展现自己的设计风格和思考过程?

    交互设计是对于用户产品使用行为的优化设计。它关注的是“用户场景”和“用户心理”,设计的对象是“用户行为”,达成的目标是“能用、易用、想用”。作品集其实是一个人设计风格和思考过程的折射,一个好的交互设计作品集需要在作品中展示你解决了什么问题,如何解决的,以及最终成果。今天小编给大家带来了一位学姐的交互设计研究生作品集,希望可以给大家带来一些启发啦!!!学姐的作品集中一共有3个项目,分别是项目1:Wish项目2:RT: BAGS项目3:FI...

    2018-04-22
  • 想成为高级交互设计师?这是我的5个经验总结

    Echo :交互设计师真正提高的标志是思维思想上的提高,而非专业技能的提高。

    2017-10-16
  • 淘宝UED的设计流程

    国内知名 UED 团队的设计流程是怎样的? 淘宝 UED 的设计流程图 <img src="https://pic4.zhimg.com/75bcc954c5e1695eeeeb1710eb62c947_b.jpg" data-rawwidth="4000" data-rawheight="1678" clas…

    2016-06-01
  • 在设计项目中,用好小图标的七个技巧

    图标是设计项目中几乎必不可少的一个组成部分,但是在图标的具体使用上,讲究并不少。

    2017-05-10
  • 交互设计师,如何建立自己的知识体系?

    高中毕业,我们完成了基础知识的学习。后续要掌握新技能或新知识,主要途径便是自学。每个人自学能力千差万别,这决定了一个人的成长与发展的天花板。

    2017-05-16