【Windows 8】APP UI design 課程分享

昨天小編參加了微軟所舉辦的 【Windows 8 Metro Application Design/User Experience】課程研討會，主要是對於最新的作業系統Metro的UI設計技巧與使用者經驗做討論。

小編將內容分成幾個部份跟大家做個分享：

A. Metro的UI設計原則
會中，微軟的Carol不斷的提醒到 "營造相同的使用者經驗"，是微軟新一代作業系統本階段最重要的事情，那到底要營造什麼樣的使用者經驗呢？
    1.Modern
    2.Clean
    3.Simple
    4.Direct
    5.Content Typography

Metro希望帶給所有使用者相同的體驗，因此對於APP的設計審核，也非常注重上面的五項準則。
一個設計普通、沒有錯誤的APP基本就是通過第一階段Store審查(交易系統或是程式本身沒有重大bug)，但如進階的AER review (UK Team複審)，就必須完全符合上面的原則，並且將會成為主推的APP果要通過，讓更多人可以看見、下載。


B. Metro的UI設計架構
在Metro中，主要分為兩種架構
    1.階層式架構 (主要為一般Content類型APP)

   
 




      其中又以三階架構為基礎，分別為

   

Level one : Hub
   



Level two : Section
   




Level three : Details



     2.單層架構 (適合遊戲與工具類型APP)

   

以同一層結構做橫向式的移轉





C. 善用手勢操作結合UI
Metro當然也有豐富的多工手勢操作，當設計時需以使用者該如何操作思考，結合最適當的手勢達到最好的效果。

建議最小按鈕值為7*7 mm

D. Metro 的"磚" (Tile)

許多人對於Metro 的第一印象就是：區塊
這一個一個區塊，微軟稱之為磚(Tile)
磚並不僅只是button . icon 或是單純連結，而是APP或是Content的縮影介紹，因此可以從磚上就可以瞭解進入後的內容或是精華呈現，在設計上也具有決定性的影響。


E.其它規範
     1.支援解析度

   
   












建議可針對最低解析度 1024x768 與最佳解析度 1366x768 設計
如此可確保最大多數的內容都能夠被清楚呈現。


    2.Grid

Metro注重版面的排版精緻度，因此基本的版面設計都規定的非常清楚，就算是一個pixel的間隔也不得有錯誤的空間。


微軟這次Win8的超大改版，有非常多的規範與要求，最主要呼應前面所說，所有的規範都是為了要 "營造相同的使用者經驗"，可預期的win8又將是劃時代的一個產品，至於使用者的應用程度與偏好，就要靠時間來檢視囉！

更多的Win8 Metro APP開發，歡迎找我們聊聊。