HUD和FUI風(fēng)格

1德绿、數(shù)據(jù)可視化理解

大數(shù)據(jù)可視化是什么?
大量數(shù)據(jù)的宏觀呈現(xiàn)退渗,通過簡單易觀的圖表或者其他圖形效果脆炎,把復(fù)雜繁多的數(shù)據(jù)根據(jù)業(yè)務(wù)的維度一一呈現(xiàn)出來的過程叫做數(shù)據(jù)可視化。

數(shù)據(jù)可視化有哪些風(fēng)格氓辣?


數(shù)據(jù)可視化風(fēng)格對(duì)比.png

2、FUI風(fēng)格介紹
2.1FUI風(fēng)格定義
1.FUI一提到這個(gè)詞首先想到就是漫威和 DC 科幻電影中主角的操作場(chǎng)景袱蚓,
例如漫威電影中鋼鐵俠的操作界面:


漫威電影.png

FUI 中:“U”代表用戶(User)“I”代表界面(Interface)“F”代表虛構(gòu)的(Fiction)钞啸、未來的(Future)、幻想的(Fantasy)喇潘。
概括來說 FUI 就是:虛構(gòu)的体斩、未來的、幻想的用戶界面颖低。
“科幻界面”只是 FUI 中的分支絮吵,并不能完全解釋 FUI 。

2.2FUI跟傳統(tǒng)區(qū)別
色彩
a.背景
常以深色的背景來營造強(qiáng)烈空間感忱屑,讓用戶感覺自己處在一個(gè)三維的空間當(dāng)中
如下圖蹬敲,我們能夠感受到強(qiáng)烈的空間感,數(shù)據(jù)儀表盤處于一個(gè)具有縱深感的三維世界當(dāng)中莺戒,視覺中心的數(shù)據(jù)顯示器與背景形成了鮮明的對(duì)比伴嗡。


fui背景.png

b.配色簡潔
在顏色的選擇上,借鑒了軍事設(shè)備中的配色準(zhǔn)則从铲,在殘酷的戰(zhàn)爭中“快速瘪校、準(zhǔn)確、直接”是最重要的,所以在軍事設(shè)備上多以【單一的冷色調(diào)為主】阱扬,盡量【避免多種色彩】的使用泣懊,這樣對(duì)于操作者而言更加簡單。所以 FUI 的配色設(shè)計(jì)大多以冷色調(diào)為主麻惶,對(duì)比色通常作為輔助色用以反饋重要信息
如在 007系列電影中的界面都是使用對(duì)比色反饋重要信息馍刮,如下圖中的坐標(biāo)信息都使用了紅色作為突出重要信息的設(shè)計(jì)手段。


配色.png

當(dāng)然也有大量使用同類色的情況用踩,例如 Sid Meier 中的飛船狀態(tài)頁面渠退,著重表示當(dāng)前的飛船的狀態(tài),這樣在發(fā)生異常的狀況下可以立馬發(fā)現(xiàn)脐彩。


Sid Meier 中的飛船配色.png

c.對(duì)比強(qiáng)烈
FUI 中的配色對(duì)比強(qiáng)烈碎乃,首先因?yàn)楸尘岸嘁陨钌珵橹鳎瑥?qiáng)烈的對(duì)比能夠有效的拉開頁面中的空間感惠奸。

總結(jié)
1梅誓、FUI界面具備的要素:“幻想”UI、空間感佛南、扁平化梗掰、“異形”元素、配色簡潔嗅回,對(duì)比強(qiáng)烈及穗、軍事風(fēng)格
2、FUI界面如何營造出這種精細(xì)绵载、嚴(yán)謹(jǐn)埂陆、高端的感覺:
? 線條感強(qiáng),結(jié)構(gòu)清晰娃豹,采用較多的線條焚虱、線框等幾何圖形元素;
? 排版布局工整規(guī)范懂版,色彩搭配沉穩(wěn)不花哨鹃栽,內(nèi)容復(fù)雜但有條理和秩序;
? 減少樣式的花哨躯畴,文本和色彩的樣式基本沒有太多變化起伏民鼓,也沒有特別突兀的大色塊破壞和諧;
? 增加表現(xiàn)形式的多樣:比如用更精細(xì)的圖形代替簡單的色塊蓬抄,比如用設(shè)計(jì)元素巧妙的填充了界面中不必要的留白摹察,增加細(xì)節(jié)、保證風(fēng)格完整性倡鲸。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末供嚎,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌克滴,老刑警劉巖逼争,帶你破解...
    沈念sama閱讀 219,188評(píng)論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異劝赔,居然都是意外死亡誓焦,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,464評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門着帽,熙熙樓的掌柜王于貴愁眉苦臉地迎上來杂伟,“玉大人,你說我怎么就攤上這事仍翰『罩啵” “怎么了?”我有些...
    開封第一講書人閱讀 165,562評(píng)論 0 356
  • 文/不壞的土叔 我叫張陵予借,是天一觀的道長越平。 經(jīng)常有香客問我,道長灵迫,這世上最難降的妖魔是什么秦叛? 我笑而不...
    開封第一講書人閱讀 58,893評(píng)論 1 295
  • 正文 為了忘掉前任,我火速辦了婚禮瀑粥,結(jié)果婚禮上挣跋,老公的妹妹穿的比我還像新娘。我一直安慰自己狞换,他們只是感情好浆劲,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,917評(píng)論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著哀澈,像睡著了一般。 火紅的嫁衣襯著肌膚如雪度气。 梳的紋絲不亂的頭發(fā)上割按,一...
    開封第一講書人閱讀 51,708評(píng)論 1 305
  • 那天,我揣著相機(jī)與錄音磷籍,去河邊找鬼适荣。 笑死,一個(gè)胖子當(dāng)著我的面吹牛院领,可吹牛的內(nèi)容都是我干的弛矛。 我是一名探鬼主播,決...
    沈念sama閱讀 40,430評(píng)論 3 420
  • 文/蒼蘭香墨 我猛地睜開眼比然,長吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼丈氓!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,342評(píng)論 0 276
  • 序言:老撾萬榮一對(duì)情侶失蹤万俗,失蹤者是張志新(化名)和其女友劉穎湾笛,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體闰歪,經(jīng)...
    沈念sama閱讀 45,801評(píng)論 1 317
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡嚎研,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,976評(píng)論 3 337
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了库倘。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片临扮。...
    茶點(diǎn)故事閱讀 40,115評(píng)論 1 351
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖教翩,靈堂內(nèi)的尸體忽然破棺而出杆勇,到底是詐尸還是另有隱情,我是刑警寧澤迂曲,帶...
    沈念sama閱讀 35,804評(píng)論 5 346
  • 正文 年R本政府宣布靶橱,位于F島的核電站,受9級(jí)特大地震影響路捧,放射性物質(zhì)發(fā)生泄漏关霸。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,458評(píng)論 3 331
  • 文/蒙蒙 一杰扫、第九天 我趴在偏房一處隱蔽的房頂上張望队寇。 院中可真熱鬧,春花似錦章姓、人聲如沸佳遣。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,008評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽零渐。三九已至,卻和暖如春系忙,著一層夾襖步出監(jiān)牢的瞬間诵盼,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,135評(píng)論 1 272
  • 我被黑心中介騙來泰國打工银还, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留风宁,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 48,365評(píng)論 3 373
  • 正文 我出身青樓蛹疯,卻偏偏與公主長得像戒财,于是被迫代替她去往敵國和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子捺弦,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,055評(píng)論 2 355

推薦閱讀更多精彩內(nèi)容