原文地址：http://www.cocoachina.com/applenews/devnews/2013/1015/7162.html

iOS7在界面上最大的变化就是抛弃了苹果使用了多年的拟物化设计，而转投扁平化设计阵营。一时间，业界评论褒贬不一，槽点多多亦不乏溢美之词。我们先暂且不去评判新的图标和整体设计风格的好坏，而是从其背后的设计理念的变化来思考苹果的新设计。
形式追随功能，UI服务内容
苹果在更新的iOS人机交互指南中最先提到的一点就是Defer to Content（尊重内容）。无论UI如何变化，内容始终是体验的核心，UI永远是服务于内容而不能影响内容的表现。这不禁让人想起louis sullivan(易斯·沙里文)当年的那句”Form follows the function”（形式追随功能），苹果的这次改变实际上是对设计本源的重新认知。
从iOS7具体的设计表现来看，以下几点对其设计理念做出了很好的诠释。
强调充分利用屏幕空间
iOS7强调让内容自然地延伸至整个屏幕，而不使用多余的视觉元素将内容与操作区、信息区分开。一个最明显的例子就是顶部状态栏融入内容，不再用线条分割开，使用户在视觉上感觉内容空间变大。
iOS7的天气和备忘录
为了使屏幕主体内容更加突出，更多地呈现给用户，必要时会隐藏UI元素，将屏幕空间让给内容。iOS7在很多原生应用中都是用了自动隐藏上下状态栏和导航栏的设计。地图应用中甚至连最顶端的状态栏也一并隐藏了。
iOS7地图应用
iOS7的safari
弱化控件视觉效果，以避免干扰内容
这一点是iOS7最明显的变化，也就是所谓的扁平化设计风格。新的设计去除了iOS6系统控件的纹理和质感表现，非必要时不再使用拟物化方法来表达。最明显的例子是系统按钮控件，不再使用拟物化的按钮边框及高光、阴影，取而代之的是简化的图标元素和操作内容。
iOS7和iOS6备忘录
iOS6的按钮被指示箭头和文字所取代，而为了表达元素的可操作性，iOS7定义了关键色这一概念。在同一个app中，使用区别于内容的一致的统一用色来表达可操作元素。在备忘录中，使用的是黄色；而在系统设置中，则统一使用了蓝色作为关键色。
整体视觉效果上的变化，日历的例子最为明显，可以看到iOS7与iOS6两种截然不同风格的日历表达方式，iOS7的日历，内容更加突出，操作元素被弱化；而iOS6的日历，极具操控感，屏幕上每个内容元素和操作元素都是可交互的。
iOS7和iOS6日历
优化内容元素，使其清晰可见
我们知道，在设计中运用留白可以使得要表现的主体内容和功能更加突出。在iOS人机交互指南中，是这样描述留白的：空白可以向用户传递宁静和安宁的感觉，让app显得更专注，更有效率。
iOS7的日历是一个留白运用的经典例子，空白空间的使用使得iOS7的日历内容更加突出，并不在有iOS6日历的拥挤和紧迫感。
iOS7日历
构建全新的层次空间，建立新的视觉秩序
iOS7引入了全新的视觉层次的概念，这种分层界面有助于营造纵深感，建立层次结构和秩序，并帮助用户理解屏幕元素间的物理关系。
iOS7界面分层结构图
通过视差动画营造纵深感
在主屏上，由于图标层与背景层的分离，iOS7利用加速感应器检测用户视线角度的变化，控制不同层的位移速度，巧妙营造了视差动画，从而屏幕元素活跃起来，营造了立体纵深感。
下图是iOS7主屏在手机不同倾斜角度的截图。可以看到在不同角度背景层与前面图标的位置关系是不同的。
iOS7主屏
大量使用半透明UI元素
半透明效果能够帮助用户尽可能多的了解到被遮挡的内容，并使用户理解层与层之间的物理关系。
iOS7控制中心
相对于安卓的控制中心界面，采用同样的拉出的方式，iOS7半透明的设计能够让用户了解到控制面板和后面界面的层次关系，表达清晰，而安卓的面板，则更容易迷失。
在iOS6中，时间选择器采用了非常逼真的拟物化效果，模拟了拨轮进行时间设置。IOS7则去除了拨轮的质感和纹理，将其扁平化，通过透视原理和半透明玻璃效果表现了一个扁平化的拨轮。值得注意的一点是，iOS7的玻璃效果处理得非常逼真到位，选择时间的中间状态里，体现出了玻璃的折射效果。这一点在iOS6中并没有见到。
iOS7时间选择器
iOS6时间选择器
鼓励采用深度层次的信息结构
在信息结构上，iOS7更鼓励采用深度层次来与用户交流，并要求隐喻更加符合物理世界。
iOS7的文件夹摒弃了iOS6的屏幕裂开效果，而是采用了置于主屏之上的毛玻璃效果。这与系统整体的层次关系是相呼应的，在iOS7的层级秩序里，背景层始终是处于最底层的，其他表现层则置于其上。那么文件夹的打开则理应是悬浮于主屏之上，并采用毛玻璃的效果表达其层次关系。
同时，iOS7一致性的应用/文件夹打开动画，也体现出了这种深度层次关系。与iOS6的打开动画不同，iOS7的打开动画是以被点击的应用/文件夹为中心，向四周放大的形式打开，表现出一个非常合理的深度层次关系。而iOS6则无论被点击应用/文件夹位置，均是以屏幕中心点为中心，向四周放大打开。从这一动画方式的改变可以看出，iOS7更注重动画与真实物理世界规则的对应，而不仅是流于形式。
iOS 7与iOS 6的文件夹
iOS7的日历应用采用了年、月、日3个深度层级的信息结构，这较之iOS6的日历，是一个很大的变化。IOS6的日历应用强调扁平化的信息结构，整个应用只有一个深度层级，月、日的切换通过TAB切换来实现，其他所有操作功能也都在这个一个层级中进行。深度的层级设计能够有效减少每个层级界面中的操作元素，是的界面更干净、整洁，内容元素突出。与这种深度层级配合的转场动画与前面提到的系统打开应用/文件夹的动画一致，均已用户点击出为中心点进行放大，向用户传达出与深度层级相对应的纵深感。
iOS 7与iOS 6的日历
同样的深度层级结构也运用到了图片应用中，图片的四个层级一次是年度、精选时刻和单图。
iOS7图片
通过苹果最新的iOS人机交互指南我们可以看出，苹果在对待所谓“扁平化”设计风格上是有着自己独到的设计理念的。正如苹果官网所说的那样，“人们常常将简约等同于极简主义。但是，真正的简约远不止删除矫饰和去除杂乱那么简单。而是因应你的需要，因地、因时恰到好处地展现每一方面。删繁就简，事事有序，以及确保所做的每一件事总是“行之有效”。当你第一次上手使用，就对它所能做的了然于胸时，那就是简约。”
但好的设计理念，仍需不断打磨，经过千锤百炼的设计来表现。从本次发布的iOS7 beta的很多细节不难看出，本次iOS7的发布是仓促的，许多设计还有很多值得推敲的地方，因此也引来众多吐槽。不过，相信未来，随着新设计风格的不断完善，苹果还会是果粉心目中的那个苹果。
来源： 腾讯cdc

