※ [本文转录自 iPhone 看板 #1Hk2-wus ] 作者: Ken52039 (Ken Huang) 看板: iPhone 标题: [讨论] 转个好文：iOS7与扁平化界面设计潮流 时间: Wed Jun 12 16:22:14 2013 来源：http://0rz.tw/rAUla 图：http://0rz.tw/HsSGN 苹果电脑今天发布了全新的iOS7操作系统。不出所料，界面设计秉承自 Windows Metro後流行的极度扁平化风格。界面的操控，再不倚赖模仿实物机 械操作的「拟物化」（skeuomorphic）视觉语言，进而发展至几乎全无立体 感的扁平化设计。这次升级，仿皮革纹理的行事历不见了，稍微凸起的按钮 消失了，以至半透明的对话框都没有了。当然，我要讨论的，不是风格或潮 流，而是这扁平化界面设计的互动体验和信息设计的关系。 耶鲁大学荣休教授Edward Tufte出版了数本关於信息设计和数据呈现的书籍 。其中Envisioning information（暂译《信息构想》）中载有一个名为‘ layering and separation’（层次与区隔）的原理。我认为这是其中一个最 重要、最管用的设计原理。顾名思义，层次与区隔是把资讯按种类、重要性 和功能分成不同的层次，以不同的视觉手法来区分。「对比」是层次与区隔 最重要的表达手法，包括色相、亮度、透明度、阴影、大小、粗细、疏密等 。极度扁平化的界面设计手法，正正是「层次与区隔」设计原理的典型反面 教材。 这次升级，字体采用iOS一贯的Helvetica，不过今次是Helvetica Neue Light和Extra Light。当然，这是用来炫耀Retina display的超高解像度。 莫说是直接发亮的萤幕显示，就连印刷品，极幼细的字体对读者来说也非常 刺眼，少用为妙。用少了粗体，文字信息的层级就只能用颜色和字体尺寸来 区分，极低的对比，寻找资讯和操控界面起来便事倍功半了。关於 Helvetica的可辨度之低，容後再探讨。 图：http://0rz.tw/4IZmL 至於去除透明度、（半）立体视窗按钮、物件阴影等，为的是彻底消除虚拟 操作环境中对物质世界的模仿。图像界面在80年代初普及化时，一般用户普 遍未能了解电脑的虚拟操作环境，以「比喻」（metaphorical）和拟物化的 手法作界面设计语言较易为用户接受，尤其初学者。桌面、视窗、档案夹都 是比喻和实物的模仿。30多年後，大众已经熟习虚拟界面的操作。去拟物化 ，其实是很自然的进化。然而，拟物化这种界面设计语言，从来并非寻求绝 对的像真度（虚拟实境界面除外）。仿皮革、不锈纲、玻璃等物料，看来并 没有实际需要。而相对含蓄的立体视窗边缘、稍微隆起的按钮、半透明的对 话框、一点点的阴影，却对用户理解操作系统的逻辑和状态非常有用。 Affordance（有译「承担性」，笔者暂译「功能推断」）这个心理学概念， 说的是从一件物件的物理和视觉属性所能推断出的功能。极度扁平化、非拟 物化的操作界面，令用户无从推断和掌握该怎样与屏幕显示出的图象产生互 动。这个是按钮吗？那个能否拉下？这是链结吗？都无从以直观方法理解， 唯有试试看。 放弃了这些手法，便要倚赖其他方法表现操作系统的功能结构，如幼细的分 隔线，或画面上的余白。没错，分隔线和余白的确有帮助，但来得比较含蓄 和单调。当屏幕尺寸较大的时候尚可接受，但於小小的智能手机屏幕上，空 间根本不够。平板电脑和智能手机的的时间体验比较快速，用户往往在一个 应用程式里只作短暂停留，时常需要作快速资料搜寻、处理任务和切换程式 。而行动设备的使用场合，大多是人多挤迫的公共交通工具上，甚至在街上 行走时。视觉对比低的界面，拖垮用户执行任务的时间，容易发生错误，增 添挫折感。在现今大量资讯充斥的世代，用户的专注力愈来愈薄弱，极度扁 平化的界面更显得不适合。 简洁、简约似乎已经成为当代设计师的金科玉律。然而，盲目追随这「格言 」的设计师，往往对功能和可用性只有片面的理解。简洁和简约沦为风格和 品味的表现。这正是现代主义设计没落的原因。Louis Sullivan所宣扬的「 形式跟从功能」已经变质了，或许已经不合时宜。功能从来不可能凌架於形 式，因为形式正正就是功能。 Edward Tufte评论第一代iPhone操作系统的视频：http://youtu.be/YslQ2625TR4 ----- 请理性评论～勿战＠＠ -- 小本生意，来坐坐！http://kenhuang.me . www.bopeep.com.tw . www.esly.com.tw --

※ 发信站: 批踢踢实业坊(ptt.cc) ◆ From: 114.42.212.14

※ 发信站: 批踢踢实业坊(ptt.cc) ※ 转录者: Ken52039 (114.42.212.14), 时间: 06/12/2013 16:25:06