關(guān)于微軟全新語(yǔ)言Fluent Design，你要知道的都在這兒
近日，Build2017大會(huì)上微軟宣布采用全新的Microsoft Fluent Design System，并展示了Win10流暢設(shè)計(jì)體系，我們驚喜地看到微軟在設(shè)計(jì)上終于發(fā)力，迎來(lái)顛覆性的改變。
微軟Modern UI，谷歌Material design和蘋(píng)果iOS并稱(chēng)為三大主流設(shè)計(jì)語(yǔ)言。而微軟Modern UI設(shè)計(jì)風(fēng)格一直為人所詬病，規(guī)整的方塊磁貼格局、單調(diào)的配色、枯燥的文字界面…從顏值上而言，蘋(píng)果、谷歌簡(jiǎn)直在碾壓微軟，近些年來(lái)在移動(dòng)端市場(chǎng)占有率上幾家的差距也是越來(lái)越大。
“功能再?gòu)?qiáng)大，我也理解不了微軟爸爸的審美”
現(xiàn)在微軟放大招！大會(huì)上，微軟全球執(zhí)行副總裁特里?梅爾森（Terry Myerson）說(shuō)到：“此次的微軟系統(tǒng)將帶來(lái)直觀、和諧、響應(yīng)迅速、兼容廣泛的跨設(shè)備體驗(yàn)與互動(dòng)操作。”光是看官方發(fā)布的視頻就能感受到微軟與谷歌、蘋(píng)果在設(shè)計(jì)上并肩的野心。
此次帶來(lái)的全新語(yǔ)言Fluent Design System（以下簡(jiǎn)稱(chēng)FDS）主要包括五大核心元素：Light（光感）、Depth（深度）、Motion（動(dòng)畫(huà)）、Material（材質(zhì)）和 Scale（縮放）。我們將從這五個(gè)方面展開(kāi)說(shuō)明FDS的設(shè)計(jì)理念，與谷歌Material Design和蘋(píng)果iOS又有何相似之處，真的會(huì)成為微軟劃時(shí)代的設(shè)計(jì)語(yǔ)言嗎？
01
Light（光感）
“神說(shuō)要有光，世上便有了光。”
設(shè)計(jì)中光的重要性不言而喻，Joe Belfiore在大會(huì)上表示：新的light元素可以創(chuàng)造良好的氛圍，讓?xiě)?yīng)用多一種空間的概念。在界面交互中能夠強(qiáng)烈吸引用戶(hù)的注意力，通過(guò)塑造光感的明暗度來(lái)引導(dǎo)用戶(hù)，比如我們看到鼠標(biāo)懸停時(shí)發(fā)光的按鈕、圖標(biāo)點(diǎn)亮其他元素、高光漸變都給用戶(hù)以更人性化的視覺(jué)體驗(yàn)。
這一點(diǎn)上，谷歌Material Design同樣運(yùn)用light引入shadow，建立其標(biāo)志性的卡片陰影輪廓。而相比谷歌略顯固化的陰影疊加，F(xiàn)DS中主動(dòng)變化的高光顯得更為生動(dòng)有趣，更貼合真實(shí)世界中自然的設(shè)計(jì)。
02
Depth（深度）
創(chuàng)新性的改變，打破二維平面的局限拓展至三維空間領(lǐng)域。以往微軟所經(jīng)歷的幾個(gè)設(shè)計(jì)階段，直至Modern UI都離不開(kāi)單調(diào)的平面設(shè)計(jì)。而現(xiàn)在運(yùn)用depth元素，與物理環(huán)境相結(jié)合，將重要的內(nèi)容呈現(xiàn)在用戶(hù)面前，營(yíng)造縱深變化的錯(cuò)覺(jué)，能夠極大地減少視覺(jué)疲勞，給人以更豐富的感官體驗(yàn)。
而谷歌Material Design早已嘗試將三維空間引入設(shè)計(jì)。提出z軸概念，利用z軸的深度，更好地打造空間感，使界面的每個(gè)元素層級(jí)鮮明，突出主次與重要程度，同時(shí)也加強(qiáng)UI視覺(jué)上的表現(xiàn)力。
你們發(fā)現(xiàn)了嗎？微軟和谷歌都在三維空間設(shè)計(jì)領(lǐng)域的深入研究，更易于展現(xiàn)虛擬物體在三維空間中的應(yīng)用，隨著AR/VR技術(shù)的發(fā)展，更具未來(lái)前瞻性。
03
Motion（動(dòng)畫(huà)）
我們都知道，好的動(dòng)效是優(yōu)秀產(chǎn)品重要的組成要素之一，微軟自然不會(huì)忽視這一環(huán)。Motion元素能為用戶(hù)提供更多好看、互動(dòng)性強(qiáng)的動(dòng)畫(huà)，吸引用戶(hù)的注意力，讓表達(dá)充分而細(xì)膩。并且可以看到，微軟此次創(chuàng)造出更色彩絢麗的動(dòng)效，窗口內(nèi)部小圖標(biāo)和元素都能夠承載大量的動(dòng)畫(huà)效果，好感度up
說(shuō)到這里，又要提谷歌的Material Design，以一種優(yōu)雅、流動(dòng)的方式來(lái)體現(xiàn)動(dòng)效，構(gòu)建與真實(shí)世界相連的空間關(guān)系。比如優(yōu)雅的轉(zhuǎn)場(chǎng)效果、按壓/釋放觸控漣漪、富有層次的時(shí)間感…這些都是Material Design中Motion的經(jīng)典動(dòng)效案例。
04
Material（材質(zhì)）
從剛才所說(shuō)的光感、深度和特效都在試圖建立與物理世界的聯(lián)系，而材質(zhì)更是要模仿現(xiàn)實(shí)世界中各種物質(zhì)，讓用戶(hù)感受真實(shí)觸感的重要一環(huán)。
比如微軟這次所回歸的毛玻璃效果，對(duì)于這種半透明光影漸變的效果我們似乎毫無(wú)抵抗力。其實(shí)Win7時(shí)代就有毛玻璃特效，而蘋(píng)果則將這一特性發(fā)揮得淋漓盡致。從z軸維度出發(fā)的設(shè)計(jì)，用它來(lái)制造出覆蓋內(nèi)容之上的感覺(jué)，令界面元素更有層級(jí)，更有趣。
谷歌的Material Design從命名就可以看到Material材質(zhì)的理念，而它的靈感正是來(lái)源于對(duì)紙和墨水的研究，其最重要的特征就是卡片信息的層疊、合并、分離，擁有現(xiàn)實(shí)世界的厚度與質(zhì)感，能夠自由伸展變形又是它的魔力所在。
不論是微軟全新發(fā)布的語(yǔ)言，還是谷歌、蘋(píng)果，對(duì)于真實(shí)材質(zhì)在設(shè)計(jì)中的運(yùn)用都非常重視。設(shè)計(jì)與生活理念相結(jié)合，讓用戶(hù)能夠產(chǎn)生更自然的感知或許是材質(zhì)如此重要的原因，你覺(jué)得呢？
05
Scale（縮放）
可以看到微軟在幾個(gè)不同規(guī)模的交互場(chǎng)景中，不論是小屏幕觸控還是VR實(shí)景，都能夠滿(mǎn)足。而scale元素最顯著的一點(diǎn)在于，是在VR/AR技術(shù)中的運(yùn)用，微軟打破這一局限，將虛擬物體的縮放應(yīng)用在UI交互中，還提到許多前瞻性的概念設(shè)計(jì)。
我們會(huì)預(yù)見(jiàn)在下一個(gè)互聯(lián)網(wǎng)經(jīng)濟(jì)浪潮，微軟對(duì)未來(lái)的布局投放在人工智能領(lǐng)域。從可穿戴智能設(shè)備HoloLens，去年宣布推出混合現(xiàn)實(shí)技術(shù)Mixed Reality（MR）到成立人工智能研究部門(mén)…此次微軟推出的全新語(yǔ)言FDS與其戰(zhàn)略布局相一致，讓UI與真實(shí)世界相融合，或許不僅僅是應(yīng)用于Win10的新語(yǔ)言，而是有更深探索。
這方面，谷歌和蘋(píng)果的想法也不謀而合，人工智能是新一代的人機(jī)交互。所強(qiáng)調(diào)的光感、深度、動(dòng)效、材質(zhì)和縮放，搭建出來(lái)的是一個(gè)可感知的真實(shí)世界，隨著技術(shù)的不斷發(fā)展，在日常交互設(shè)計(jì)和應(yīng)用界面，將與用戶(hù)產(chǎn)生更親密的聯(lián)系。
新版Windows還未發(fā)布，從此次微軟發(fā)布的全新語(yǔ)言Fluent Design System看到對(duì)未來(lái)的美好暢想，看到他們?cè)谠O(shè)計(jì)上顛覆性的創(chuàng)新，開(kāi)始學(xué)會(huì)如何優(yōu)雅地為用戶(hù)展示復(fù)雜信息。對(duì)于曾經(jīng)被谷歌Material Design和蘋(píng)果iOS所碾壓的局勢(shì)在悄悄開(kāi)始發(fā)生變革，我們拭目以待~
連微軟爸爸都知道
好的設(shè)計(jì)才能抓住用戶(hù)的心
到Designup
找一位優(yōu)秀設(shè)計(jì)師
讓你的產(chǎn)品脫穎而出
評(píng)論
評(píng)論
推薦評(píng)論
暫無(wú)評(píng)論哦，快來(lái)評(píng)論一下吧！
全部評(píng)論（0條）