動(dòng)漫、電影作為影視作品，難免涉及到UI（人機(jī)交互界面）的鏡頭。直接使用現(xiàn)實(shí)中存在的界面，很有可能引發(fā)糾紛。

除去那些廢萌作品里粗制濫造的日式UI設(shè)計(jì)之外，為了提升作品的時(shí)髦度科幻感，許多作品也會(huì)在UI上下大功夫。比如夏日大作戰(zhàn)的 OZ World，EVA 中的 MAGI，刀劍神域中的游戲界面等等……

當(dāng)然，長(zhǎng)門(mén)大萌神這樣的可攻略類(lèi)對(duì)人用終端也不在考慮之列。

輝光

輝光這個(gè)界面不僅僅在動(dòng)漫中，在許多科幻作品中都是非常受歡迎的一種設(shè)計(jì)。不過(guò)，輝光這個(gè)名字是我自己取的。我們先來(lái)看一個(gè)典型的輝光設(shè)計(jì)的界面：

EVA Q

在這個(gè)鏡頭中，赤木律子所面對(duì)的這個(gè)界面就是典型的輝光設(shè)計(jì)。在我的定義中，我將擁有以下幾種特點(diǎn)的界面歸類(lèi)為“輝光”：

歷代 EVA 作品中的界面設(shè)計(jì)都是典型的輝光界面，從 EVA 中我們也不難看出這種界面的優(yōu)勢(shì)。首先是它的反差比較大，用戶(hù)能夠很直觀(guān)的明確界面上的全部信息。我們尚不明確為何在連大型機(jī)器人都能夠制作的出來(lái)的未來(lái)還在使用這種單色設(shè)計(jì)，姑且認(rèn)為是在 EVA 的背景下只有這種單色設(shè)計(jì)才能進(jìn)行懸浮顯示。

事實(shí)上，輝光設(shè)計(jì)本身也非常適合懸浮顯示（無(wú)顯示器顯示）。因?yàn)樵趥鹘y(tǒng)設(shè)計(jì)中，空白的區(qū)域?yàn)榱四軌蚝椭黝}元素有較大的反差往往大面積的使用淺背景色，且界面的設(shè)計(jì)有過(guò)多的 3D 凸起和明暗變化。這些設(shè)計(jì)細(xì)節(jié)在傳統(tǒng)顯示器中有很好的顯示效果，但是如果用在懸浮顯示中，就會(huì)對(duì)視線(xiàn)造成干擾。

想象一下頭圖中機(jī)械戰(zhàn)甲中的設(shè)計(jì)如果替換成 Mac 或是 Win8 風(fēng)格，那么鋼鐵俠的視野將被全部遮擋。

由于輝光完全采用單色設(shè)計(jì)，所以在同一個(gè)屏幕（顯示層）上沒(méi)有多個(gè)窗口的概念，構(gòu)成多個(gè)窗口的分割邊框有可能造成視覺(jué)焦點(diǎn)障礙。

不同的單色調(diào)會(huì)產(chǎn)生出不同的效果，如暖黃色會(huì)給人以懷舊的感覺(jué)：

命運(yùn)石之門(mén)中的時(shí)間線(xiàn)變動(dòng)儀給人以超懷舊的感覺(jué)

相比之下，《創(chuàng)：戰(zhàn)績(jī)》中的藍(lán)色光暈則給人極強(qiáng)的科幻感。

同時(shí)，單色設(shè)計(jì)和透明/黑色背景也有很好的環(huán)境適應(yīng)性。比如在 EVA 中，除去在原本就呈現(xiàn)出深紅色的背景下，輝光界面都能很好的辨識(shí)。

關(guān)于這種設(shè)計(jì)的靈感，我認(rèn)為最早是從單色示波器演變而來(lái)。單色示波器的熒光線(xiàn)條與早期的一些科幻影視作品中的界面設(shè)計(jì)十分類(lèi)似。于是，這種印象就一直留在了人們心中保留了下來(lái)，即便后來(lái)彩色顯示技術(shù)已經(jīng)非常成熟，但在科幻作品中，單色熒光的輝光設(shè)計(jì)仍然是十分流行的科幻元素之一。

在目前顯示世界的設(shè)計(jì)中，大概只有 Android 的 Holo Dark 與輝光類(lèi)似。與 Flat 的本質(zhì)區(qū)別在于輝光的線(xiàn)條是立體且自發(fā)光的，它的原型是單色示波器或是彩色霓虹燈，可以理解為一種在特定環(huán)境下產(chǎn)生的 UI 在之后的顯示技術(shù)進(jìn)步之后的浪漫懷舊。

侘寂

自魅族后，侘寂這個(gè)詞就被用爛了。那么，侘寂究竟是什么？根據(jù)百度百科的解釋?zhuān)簛骷牛à铯?さび/wabi sabi）是日本美學(xué)意識(shí)的一個(gè)組成部分，一般指的是樸素又安靜的事物。它源自小乘佛法中的三法印（諸行無(wú)常、諸法無(wú)我、涅盤(pán)寂靜），尤其是無(wú)常。所以對(duì)于這個(gè)詞，我們或可以用“禪寂”來(lái)理解。

用這個(gè)定義來(lái)做界定的話(huà)，老羅、魅族之流的UI自然絕對(duì)算不上侘寂。事實(shí)上，能夠算得上侘寂的UI設(shè)計(jì)真的很少見(jiàn)。但是值得慶幸的是，在2012年剛剛動(dòng)畫(huà)化的一部作品里所使用的界面剛好符合這個(gè)定義。

