第1章 Metro風格概述
1.1 Metro的淵源
1.1.1 地鐵與城市
1.1.2 包豪斯建築
1.1.3 瑞士平面設計
1.2 Metro風格的原則
1.2.1 MetroUI的特點
1.2.2 MetroUI的區分
1.2.3 Metro哲學
1.3 Metro風格應用程序的演進
1.3.1 初露端倪
1.3.2 蓬勃發展
1.3.3 引領未來

第2章 Metro風格應用實例
2.1 Windows8Metro界面賞析
2.2 WindowsPhoneMetro界面賞析
2.3 Android和iOS中Metro風格應用界面賞析
2.4 Metro風格網站設計賞析
2.5 其他Metro設計風格的產品賞析

第3章 定義Metro風格的應用程序
3.1 設計Metro應用
3.1.1 明確應用的定位
3.1.2 設計產品的交互方式
3.1.3 定義產品使用的平臺特性
3.1.4 盈利模式
3.2 設計令人印像深刻的MetroUI
3.2.1 最適合產品的UI
3.2.2 一眼就愛上它
3.3 使用原型驗證MetroUI
3.3.1 開發原型產品
3.3.2 傾聽用戶的聲音

第4章 Metro風格設計指南
4.1 Metro頁面布局與配色
4.1.1 Metro的精髓——Tile
4.1.2 簡單且華麗的配色
4.1.3 字體樣式
4.2 導航與頁面切換
4.2.1 應用內容的組織與導航
4.2.2 借助平臺的特有導航操作
4.3 Metro的觸摸操作
4.3.1 觸摸行為的定義
4.3.2 觸摸的目標
4.3.3 觸摸屏幕的合理操作區域
4.3.4 設定使用場景
4.4 Metro控件設計準則
4.4.1 啟動界面設計準則
4.4.2 消息通知設計準則
4.4.3 鎖屏設計準則
4.4.4 頁面內控件的設計原則

第5章 多種類型應用的Metro設計指南
5.1 遊戲
5.1.1 布局和導航
5.1.2 遊戲內控件
5.1.3 觸摸交互
5.1.4 設置和選項
5.1.5 暫停遊戲
5.1.6 狀態管理與保存
5.1.7 遊戲賬戶
5.1.8 改變視圖方向和窗口大小
5.1.9 啟動畫面和載入提示
5.1.1 0漫遊
5.1.1 1合約
5.1.1 2WindowsPhone中的遊戲
5.2 娛樂類應用
5.2.1 多媒體應用的布局和導航
5.2.2 在HUB頁面中點擊項目
5.2.3 播放體驗
5.2.4 劇集或視頻的前後章節導航
5.2.5 命令
5.2.6 等級與評論
5.2.7 字體與版式
5.2.8 合約
5.2.9 告訴用戶應用是有活力的
5.2.1 0方向和視圖
5.2.1 1應用啟動
5.2.1 2WindowsPhone中的娛樂應用
5.3 新聞類應用
5.3.1 布局和導航
5.3.2 命令
5.3.3 新聞應用中的版式
5.3.4 內容的新鮮感
5.3.5 告訴用戶應用是有活力的
5.3.6 方向和視圖
5.3.7 應用啟動
5.4 工具類應用
5.4.1 概述
5.4.2 全屏模式
5.4.3 工具類應用的布局和導航
5.4.4 命令
5.4.5 工具類應用中的數據輸入
5.4.6 文本選擇
5.4.7 工具類應用中的版式
5.4.8 合約
5.4.9 告訴用戶應用是有活力的
5.4.1 0方向和視圖
5.4.1 1WindowsPhone中的工具應用

第6章 移植為Metro風格的應用
6.1 將ipad應用移植成Metro風格
6.1.1 布局和導航
6.1.2 命令和操作
6.1.3 合約
6.1.4 觸摸
6.1.5 方向和視圖
6.1.6 通知
6.2 將iPhone應用移植為Metro應用
6.2.1 布局和導航
6.2.2 命令和操作
6.2.3 方向和視圖
6.2.4 通知
6.3 將網頁移植成Metro應用
6.3.1 布局
6.3.2 導航
6.3.3 操作
6.3.4 觸摸操作

第7章 Metro的未來
7.1 Metro風格是微軟未來全線產品的風格
7.2 來自未來的風格
7.3 從Metro到Modern的轉變
7.4 白璧微瑕
……

