iOS 10 设计细节 — 对比篇

iOS 10 的设计细节对比。

自 iOS 7 将系统整体的「拟物化设计」风格转变为「扁平化设计」后,这几年苹果在系统迭代的过程中并没有对 UI 进行过多少大幅度的修改。而正如苹果所说的「十分重大」那样,iOS 10 不仅新增了许多功能,在设计方面也下了不少功夫。在使用了一段时间的 Beta 版后,我想挑选 iOS 10 中的一些设计细节,并与 iOS 9 对比来进行讲解。

地图

地图可以算是 iOS 10 中 UI 变化最大的地方了,在 WWDC 中它的许多新功能也作为了重点来介绍,但对于它的用户界面来说并没有做过多陈述,所以这里将会重点对它进行分析。

打开地图 App,最大的感受是常用的搜索框从上侧移动到了下方,并且「历史搜索 / 路线」被放在了搜索框的下面,只需要像 Control Center 那样向上滑动就可以看到更多内容,而反之地图则会以全屏幕显示。这样一来,用户在屏幕上方进行操作的频率就少了很多,相信这也是 iOS HIG 未来的发展趋势。

另外,iOS 10 的地图在固定模式(即地图不会随着手机所处的方位而旋转)下,会在蓝色的定位点周围标记出正北方向,对于喜欢将地图固定来查看位置的人来说,这是一个比较实用的功能。AQI 以及天气信息也被集成到了地图 App 中,能够给出行的用户提供参考。

在对某个地点进行查询时,两者的显示方式也有很大的不同。iOS 9 是将该地点用大头针进行标记,在上方写明名称、评分并提供了导航按钮,如果需要查看详细内容的话是需要点击才能看到的。而在 iOS 10 中,大头针的样式被替换成了该地点所属类型的 icon,详细信息被放置在了下方,只需要向上滑动就可以查看,非常方便。

用过 iOS 9 导航的人应该会觉得在开始导航前的体验有些不尽如人意,比如出行方式的切换按钮被放置在了屏幕的上方,对于大尺寸设备来说点按会比较麻烦;而在 Transit 模式下,切换路线则需要点击右侧的「More Routes」,且误触的机率很高,「出发时间」的设置更是需要经过三个页面才可以看到。

在 iOS 10 中,这一功能获得了很大的改善。出行方式都被放在了底 Tab 栏上,而且还新增了「打车」的出行方式。需要查看更多的公交方案只需向上滑动,切换「起始地点」与「出发时间」的入口也一目了然。

导航过程中,iOS 10 的界面设计也得到了很好的改善。反观 iOS 9,首先是屏幕顶部的一串信息,由于与数字有关的信息过于多地被放在了一起,在查看时会显得有些凌乱;其次,iOS 9 在导航界面中是没有办法手动托拽地图的,必须点击右上角的 Overview 才可以显示整个线路的预览,而在 iOS 10 中,导航地图则可以像平时那样拖动,而一段时间无操作后它又会回到当前的位置。

这里还有一个小细节,iOS 10 中导航界面上侧的线路指引使用了深灰色的背景,这样其实可以更加突出指引的内容,驾车中能使司机不像 iOS 9 的纯白色调那样被导航界面分散注意力。

导航过程中,iOS 10 的界面设计也得到了很好的改善。反观 iOS 9,首先是屏幕顶部的一串信息,由于与数字有关的信息过于多地被放在了一起,在查看时会显得有些凌乱;其次,iOS 9 在导航界面中是没有办法手动托拽地图的,必须点击右上角的 Overview 才可以显示整个线路的预览,而在 iOS 10 中,导航地图则可以像平时那样拖动,而一段时间无操作后它又会回到当前的位置。

这里还有一个小细节,iOS 10 中导航界面上侧的线路指引使用了深灰色的背景,这样其实可以更加突出指引的内容,驾车中能使司机不像 iOS 9 的纯白色调那样被导航界面分散注意力。

想要了解地图的更多内容,可以阅读我的这篇文章:具透丨iOS 10 中的原生地图 App,和以往大不一样

相机

相机界面唯一的变化是,「滤镜」与「切换摄像头」按钮的位置进行了对调。相信苹果也应该发现了切换摄像头的频率远高于滤镜,而越来越多的人喜欢使用 Instagram、Snapseed 等 App 来进行后期修改也是使得苹果做出这一决定的原因。

分享

「分享」页面将原来每个按钮的间距都调低了,就分辨率为 1136×640 的 iOS 设备来说,能够容纳的 icon 从 3.5 个提升至了 4.125 个。

快速回复

iOS 9 的「快速回复」功能只能查看一位发件人的一条讯息,如果在你回复时这位发件人又发送了几条讯息,你是无法看到的;另外在 iOS 9 中,当你输入完毕时是需要点击右上角的按键才可以发送的,使用时经常会因为误操作而关闭了刚刚编辑好的讯息。在 iOS 10 上,这一功能得到了明显的改善。

秒表

除了 iOS 的秒表在向左滑动后多了一个类似于 watchOS 表盘风格的秒表设计外,苹果将第一次 Lap 的时间也放到了下面,这样设计的原因应该是为了方便「表盘」视图下的计时。

AirPlay

从 AirPlay 诞生时的 iOS 4 时代开始我就在想,一个用户究竟是要有多少台 AirPlay 设备,才需要让切换窗口占满整个屏幕。这样的设计对于 3.5 英寸的设备来说确实是一种更好的办法,可一直到 5.5 英寸的设备出现时,苹果也没有考虑过 AirPlay 切换窗口的问题。好在 iOS 10 中这个问题终于被解决了。自从音乐的 Control Center 与其他功能分开了以后,AirPlay 的切换窗口也被集成到了这里。

总结

通过上面这些举例可以发现,苹果在极力减少用户点击屏幕上方的次数。相信苹果也意识到了轻点两下主屏幕按钮的「便捷访问」功能对于大尺寸的设备来说,并不是一个好的解决方法。而许多「历史遗留」的陈旧设计也终于被苹果挖掘了出来,除了以上说到的这一些细节以外,很多内建 App 也在 iOS 10 中进行了重新设计,「十分重大」一词也并非无稽之谈。以上只是在 iOS 10 的很多设计细节中挑选了一些来讲解,并没有介绍太多主要功能。如需了解更多设计方面的内容,欢迎移步苹果最新发布的 iOS Human Interface Guidelines 页面