Metro风格用户界面设计原则

        这是翻译的一篇国外论坛上的文章，并不是很准确，想看原文的可以到这个网址：http://www.stephanemassey.com/metro-design-principles/。

       

       Metro用户界面设计原则

       （注：Metro UI，Metro风格用户界面，即所谓的Win8风格）

       自从我在伦敦开始为用户贴近Metro UI和Isotope（同位素，这里我不是很理解）工作以后，我就有一种想和你分享什么是Metro UI和我怎样理解它的冲动。

       当我们谈到“Metro”的时候总是会说到被微软开发的设计风格。准确地说Metro并不是一个新的名词，它在上世纪90年代中期左右开始发展并被应用于Encarta95（英卡塔，微软的电子百科全书）和MSN2.0的基础。多年来我们在Windows Media Center和Zune（品牌名，微软开发的一款音乐播放器）经常看到它。后来被作为视觉设计语言而精确化，并且可以在Windows Mobile操作系统、Windows Phone7、最近Xbox 360汽车仪表盘的更新和Windows 8中看到它。

       微软Segoe font family（微软公司推出的一种字体系列）一个特别制作的版本，SegoeWP，被用来作为所有印刷业（*）主要的字体。它在台北国际电脑展被微软确认用于Windows8操作系统，（尤其是Windows8的新标志）作为Windows7的继承。它的灵感来源于地铁，于是命名为Metro。

       Metro可以被分成两个部分：Metro设计原则和Metro设计语言。这些原则是Metro用户体验的关键，它扮演的角色是像Windows Phone 7 和the Xbox Dashboard update一样的产品的指导方针。后来，Metro语言成为了一套视觉财富，一种用户相关的交互，一个过渡效果、动作的集合，一种应用程序流的基础和规则，它结合了一种统一标准的用户体验。

       用类比来说明Metro设计原则和语言的关系的抽象概念就像“爱”（原则）可以被用一个具体的符号“♥”或“l-o-v-e”四个字母表示一样。我相信你可以通过无数种的方式去表达“爱”的概念，包括它本身的读音、照片或者其他元素。

       对于概念的有形表示就是语言。如果有一个像玻璃一样的原则，我需要三个图标来表现它：一支笔（写），一颗星（最喜欢的）和一个十字（关闭），再有一个像按钮一样的控制器就可以将这些表现为一种视觉语言。如果我告诉你这些，我相信你可以从其他图标设置控制器中明白它。

排版

       排版，排版，排版……自从这个概念被引入到Metro中后，几乎所有的事情都像是在排版。排版并不是Metro的全部，它并没有像图片、图标、动作、声音一样重要。记住最重要的两个原则：信息是显示的主角。如果它的意义是通过排版表达信息，那么其他就不要强迫它了。

如果包含了一定的设计技巧排版就会好看。例如，在Metro中，我们使用不同的尺寸和宽度来传达结构化信息（下面的例子就很漂亮）。这恰好就是在通过排版把事物从其他媒介中突出出来-它并不是为了排版而排版，而是把排版作为一个有效的、灵活的工具来传达结构化信息。它在一个特殊的区域操作图标、图片和其他媒介-结构化信息是一种有层级的信息，它表现出一种顺序 ，帮助用户把信息按照优先顺序划分。这也是我们不在Metro中使用“项目符号”的原因-如果你给了信息不同的尺寸就不需要他们了。

Windows Phone Metro设计语言

       为了使所有开发者都能够创造Windows Phone应用，微软刚刚发布/谈到了Metro设计原则但当然这意味着开发人员必须创造他们自己的设计语言，这将要花费他们很长时间。创造一门设计语言对像手机这样的现代设备是一个很大的工作量，并且需要很多时间去设计、重复、检验和用户测试。微软手机设计工作室精心制作了一门每个人都可以使用的可靠的语言。

       基于Metro设计原则，微软提供了微软手机Metro设计语言。使用它可以让你为Windows Phone成功地制作一个漂亮、引人注目、始终如一体验的应用。微软WindowsPhone设计语言取决于这些方面：

       导航、布局、成分、排版

       动作

       图解

       图片和照片

       主题和个性化

       触摸手势和目标

       用户界面控制

       计算机硬件

       服务

       市场和品牌

       和抽象的原则相比，语言是实在的。因此在Metro中有一个叫做Hub & Spoke (more here)的具体的导航系统。它有一系列的动作，像单击、双击、点选并按住、弹开、拖动等。也有一个具体的排版，用Segoe格式给结构化信息设置不同的尺寸。还有一套具体的用户界面控制系统像命令按钮、单选按钮、多选按钮、滚动条和其他UI元素。也有具体的应用程序交互元素像枢轴、全景和页面。

       所有这些组构成了Windows Phone Metro设计语言。这是一个全面的，端到端的，灵活的和可扩展的设计语言。

       但是，这是体现Metro设计原则这种开箱即用的设计语言的唯一方式吗？不。

       例如，我可以在我的Windows Phone应用程序中使用Helvetica或者Swiss字体吗？当然！作为无衬线字体和其他字体一样可以用来替代Segoe。

       后面还有一段关于作者说以后要发其它文章的，没翻译，没啥技术含量。