序數千年以來，人類科學文明的進步始終圍繞著可觸摸的實體世界：石器、青銅器、鐵器，以及歷次工業革命中產生的各種機器，這些科技都是可觸踫的，是人們所熟悉的。於是，當資訊科技時代來臨時，設計師大量沿用實體世界的隱喻來幫助人們了解和熟悉虛擬世界。標簽（Tabs)、垃圾桶、Copy＆Paste，以及仿真主義風格的視覺設計（Skeuomorphism)，這些都和實體世界有著某種程度的連接，幫助用戶適應虛擬的電腦環境。但是隨著互聯網的快速演進，現代人平均花在網絡上的時間大大增加，和屏幕上虛擬原件互動的時間已經大於和實體世界互動的時間。當隨著互聯網各種新的應用不停推出，設計師越來越難以找到和實體世界相對應的隱喻時，我們發現，舊有的設計規範已經不復使用。Modern/MetroUI的出現，為人機界面設計提供了全新的角度。它拋掉了仿真主義的包袱，將頁面的空間歸還給內容本身，嚴謹而豐富的交互規範，在現有的各種設計風格中，它自成一格，獨特而前衛。但是，由於可素的減少，對於交互的嚴謹要求，設計Modern/Metro界面對交互和視覺設計變成了嚴峻的挑戰。更重要的是，要做出好的應用，不再隻是設計師的工作：項目經理開始需要了解設計原則；設計師需要了解繫統件和限制，開發人員也需要對設計規範有深入的研究。Modern/MetroUI對於團隊合作的要求也提高了。本書作者從綜合的角度，深入淺出地詳細介紹了 Windows 8的設計規範。從產品定位到交互和視覺規範，到相對應的 API，本書詳盡地解釋了開發 Windows 8 App的所有細節，相信無論你是設計師、產品經理，還是工程師，都能從中獲益！ David Liu UX Designer Microsoft前 言互聯網產業每天都在發生著變革，正是一次次的變革推動了技術的進步、產業的創新和歷史的發展。當微軟還固守著最接近電腦操作體驗的WindowsMobile智能手機時，iPhone的出現帶來了智能手機領域的變革，重新定義了智能手機的概念，而Android的出現改變了iPhone一家獨大的狀況，使智能手機更加普及，適合於各個階層的消費者。但是幾年來Android手機與iPhone的用戶界面同質化問題嚴重，雖然部分Android手機廠家對Android繫統的界面做過定制，但是無論是三星定制的繫統界面還是HTC的HTCSense，似乎都沒有超脫Android和iPhone創立的這個界面範圍。就在大家對iPhone和Android手機的界面審美極度疲勞的時候，桌面操作繫統的王者——微軟以一個全新的操作界面和用戶體驗促進著智能手機產業的又一次變革，這就是在微軟的Windows8和WindowsPhone繫統中都采用的Metro風格的界面。Metro風格是一種完全不同於iPhone和Android的界面風格，它強調的是以簡潔的布局、鮮艷的顏色、明確的標識為用戶提供最明確的意圖呈現、最簡單的操作方式。正如諾基亞的CEO所說，諾基亞選擇WindowsPhone繫統作為其智能手機的操作繫統，目的就是為了能夠脫穎而出。擁有Metro風格的WindowsPhone操作繫統具有很強的辨識度，避免了與Android手機或者iPhone手機的同質化。一個擁有Metro風格界面的應用同樣具有相似的效果，在眾多的應用中可以脫穎而出，這是越來越多的應用選擇Metro風格的原因，也是手機用戶對比變革的根本需求。面對越來越多的Metro風格應用設計的需求，本書將為移動應用客戶端的設計者和開發者介紹Metro風格的設計理念，探尋Metro風格的設計精髓，指導讀者進行Metro風格應用的設計。本書將以Windows8和WindowsPhone兩個平臺為主，所介紹的設計規範完全符合微軟所規定的Metro設計原則，同時結合作者的設計經驗和業界的設計規範細化出一套更具有操作性的Metro風格應用的設計流程和規範，包含配色、布局、導航、磁貼的設計等多個方面，同時針對現在存在大量從Android和iOS平臺向Windows8或者WindowsPhone平臺移植應用的需求，本書也重點介紹了其他平臺應用向Metro風格移植的方法和需要注意的事項。希望本書的內容能夠為Metro風格應用的開發者和設計者提供有價值的內容，並具有一定的幫助和指導作用。