在剛剛舉辦的2017build大會(huì)中，微軟正式發(fā)布了全新的設(shè)計(jì)系統(tǒng)Fluent Design System（以下簡(jiǎn)稱FDS）椭盏，設(shè)計(jì)的小伙伴們紛紛激動(dòng)起來呵俏。多年來，在設(shè)計(jì)領(lǐng)域范嘱，蘋果和google已經(jīng)占領(lǐng)了絕大部分市場(chǎng)送膳，很少有設(shè)計(jì)師談?wù)撐④浀脑O(shè)計(jì)語言，終于丑蛤，這次微軟看起來得到了聚光燈叠聋。
我們先來了解下FDS的名稱好了：
今年早些時(shí)候，微軟的Neon項(xiàng)目泄露部分截圖受裹，相比之前的設(shè)計(jì)風(fēng)格碌补，增加了毛玻璃效果和動(dòng)效的應(yīng)用，這次微軟將這種風(fēng)格正式命名為FDS棉饶。大家應(yīng)該都知道微軟的Metro設(shè)計(jì)風(fēng)格厦章，但之前被德國一家連鎖超市占用了商標(biāo)，雖然后來的設(shè)計(jì)風(fēng)格都是Metro的繼承者照藻，但微軟也只能停用了袜啃。后來將其更名為Microsoft Deisgn Language（WDL），這個(gè)不具有識(shí)別性名字加上本身并不出彩幸缕，應(yīng)該很多設(shè)計(jì)師都并不了解群发。這次微軟可能意識(shí)到需要一個(gè)能夠描述和推廣的名字晰韵，所以，F(xiàn)DS就這樣誕生了熟妓。
“Fluent”不僅僅指視覺表現(xiàn)雪猪，也包括交互體驗(yàn)。從“設(shè)計(jì)語言”到“設(shè)計(jì)系統(tǒng)”起愈，微軟似乎展示了它的愿景：不只是一種設(shè)計(jì)風(fēng)格只恨，而是能夠應(yīng)用于跨越所有設(shè)備（虛擬現(xiàn)實(shí)、手機(jī)告材、平板坤次、電腦等等）的設(shè)計(jì)系統(tǒng)。單純看名字斥赋，確實(shí)比之前的MDL好了太多。
回到官方發(fā)布的內(nèi)容中产艾，首先視頻看起來的確很酷炫疤剑，開頭的一段迅速的文字切換，表明了基本的設(shè)計(jì)原則闷堡。我們能看出微軟更加注重表現(xiàn)層和通用化隘膘。
建立清晰的、表現(xiàn)力的杠览、形象化的弯菊、通用的、一致的踱阿、輕松的管钳、富于想象力的、影像化的软舌、自然的才漆、有魅力的、 適應(yīng)的佛点、包容性的醇滥、吸引人的設(shè)計(jì)。
接下來主要展示了五個(gè)核心要素:Light（光）超营、Depth（深度）鸳玩、Motion（動(dòng)效）、Material（材料）演闭、Scale（縮放）
Light：
官方表示通過光吸引用戶的注意力不跟，光是營(yíng)造氛圍、強(qiáng)調(diào)信息的工具船响。光確實(shí)是非常重要的元素躬拢，自然中的一切都依賴于光躲履，光如果使用的恰到好處，設(shè)計(jì)會(huì)更加細(xì)膩和自然聊闯。目前視頻中展示的幾個(gè)案例都是將其應(yīng)用于按鈕的Hover狀態(tài)工猜。這感覺對(duì)于Hololens更有意義，在3d環(huán)境中菱蔬，沒有鼠標(biāo)指向篷帅，通過發(fā)光效果反饋給用戶層次與焦點(diǎn)還是很有幫助的。不過表示疑惑的是拴泌，發(fā)光效果是否也適用于移動(dòng)端和web端魏身？而且，光依賴于更深的背景蚪腐，那么這樣是否會(huì)限制淺色背景的使用箭昵？
Depth：
FDS強(qiáng)調(diào)更大程度的利用層次和對(duì)象的關(guān)系，來幫助用戶理解事物之間的聯(lián)系回季，通過擴(kuò)展空間感家制、豐富視覺體驗(yàn)，給用戶打造一個(gè)沉浸的空間泡一。深度本質(zhì)上說也是模擬真實(shí)世界的構(gòu)建方式颤殴。在2D環(huán)境中，"深度"應(yīng)用最完整的鼻忠，非GOOGLE的MD莫屬了涵但，它強(qiáng)調(diào)使用光、材質(zhì)帖蔓、投影構(gòu)建一個(gè)3D環(huán)境矮瘟。這兩年流行的網(wǎng)頁設(shè)計(jì)趨勢(shì)也是應(yīng)用深度和視差效果突出其空間感和信息的主次。而在虛擬現(xiàn)實(shí)中讨阻，深度可以說是營(yíng)造真實(shí)感覺的必備要素芥永，很多VR/AR設(shè)備中已經(jīng)應(yīng)用了深度的概念。
Motion：
動(dòng)效如今得到越來越多的重視钝吮，F(xiàn)DS希望通過動(dòng)效創(chuàng)造類似電影一樣沉浸式的體驗(yàn)埋涧。如果能將動(dòng)效很好的融入產(chǎn)品中，將會(huì)極大增加產(chǎn)品的吸引力奇瘦，也能無形擴(kuò)展有限界面的空間棘催。這里仍然要提到MD，MD對(duì)動(dòng)效有完善且詳細(xì)的說明耳标，并且有很多應(yīng)用于實(shí)踐的很棒的案例醇坝。從視頻看，目前FDS并沒有做出超過MD的感覺。
Material：
FDS終于將微軟之前使用過的Aero（微軟針對(duì)visa的一種新型用戶界面呼猪，使用了透明毛玻璃效果）風(fēng)格界面拿了回來画畅，但這次增加了物質(zhì)的質(zhì)感和紋理，效果看起來更加細(xì)膩真實(shí)宋距，有種回歸擬物化設(shè)計(jì)的感覺轴踱。正如官方所講：將真實(shí)世界的材質(zhì)引入到數(shù)字世界中，用戶將會(huì)伸手觸摸設(shè)計(jì)谚赎。從這點(diǎn)看淫僻，F(xiàn)DS比Metro純扁平化的風(fēng)格還是進(jìn)化了不少。不過壶唤，這部分在視頻中主要強(qiáng)調(diào)了毛玻璃（其實(shí)感覺更像亞克力）的使用雳灵，并沒有展示更多內(nèi)容，期待能看到更多更好的材質(zhì)的運(yùn)用闸盔。
Scale：
這點(diǎn)算是FDS超越其他設(shè)計(jì)語言的利器了悯辙，從2D跨越到3D，在新的形勢(shì)中創(chuàng)新迎吵。雖然目前AR/VR還有待發(fā)展笑撞，但隨著技術(shù)的不斷突破，未來的趨勢(shì)擋不住钓觉。對(duì)于未來3D的虛擬產(chǎn)品，縮放有非常大的想象空間坚踩。
小結(jié)一下：
視頻的視覺沖擊力還是很強(qiáng)大的荡灾，非常具有未來感。仔細(xì)去看的話瞬铸，我們能發(fā)現(xiàn)很多其他設(shè)計(jì)語言中似曾相識(shí)的元素批幌，比如毛玻璃效果、各種動(dòng)效嗓节、深度荧缘。簡(jiǎn)單點(diǎn)描述的話，F(xiàn)DS可以說是iOS的視覺表現(xiàn)+MD的交互邏輯+Metro UI+部分?jǐn)M物風(fēng)格的混合體拦宣。不過風(fēng)格互相借鑒也不是第一次截粗，當(dāng)年ios和google也是借鑒了metro的風(fēng)格。不管怎么說鸵隧，對(duì)于微軟绸罗，這次終于超越了Metro的平坦世界，也更加清晰的解釋了FDS的目標(biāo)豆瘫。
通過視頻和官方發(fā)布的內(nèi)容我們能夠看出珊蟀，微軟這次發(fā)布FDS的目的很明確，一方面是為推動(dòng)HoloLens所需外驱，并為將來的paint 3D等一些3D體驗(yàn)鋪路育灸。另外一方面腻窒，如MD和iOS核心思想一樣，微軟這次表示磅崭，F(xiàn)DS的主要目的是使用一種設(shè)計(jì)語言幫助開發(fā)人員開發(fā)更吸引人的應(yīng)用和體驗(yàn)儿子，并將這種語言應(yīng)用到各種設(shè)備上。
幾個(gè)優(yōu)點(diǎn)
FDS對(duì)于設(shè)計(jì)師來說還是有很多學(xué)習(xí)和借鑒意義的绽诚。
1典徊、強(qiáng)調(diào)更加自然、沉浸的體驗(yàn)
FDS這次引入了光恩够、深度卒落、材料等自然中的設(shè)計(jì)元素，對(duì)比Metro蜂桶，更加強(qiáng)調(diào)設(shè)計(jì)與真實(shí)環(huán)境的關(guān)系儡毕。FDS的核心原則是不僅要美觀，還要讓用戶在使用過程中感受到自然扑媚、流暢腰湾。隨著人工智能的發(fā)展，人與信息的交互也從0D擴(kuò)展到4D疆股，虛擬與現(xiàn)實(shí)的界限也會(huì)越來越模糊费坊，微軟通過FDS告訴大家，未來身邊可能是十分自然的“無交互”狀態(tài)旬痹。
2附井、從2D擴(kuò)展到3D，推廣至所有平臺(tái)和設(shè)備
微軟Windows開發(fā)者平臺(tái)的VP Kevin Gallo表示两残，F(xiàn)DS的最大區(qū)別是能同時(shí)應(yīng)用于2D和3D環(huán)境中永毅，另外，微軟對(duì)投資HoloLens和構(gòu)建混合現(xiàn)實(shí)生態(tài)系統(tǒng)非常感興趣人弓。Gallo說：“我們之所以推出FDS是因?yàn)槲覀兿胍屇隳軌驑?gòu)建一個(gè)通用所有設(shè)備的系統(tǒng)沼死。”
MD風(fēng)格能夠比iOS的視覺風(fēng)格應(yīng)用更為廣泛的原因之一是：MD的設(shè)計(jì)語言和規(guī)范使其更容易實(shí)現(xiàn)于不同設(shè)備崔赌，而非僅僅是移動(dòng)端設(shè)計(jì)意蛀。而這次微軟的FDS除了適用于所有的2D環(huán)境，更是潮流的引入至虛擬空間和交互上峰鄙，如VR/AR浸间。正如Metro當(dāng)年引領(lǐng)了扁平化的趨勢(shì)，F(xiàn)DS很有可能引領(lǐng)了2D到3D的趨勢(shì)吟榴。
一些疑問
不過魁蒜，雖然視頻看起來很美好，回到現(xiàn)實(shí)，幾個(gè)產(chǎn)品截圖看來FDS完成度還不是很高兜看，真實(shí)產(chǎn)品是否能夠貫徹整個(gè)風(fēng)格我們還不得而知锥咸，因此提出幾點(diǎn)疑問：
1、沒有面向開發(fā)者和設(shè)計(jì)師提供建立這種風(fēng)格的明確的指導(dǎo)原則
推廣任何設(shè)計(jì)語言都需要清晰的原則和規(guī)范指導(dǎo)细移，自身應(yīng)用的實(shí)踐也非常重要搏予。正如iOS和MD，除了提供了詳盡的規(guī)范（MD甚至每個(gè)元素控件都有spec）弧轧，他們本身的應(yīng)用作為設(shè)計(jì)和開發(fā)的典范雪侥，吸引更多的第三方模仿并接入。而以往微軟本身的應(yīng)用都非常簡(jiǎn)陋精绎，對(duì)于復(fù)雜的應(yīng)用速缨，F(xiàn)DS并沒有什么深入解釋的文件和說明。這次微軟承諾會(huì)做的更好代乃，希望如此旬牲。
2、沒有明確的時(shí)間排期和規(guī)劃
微軟表示搁吓，在秋季的WIN10更新中將會(huì)應(yīng)用一部分FDS的元素原茅，但整個(gè)設(shè)計(jì)系統(tǒng)是一個(gè)長(zhǎng)期的項(xiàng)目。至于有多長(zhǎng)期堕仔，微軟并沒有明確的發(fā)布日程和里程碑擂橘。這次視頻展示的內(nèi)容，很明顯只是概念稿摩骨，而這看似酷炫的設(shè)計(jì)應(yīng)用到實(shí)踐中究竟什么樣贝室，沒有人知道。畢竟仿吞，雖然之前的metro引領(lǐng)了扁平化風(fēng)潮，但實(shí)際產(chǎn)品卻差強(qiáng)人意捡偏。沒有明確的規(guī)劃唤冈，讓人有種不安的感覺。希望這次微軟不要讓我們白激動(dòng)一場(chǎng)银伟。
3你虹、華麗的系統(tǒng)會(huì)占用很多資源
FDS華麗的視覺效果、酷炫的動(dòng)效可以想象將會(huì)占用更多的磁盤資源彤避。在用戶現(xiàn)有設(shè)備的基礎(chǔ)上傅物，新的設(shè)計(jì)是否真的能“Fluent”？普通用戶是否會(huì)為了體驗(yàn)漂亮的系統(tǒng)而犧牲時(shí)間和資源琉预？這讓我想起Facebook幾年前推出的應(yīng)用Paper董饰，漂亮的設(shè)計(jì)吸引了很多人的眼球，結(jié)果在去年已經(jīng)被迫關(guān)閉。因此卒暂，形式雖然重要啄栓，功能才是關(guān)鍵。
最后
從以往的經(jīng)驗(yàn)來看也祠，微軟的設(shè)計(jì)概念遠(yuǎn)遠(yuǎn)好過于產(chǎn)品昙楚，經(jīng)過這么多年，windows系統(tǒng)仍然很難用诈嘿。當(dāng)然隨著時(shí)間的推移堪旧，微軟可能會(huì)向我們證實(shí)FDS是如何應(yīng)用于實(shí)踐的。希望這次不僅僅是一群設(shè)計(jì)師的自嗨奖亚。如果能將視頻中的絢麗且細(xì)膩的效果應(yīng)用于實(shí)際產(chǎn)品淳梦，那么將是非常成功的。
