??????? 這是翻譯的一篇國外論壇上的文章，并不是很準確，想看原文的可以到這個網址：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。

???????后面還有一段關于作者說以后要發其它文章的，沒翻譯，沒啥技術含量。

總結

以上是生活随笔為你收集整理的Metro风格用户界面设计原则的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。