WINDOWS 10跨平台 app設計趨勢分析

 

　　編者按：騰訊精品長文流!今天月兔同學將通過Win 10的系統新特性和已公布的跨平台 app，來簡單分析一下Windows 10 的設計趨勢，來看看微軟有哪些顛覆自身的亮點 >>>

　　眾所周知，當初微軟在Windows 8上做了非常大膽的變革，除了開創性的Metro設計語言，傳統案頭和平板兩種模式的融合也是一大特色，可這兩種操作模式在使用體驗上的不一致也成為Windows 8飽受使用者詬病的原因之一，但微軟自始至終都朝著平台大融合的目標堅定前行著。經過一路探索，微軟終於通過在Windows 10系統的公布，展示了一個更加清晰明了的戰略方向：構建一個面向全部Windows裝置的核心作業系統。

　　一、系統新特性

　　首先，我們先來瞭解幾點與應用設計相關的一些系統特性：

　　跨平台 app（Windows Apps）

　　在微軟Windows 10發布會上，跨平台 app(已經由Universal Apps更名為Windows Apps)是出現頻率很高的一個名詞，那什麼是跨平台 app呢?簡單來說，在Windows 10上將真正實現以儘可能少的開發量即可打造全平台都可啟動並執行應用，從電腦、平板、智能手機，甚至到Xbox One都無縫過渡，並且保持整體一致的使用者介面和操作體驗。與Windows 8上的Metro應用只有全螢幕模式不同的是，跨平台 app在桌面圖案下支援視窗模式，這意味著觸屏和鍵鼠兩種操作將得到更好的融合。

　　跨平台 app具有以下優勢：

　　1. 統一的UI和體驗可以減少使用者在不同平台間的學習成本

　　2. 大大減少了開發成本

　　3. 可通過一個應用拉動不同平台的使用者群

　　自適應使用者體驗（Adaptive UX）

　　微軟針對Windows 10系統專門提出了自適應使用者體驗的這種理念，並為跨平台 app提供了一套統一的跨裝置自適應控制項。這套控制項的視覺元素和互動體驗都是整體一致的，但針對不同的操作環境和裝置有細微不同的體現，比如觸控螢幕、應用彈出控制項等，當使用者觸摸時自動使用較大面積按鈕，使用鍵盤時與之相反。

　　Continuum模式

　　Continuum模式是專門為混合形態裝置設計，比如Surface，也就是說開啟此模式後我們的裝置可以自由切換平板狀態和筆記本狀態，系統會根據是否為觸控螢幕以及是否有鍵鼠來判斷是否進入“平板電腦模式”。比如有觸控功能的裝置拔下了鍵鼠配件，Windows 10 會提示是否開啟“平板電腦模式”並將應用全螢幕顯示，整個介面會針對觸控略微放大，而且開始菜單也會變成全屏。這種模式較好的融合了觸屏和鍵鼠兩種操作環境，減輕了案頭和平板電腦模式間的孤立感。圖為在案頭和平板電腦模式下開始菜單的不同樣式。

　　二、設計趨勢分析

　　再來看看Windows 10上的官方應用對比Windows 8上的版本有什麼不同：

　　市集(平板)

　　XBOX(平板)

　　Skype(平板)

　　可以看出Windows 10的應用標準已經與之前的樣式發生了非常大的變化，筆者認為可以歸納如下幾點：

　　調適型配置（響應式設計）成為跨平台 app核心結構

　　除了要應對跨平台 app在桌面圖案下縮小放大的視窗變化，未來搭載Windows 10的裝置尺寸也會多種多樣，所以，靈活且高效的調適型配置理所當然是最符合跨平台 app跨平台、視窗化的特點的，在上面的圖中我們可以看到Xbox和Skype都改為了多欄式布局。

　　橫向滑動不再是典型的系統瀏覽形式

　　我們都知道Metro UI的設計語言之一就是橫向滑動瀏覽，但隨著Surface系列裝置的螢幕比例從前幾代基於橫向操作而設計的16：9變成了Surface Pro 3的3：2，似乎已經是微軟在傳遞調整產品方向的訊息。而如今我們可以看到上圖中Windows 10官方跨平台 app基本已經摒棄了整個資訊流的橫滑瀏覽，只是在個別分類下採用。對此變化，可以想到的原因之一是跨平台 app在桌面圖案下為視窗模式，當視窗尺寸變得窄小時，自然不適合用橫滑來瀏覽資訊。

　　探索新的導航解決方案

　　既然Windows 10已決定弱化橫向瀏覽，那必然需要一種更好的導航形式來替代之前的大字型大小橫滑導航，大部分的跨平台 app都開始嘗試採用“漢堡菜單”(Navigation Drawer)來作為統一的導航形式。雖然漢堡菜單已經被廣泛應用在網站、IOS及Android系統中，但是由於其易用性還存在很大爭議(特別是在Phone上)，所以在正式版發布前，漢堡菜單會不會成為微軟的最終解決方案還不得而知。

　　更多元化的設計風格

　　在Windows 8上，不論是手機還是平板應用，在系統設計規範的指引下都顯得“高度統一化”，以至於每一個應用看起來幾乎都是大號字型+方塊磁片的組合。Metro UI這種去掉所有裝飾只呈現資訊的設計理念其實一定程度上等於剝離了帶給使用者情感化體驗的元素，從而使使用者越發審美疲勞。還好在新的跨平台 app設計中，我們可以看到除了開始菜單以外，曾經那些單一的Metro元素已經越來越少，而線型表徵圖、置中布局、圓形、分割線等等元素的加入使介面變得更加豐富起來，可以說Metro UI的設計語言已被逐漸弱化，微軟開始鼓勵並給予開發人員更大的設計自由，未來Windows 10將逐漸和IOS及Android平台的扁平化風格趨於統一。

　　不同裝置和操作環境需要定製化設計

　　雖然在理論上開發人員可以通過一次編寫和一套UI使跨平台 app在所有Windows平台上運行，但根據實際情況來看，小尺寸的裝置介面並不等同於大尺寸的裝置介面縮小為視窗化時的效果，設計師仍然需要針對不同的裝置和操作環境(如觸屏或鍵鼠)來定製設計方案。在保證應用設計統一性的同時，也要兼顧不同裝置的使用體驗，這對設計師來說也許是一個挑戰。

　　針對不同的裝置特點，同一個跨平台 app運行在手機和平板上的區別

　　最後，根據以上趨勢分析，再補充兩個小Tips：

　　1.開發人員們可以利用這次Windows 10設計風格向其他平台靠攏的機會，更方便的從IOS及Android平台將應用移植到Windows 10，或者對原有的Metro版本進行最佳化，保證品牌和設計的統一性。

　　2.很快，通過免費升級到Windows 10的PC使用者將會佔絕大多數，所以在為跨平台 app進行設計時應以視窗模式鍵鼠體驗為基準進行設計，再保證全屏觸控模式的可用性。

　　總結：

　　這一次，微軟再次徹底的顛覆了自己，也許我們開始從Windows 10身上看到其他平台的影子，也許曾經獨樹一幟的Metro UI即將與我們告別，但是從目前的體驗來看，筆者認為Windows 10毫無疑問是變得更優秀了，只不過跨平台統一這條路是否好走，未來還有待驗證。現在，背負著改變微軟命運這個沉重使命的Windows 10即將起航，祝願它。