通过《iOS人机交互指南》的变化看iOS7的设计理念相关推荐

  1. ios底部栏设计规范_2016年全新Apple iOS设计规范指南！

    原标题:2016年全新Apple iOS设计规范指南! iOS推出很多年,已经升级到iOS9!现在Apple还推出了一款全新的字体苹方(san francisco),3D Touch和iPad分屏多任 ...

  2. 苹果人机交互指南_苹果人机界面设计指南的10个见解

    苹果人机交互指南 重点 (Top highlight) I've been developing an IOS app for the past few months and have been co ...

  3. iOS人机界面指南（界面设计基础部分）ISUX原创翻译

    http://isux.tencent.com/ios-human-interface-guidelines-ui-design-basics-ios7.html iOS人机界面指南(界面设计基础部分 ...

  4. 更改应用程序图标_【iOS12人机交互指南】6.2-应用图标

    该系列是iOS12人机交互指南的翻译,翻译的过程中加深自己的理解. 每个应用都需要一个漂亮而难忘的图标,它能在应用商店中吸引注意力,并在主屏幕上脱颖而出.图标通过用户的第一眼来和用户沟通,是传递应用的 ...

  5. xshell6左侧导航显示_【iOS12人机交互指南】7.1-导航栏

    该系列是iOS12人机交互指南的翻译,翻译的过程中加深自己的理解. 导航栏出现在应用屏幕的顶部,在状态栏下方,并允许在多个层级的界面中导航.当显示新屏幕时,会在导航栏的左侧出现一个返回按钮,该按钮通常 ...

  6. Web工程师和设计师必须要知道的 iOS 8的十个变化

    本文原文为"iOS 8 and iPhone 6 for web developers and designers: next evolution for Safari and native ...

  7. hid自定义report 影响键盘_【iOS12人机交互指南】10.1-自定义键盘

    该系列是iOS12人机交互指南的翻译,翻译的过程中加深自己的理解. 键盘扩展用自定义键盘替换标准键盘.在"设置"应用中,在"常规>键盘"下启用自定义键盘. ...

  8. 产品设计相关基础_IOS人机交互指南

    IOS 9人机交互指南 iOS 9人机界面指南(一):UI设计基础 iOS 9人机界面指南(二):设计策略 iOS 9人机界面指南(三):iOS 技术 (上) iOS 9人机界面指南(三):iOS 技 ...

  9. 不得不吐槽一下《IOS开发指南》关东升

    最近自学IOS,原先是跟着视频学习的,后来想还是买一本书吧,朋友推荐下买了<IOS开发指南>,死厚死厚的一本书,一看目录介绍,似乎涵盖了所有IOS需要学习的内容,于是想想那就当作资料书来看 ...

