iOS 11 vs 10: UI和交互全面对比分析

苹果早在6月份的WWDC全球开发者大会中介绍了iOS 11系统，9月咱们终于收到了正式版的更新推送。经历了11代的大版本更迭的iOS依旧保持着活力与进步。跟手上用了一年的iOS 10相比，iOS 11在UI和交互上有什么特别的改变呢？下面让咱们一块儿来看看。(左边iOS 10，右边为iOS 11）

主屏幕

左上角的导航有了明显的改变，从小圆点变为了经典的信号格模式，底部的Dock也去掉了APP的名称，应用名称字体加粗，相对更清晰易阅读。

 

 

 

控制中心的调整是iOS 11的最大亮点之一，用户能够自定义经常使用的功能块，而且能够经过3D Touch来调整亮度和音量，控制条也从横向变为竖向柱状，节约了控制中心的面积，布局更为合理，让人耳目一新。

图标icon

 

有十个左右有较大改动的图标分别是：地图、应用商店、时钟、相机、设置、通信录、提醒事项、音乐、通信录、备忘录和计算器等。其中地图、时钟、相机和通信录的改动都是比较人性化和正常的，还有一些图标的改动相对较大。

 

经典的App Store图标发生了重要的变化，本来的笔和尺子表达的是“工具”的本质，现在新的icon变为了三根圆棍，三角表明稳定的结构，更多多是强调App Store、开发者和用户之间的关系。

 

而计算器图标的改变动为完全，从扁平风格变得圆润，以实心圆为主，更可能是让人推断是在向初代iPhone OS致敬。

还有其余的一些图标也进行了对应的改变，总体来讲都是进行简洁化或者对比度加深，更加符合iOS 11的总体风格基调。

App Store

 

App Store的新设计突出了卡片式的排列方式，配以投影的大面积使用，提高了页面层次和对比。这样大胆的排版增强了App Store的设计感和艺术感，突出了层次和导航。

简单来讲App Store将应用整个的风格都进行细致的归类，在概括好一个主题以后在针对于用户各自的使用风格去进行推荐，这背后蕴含的是苹果对于整个用户群体大数据的概括整理，以后再定向推送相对应的内容，实在是一个很是不错的改变。

通知中心

 

在新版的通知中，当咱们从顶栏下滑后，背景再也不使用玻璃虚化，跟锁屏界面同样，在上方保留时间和日期的信息；竖屏的状况下，时间和日期会呈如今界面左侧，右侧则放置通知信息，设计风格与控制中心统一模块化设计风格，跟iOS 10相比更为简练和大方，更加符合使用习惯，空间利用也更为合理。

解锁界面

 

iOS 11中的锁屏界面的数字键变成实心，这样的设计提升了界面的可读性，减小细框和细线对阅读的干扰和影响。

=====================================================

除了iPhone以外，iOS 11本次在iPad上的表现可谓是很是惊艳，特别是交互方面让iPad面目一新。

iOS 11 for iPad 最大的变化是更新了一款全新的 Dock，相似于 macOS 上 Dock 的体验。首先，这个 Dock上最多能够摆放的15个应用，而且在 Dock 右边的分区会显示最近使用的 3 个应用，而正在 Handoff 中的应用会出如今 Dock 的最右边，Handoff 的应用会占用显示最近使用的 3 个应用的一个名额。

全新的Dock采用了底部上划呼出的交互方式，替代了以前的控制中心，更加值得一提的是，在已经打开一个应用的状况下，咱们从屏幕底部呼出Dock并打开一个应用，将其拖到界面上后，这个应用就会在界面右侧以悬浮窗口的形式呈现。

全新的Dock与悬浮窗口结合的模式解决了iOS 10中分屏状态下只能经过上划滑动应用列表翻找应用的状况。跟iOS 10中的Slide Over最大的差异在于，Slide Over打开的应用是没法操做的，而如今你能够在操做悬浮窗口的同时对主应用进行交互和操做，极大地提升了使用体验。

 

App Switcher

 

新版任务切换中心对笔者最大的感觉，莫过于终于能够再也不用力双击Home键呼出了，在上划呼出Dock后继续从屏幕下方滑就能够打开App Switcher。整个过程很是丝滑顺畅，不只减轻了忽然切换到物理操做的不适感，也加强了系统总体的使用沉浸感。想要回到主屏的话也不用点击Home键，轻点App Switcher的空白区域便可。

 

Drap & Drop

文件拖拽这种交互方式终于在iPad获得了实现，好比在悬浮窗口，你能够在拖出一个文件后，再分别点击须要拖拽的其余文件，从而会造成一个堆栈，接着就能够轻松地批量把文件拖拽到主应用了。

 

二级菜单

还有一个值得一提的交互则是iOS 11 for iPad新增的二级菜单，目前为止iPad还未支持3D Touch，在新的系统里能够经过长按应用或控制中心进入二级菜单实现相似3D Touch的体验效果。

总的来讲，相比iOS 10，iOS 11最直观的莫过于加粗了总体的线条感，总体不管是字体仍是图标效果都获得了加深和加粗，对比度也更高，表明了一种平静的进化和对用户体验的微调。iOS 11在iPhone上的更新较为平滑，更增强调细节上的视觉效果和操做体验；而在iPad上的更新能够说是可圈可点，特别是在交互方面大有突破，使得iPad往生产力设备更近了一步，也让开发者拥有更大的自由和平台，使得iOS的应用生态更为高效和实用。

如此巧妙的设计风格，你是否也被惊艳到了呢？做为一名iOS设计师，是否是想立马开始动手作这样的设计呢？这里笔者为你们推荐如下几款工具，相信能够帮助到你。

（1）Sketch

Sketch是一款基于Mac的矢量绘图应用。面对着功能复杂繁琐的Photoshop，Sketch相比较而言身轻如燕。最近也掀起了用Sketch设计产品原型的热潮，由于用它来画设计稿简直垂手可得，让咱们的原型图更逼真，更有利于交流和前期的展现。目前Apple人机交互指南已经提供了iOS 11的官方UI Kit，能够在仔细阅读设计规范后，根据UI Kit在Sketch中对本身的产品进行适配或迭代设计。

（2）Mockplus

交互正是一个原型的灵魂，是展现原型逻辑和思惟最直观的方式。在使用Sketch完成设计稿后，若是咱们想要对设计稿继续进行交互设计和团队协做的话，咱们能够为Sketch下载和安装Mockplus的插件。在完成Sketch的设计后，能够将其导出为MP的项目文件，从而在Mockplus中进行原型设计和页面交互，而且与团队成员进行协做和批注。

iOS在不管在交互仍是UI上都一直保持着创新和动力，除此以外咱们也应该看到苹果背后的人文精神和用户体验，咱们在产品设计的过程当中，也应该让产品保持沉稳的气质，顺滑的体验，产品也会所以变得鲜活而生动。