嗯，看到這個(gè)界面如果是二次元宅的話(huà)都應(yīng)該能有印象吧，這就是刀劍神域中 SAO 游戲的系統(tǒng)界面。半透明設(shè)計(jì)，白色底，亮色配色，小清新風(fēng)格，單色圖標(biāo)。

當(dāng)然，不只是顏色上，對(duì)話(huà)窗的彈出和回彈效果，觸摸時(shí)的輕微高光，順滑的過(guò)渡動(dòng)畫(huà)，界面既不生硬也不過(guò)度。界面的設(shè)計(jì)整體給人以簡(jiǎn)單明了卻又不簡(jiǎn)陋的感覺(jué)，這便是所謂的侘寂。

單就這個(gè)設(shè)計(jì)而言，動(dòng)畫(huà)中 SAO 的界面設(shè)計(jì)幾乎秒掉目前顯示世界中所有宣稱(chēng)”極簡(jiǎn)主義設(shè)計(jì)“的產(chǎn)品。當(dāng)然，這有一大部分原因是因?yàn)?SAO 并不是一個(gè)真正存在的產(chǎn)品，因此不用考慮到累計(jì)不斷的需求更新的緣故。但是，不可否認(rèn)的是，作為一款網(wǎng)游的內(nèi)置 UI，SAO 的設(shè)計(jì)在滿(mǎn)足用戶(hù)需求的情況下（登出不算）做到了最簡(jiǎn)。

在現(xiàn)實(shí)世界中，目前只有 Google 的網(wǎng)頁(yè)版（還有 Google Glass）類(lèi)似于這種設(shè)計(jì)。但是，作為一個(gè) Google Plus 的用戶(hù)表示……嗯，這種設(shè)計(jì)在成熟之前還是謹(jǐn)慎嘗試比較好。

茅場(chǎng)晶彥，不愧是既會(huì)做硬件又會(huì)做軟件，還能做前端的男人，谷歌喊你去做設(shè)計(jì)師！

擬物

擬物設(shè)計(jì)在動(dòng)漫作品中事實(shí)上是很常見(jiàn)的，由于突破了顯示器的障礙，在未來(lái)的一些世界中，導(dǎo)航用的數(shù)碼伴侶已經(jīng)取代了簡(jiǎn)單的人機(jī)交互界面。

擬物的設(shè)計(jì)最直觀(guān)的好處就是讓用戶(hù)能夠很快速的上手，明白每個(gè)界面的功能是什么：

加速世界中的血槽

但是，擬物設(shè)計(jì)的問(wèn)題在于視覺(jué)疲勞，和設(shè)計(jì)復(fù)雜。而且，只能在特定的環(huán)境下使用。為某一系統(tǒng)開(kāi)發(fā)的擬物界面，很難在不做修改的情況下移植到其他系統(tǒng)去，兼容性遠(yuǎn)沒(méi)有輝光和侘寂風(fēng)格高。正如老羅詬病 iOS 那樣，為了讓擬物擁有更好地兼容性，蘋(píng)果強(qiáng)制的給每一個(gè)圖標(biāo)增加了一個(gè)圓角矩形的限制，這個(gè)規(guī)定使非常有意義的。

擬物風(fēng)格如果不用邊框加以限制，將會(huì)顯得非常凌亂。尤其是在懸浮顯示技術(shù)發(fā)達(dá)的動(dòng)漫和科幻作品中，擬物將會(huì)引發(fā)”哪里是界面，哪里是真實(shí)物體“的混亂。

其他

雖然并不是一一對(duì)應(yīng)，但是 iOS 和 Android 的設(shè)計(jì)都能在動(dòng)漫作品中找到自己的影子。而作為「三大」移動(dòng)系統(tǒng)之一的 Windows Phone 則幾乎找不到與其近似的設(shè)計(jì)。不知道這是巧合還是因?yàn)樗鼘?shí)在是太……

由于懸浮顯示技術(shù)和無(wú)邊框設(shè)計(jì)的普及，在動(dòng)漫作品中UI的設(shè)計(jì)比現(xiàn)實(shí)世界中的設(shè)計(jì)要開(kāi)放的多。在細(xì)節(jié)上，圓形和多邊形（蜂巢形）的控件和窗口也比現(xiàn)實(shí)世界的要多。原因是因?yàn)槠聊徊辉偈且粋€(gè)簡(jiǎn)單的矩形，因此可以不用考慮與顯示范圍貼合的問(wèn)題。

圓形和多邊形的使用，更符合在特殊環(huán)境下的需求。比如圓形可以用于瞄準(zhǔn)系統(tǒng)，多邊形的窗口則為與臨近窗口之間進(jìn)行貼合交互提供了更多的可用邊。

不過(guò)，不論是在科幻作品中還是在現(xiàn)代作品中，所有那些看起來(lái)很順眼的動(dòng)漫 UI 都有一個(gè)共同特點(diǎn)：整部作品的界面風(fēng)格統(tǒng)一。因此，所有那些試圖在 iOS 上弄 Holo，在 Android 上做 Metro，在 Winodws Phone 上搞擬物的設(shè)計(jì)師，你們都出局了，懂么？

原文已發(fā)表至萌數(shù)碼