“Metro”,移動(dòng)設(shè)備視覺(jué)語(yǔ)言的新新人類
何謂“Metro”?“Metro”本意是指“地鐵”??v觀機(jī)場(chǎng)、地鐵、公交線路圖等,會(huì)發(fā)現(xiàn)這些導(dǎo)視設(shè)計(jì)都具有高度概括性,對(duì)比度強(qiáng)烈等特點(diǎn),并被用來(lái)指導(dǎo)人們更快的找到自己要去的目的地。
“Metro”之源
一個(gè)移動(dòng)設(shè)備的界面設(shè)計(jì)語(yǔ)言怎么會(huì)跟地鐵掛上鉤呢?每一次改革創(chuàng)新的背后,都有一個(gè)主導(dǎo)思想。微軟這次推出的Windows Phone 7(以下簡(jiǎn)稱WP7)背后也存在著一個(gè)設(shè)計(jì)語(yǔ)言,設(shè)計(jì)思想,這個(gè)設(shè)計(jì)語(yǔ)言正是源于交通導(dǎo)視圖的這些特點(diǎn)而產(chǎn)生的靈感!在微軟內(nèi)部這種設(shè)計(jì)語(yǔ)言被命名為“Metro”。
“Metro”之新
1.圖標(biāo)
WP7整個(gè)界面展現(xiàn)出的“圖標(biāo)”完全跟 “圓角、漸變、陰影、光澤感”說(shuō)拜拜,用純二維以及高度概括性弱化了視覺(jué)上的復(fù)雜性,讓用戶沒(méi)有過(guò)多的去關(guān)注圖標(biāo)本身,而是增加其辨識(shí)性和標(biāo)識(shí)性,達(dá)到強(qiáng)化內(nèi)容和信息的目的。
2.界面布局
Home頁(yè)沒(méi)有像九宮格那樣整齊排布,而是用一個(gè)一個(gè)單一的色塊平面化的對(duì)界面進(jìn)行大膽的分割。其他的界面也去掉了那些繁復(fù)冗余的設(shè)計(jì)細(xì)節(jié),沒(méi)有過(guò)多絢麗的色彩,沒(méi)有花哨的光影,強(qiáng)調(diào)用文字信息進(jìn)行排版,更多的是關(guān)注內(nèi)容本身,更關(guān)注用戶想要什么,用一種銳利直白的視覺(jué)語(yǔ)言來(lái)表達(dá)了真實(shí)的內(nèi)容。
3.字體
字體是“Metro”展現(xiàn)其設(shè)計(jì)美感的一個(gè)重點(diǎn),它主要使用的是較細(xì)的Segoe UI字體,通過(guò)把字體放大、縮小來(lái)得到好的效果和設(shè)計(jì)感。在“Metro”中沒(méi)有需要操作的復(fù)雜的界面來(lái)轉(zhuǎn)移用戶對(duì)內(nèi)容的注意,取而代之的是用戶本身關(guān)注的內(nèi)容,簡(jiǎn)而言之:內(nèi)容即界面!這樣極大地減少了用戶視覺(jué)上的干擾、增強(qiáng)了引導(dǎo)性,讓原本“擁擠”了的各種內(nèi)容和信息的界面顯得更加地“透氣”。
在一個(gè)充斥著各種漸變和各種效果的時(shí)代,WP7能如此大膽地拋開了傳統(tǒng)視覺(jué)設(shè)計(jì)語(yǔ)言的束縛,不惜代價(jià)地提高視覺(jué)上的清晰度和辨識(shí)度,把追求簡(jiǎn)潔發(fā)揮到了極致。
“Metro”之“優(yōu)”與“憂”
不可否認(rèn),“Metro”在視覺(jué)設(shè)計(jì)上的確有著其獨(dú)到之處,而事實(shí)上,其“新”更是理念上的,這種理念上的創(chuàng)新設(shè)計(jì)在某些方面擁有一定的優(yōu)勢(shì),具體體現(xiàn)為以下幾個(gè)方面:
1.信息的完整體現(xiàn)
傳統(tǒng)的手機(jī)終端已經(jīng)被Application包裹得越來(lái)越緊密,而你的生活和需求卻不是一個(gè)一個(gè)單獨(dú) 的App所涵蓋的,而是穿梭在不同類型的信息里。是否有新的信息、電話或者有新的狀態(tài)更新,可以掃一眼就看到,這種強(qiáng)調(diào)類似SNS信息流的設(shè)計(jì)讓用戶更好地回歸到體驗(yàn)手機(jī)的本質(zhì)功能上。
WP7在概念上遵循了這種源于信息和內(nèi)容的思路,“Metro”的出現(xiàn)也正是為了消除這種概念上的不對(duì)稱,當(dāng)這種理念的核心價(jià)值表現(xiàn)在實(shí)用主義與內(nèi)容至上的時(shí)候,一切視覺(jué)上的語(yǔ)言都顯得不那么重要了。
2.Panorama
Panorama的設(shè)計(jì)采用了類似畫卷一樣的橫向滾屏的設(shè)計(jì),摒棄了傳統(tǒng)的滾動(dòng)條,使得內(nèi)容界面變得可以滾動(dòng),即讓用戶避開了一層一層的操作窗口又能一口氣瀏覽信息到底。
3.內(nèi)容至上
WP7不是在標(biāo)新立異,而是從用戶對(duì)信息的需求出發(fā)。他把極簡(jiǎn)主義,內(nèi)容至上原則帶到了移動(dòng)終端設(shè)備的視覺(jué)設(shè)計(jì)上,不能不說(shuō)是開辟了一種更強(qiáng)調(diào)實(shí)用的設(shè)計(jì)方向。
“Metro”在理念上夠新,視覺(jué)上夠酷,但它是否真的適應(yīng)當(dāng)前的移動(dòng)終端?我們不得不對(duì)其產(chǎn)生一些質(zhì)疑和擔(dān)憂:
1.對(duì)一種字體的過(guò)度依賴
拉丁字母非常配合Metro的設(shè)計(jì)理念,將簡(jiǎn)潔明快發(fā)揮到了淋漓盡致。而這就像一把雙刃劍,導(dǎo)致“Metro”過(guò)度依賴?yán)∽帜副旧硭鶐?lái)的魅力而忽略了例如中文,日文等非拉丁文。
這些語(yǔ)言是否還能在“Metro”的設(shè)計(jì)理念的引導(dǎo)下,在視覺(jué)上是延續(xù)這種字體的魅力呢?至少到目前為止我們還沒(méi)有看到有說(shuō)服力的證明。
2.視覺(jué)的單調(diào)性
純2維的圖標(biāo)有非常高的指示性,但卻缺乏一定的豐富性。
在“Metro”的視覺(jué)語(yǔ)言下,剝奪了圖標(biāo)原有的個(gè)性和情感,把其轉(zhuǎn)化成一個(gè)個(gè)沒(méi)有生命的指示牌。就像你無(wú)法指望那些交通標(biāo)識(shí)能帶給你什么驚喜和趣味,而只是冰冷生硬的指示。這對(duì)第三發(fā)開發(fā)者來(lái)說(shuō)不能不說(shuō)是一個(gè)遺憾。
3. 用戶習(xí)慣與認(rèn)可度
在iPhone,Android系統(tǒng)橫行于市的今天,可能用戶早已習(xí)慣了那種操作界面的方式,而WP7的各種操作明顯有別于市場(chǎng)上其他系統(tǒng),因此需要一定的過(guò)程和培育時(shí)間成本來(lái)讓用戶接受。早在幾年前,當(dāng)時(shí)西門子推出Xelibri從設(shè)計(jì)理念上也夠新、夠酷并轟動(dòng)一時(shí),但用戶接受程度卻不盡如人意,最后慘淡收?qǐng)?。因此,微軟在視覺(jué)和體驗(yàn)上做出如此大的變革,這不僅需要考驗(yàn)用戶的耐心,更要考驗(yàn)微軟的毅力與決心。
“Metro”之展望與啟示
其實(shí)“Metro”這個(gè)設(shè)計(jì)語(yǔ)言在之前的Zune上就有多多少少的體現(xiàn),垂直的大號(hào)文字導(dǎo)航系統(tǒng),加上扁平化的色塊,一目了然。在WP7面世后,“Metro”這個(gè)設(shè)計(jì)語(yǔ)言開始正式被大范圍系統(tǒng)化的應(yīng)用和推廣,以此設(shè)計(jì)哲學(xué)和理念匯編成的Metro book,用其簡(jiǎn)明的布局和明快的色彩對(duì)“Metro”這一設(shè)計(jì)語(yǔ)言的特色進(jìn)行了最好的詮釋。
由Xna Creator Club Online演化出來(lái)的App hub也承載了Metro的設(shè)計(jì)理念。
“Metro”作為一種新的設(shè)計(jì)語(yǔ)言出現(xiàn)在移動(dòng)終端中,更像是一種現(xiàn)象的延續(xù),記得曾看過(guò)一篇Creative Review 的文章“The New Ugly”。我們不是在這里崇拜丑陋主義,但這種思潮卻在近些年不斷地影響著整個(gè)設(shè)計(jì)界,包括倫敦2012年奧運(yùn)會(huì)標(biāo)志,WACOM的新標(biāo)志,紐約出租車標(biāo)志都成為對(duì)傳統(tǒng)審美爭(zhēng)議的焦點(diǎn)。
不管是在界面還是體驗(yàn)上,都需要有一個(gè)差異化的核心價(jià)值,當(dāng)這種體驗(yàn)的核心價(jià)值表現(xiàn)在內(nèi)容至上時(shí),無(wú)所謂對(duì)與錯(cuò),進(jìn)步或后退,所謂的視覺(jué)次于內(nèi)容,并不意味著視覺(jué)設(shè)計(jì)的地位被減弱了,相反更需要設(shè)計(jì)師去提煉“設(shè)計(jì)”。
轉(zhuǎn)載請(qǐng)注明出自”百度MUX”
- 目前還沒(méi)評(píng)論,等你發(fā)揮!