最新文章

  1. 解决 The mysql extension is deprecated and will be r
  2. Ansible搭建hadoop3.1.3高可用集群
  3. python打包成exe_【Python基础】一篇文件教你py文件打包成exe
  4. IIS6.0的web园--最大工作进程数
  5. redistemplate.opsforvalue 设置不过期_民法典即将实施！“离婚冷静期”倍受关注
  6. 读《C程序设计语言》
  7. android源码编译完成之后
  8. 制作PPT和画报的免费素材：pixabay免费照片插图矢量图
  9. python对数据求均值_利用Python读取json数据并求数据平均值
  10. 04、Flutter FFI 字符串
  11. 吞下西甲英超中超成体育大胃王，PPTV还有哪些大招？
  12. 不同类型的云计算专业知识，推荐几本专业云计算技术书籍
  13. 轻社区的“赚钱术”：免费社区赚钱，去年利润1个亿
  14. Eclipse中怎样设置字体大小和修改注释字体的颜色
  15. python describe 分位数设置_Python Pandas – 如何通过describe函数计算25百分位数
  16. 哥德尔奖得主Cynthia Dwork：实现算法公平性，长路漫漫
  17. gaussdb 【FAQ_002】【gs_guc配置pg_hba.conf后不生效】
  18. 攻防世界 Stegano
  19. 规律, 性质, 原则等概念, 概括解析
  20. 【Asp.Net】vs中没有Sln项目文件的解决办法

热门文章

  1. 怎么把多张动图拼在一起？怎样制作动态拼图？
  2. 网页数据导入excel问题介绍
  3. 基于matlab的串口通信,基于Matlab GUI的单片机串口与PC的通信 附源码
  4. 2018年终总结—你在，你就要热爱
  5. 听说你还在纠结石墨烯地暖还是暖气片？
  6. 俄罗斯方块(简易实现)
  7. [转]阳光加利福尼亚 --土老冒的硅谷、旧金山见闻
  8. 【激萌】人工智能大地图-生存能力篇
  9. week2：History: The First Internet - NSFNet
  10. bartender连接oracle,了解BarTender支持的OLEDB数据源