創(chuàng)維天賜3.0至4.0 UI設(shè)計演化說明

一、 創(chuàng)維天賜4.0 UI產(chǎn)生的基礎(chǔ) EasyfaceUI即俗稱的圓環(huán)UI界面，是基于創(chuàng)維自主研發(fā)的創(chuàng)維天賜系統(tǒng)1.0基礎(chǔ)上的第一套視覺界面，設(shè)計初期考慮的是配合展現(xiàn)創(chuàng)維天賜系統(tǒng)具備懸浮、多任務(wù)、跨界看、開機(jī)快及盲操作的特點(diǎn)而設(shè)計的一款具有界面小巧、操作模式自然、尊重用戶、不打斷用戶的視覺操作界面。

二、 Cooface5.0視覺設(shè)計歷程： Cooface5.0在設(shè)計構(gòu)思階段進(jìn)行了長達(dá)一個月的醞釀以及多輪設(shè)計思考。在Demo1-Demo5階段，輸出了接近二十種設(shè)計方案方向，在這個階段中，設(shè)計團(tuán)隊(duì)逐漸理清了設(shè)計重點(diǎn)及設(shè)計方向，并找到了不是設(shè)計亮點(diǎn)作為后面設(shè)計的積累。接著在與公司高層的多次交流后，明確了新的設(shè)計方向，并順利地推出了Demo6，即現(xiàn)在Cooface5.0的設(shè)計雛形。接著，在此基礎(chǔ)上，又細(xì)化到第八版時，Cooface5.0的設(shè)計已經(jīng)基本確定。

3.jpg (41.02 KB, 下載次數(shù): 6)

下載附件  保存到相冊

2014-7-8 10:57 上傳

4.jpg (36 KB, 下載次數(shù): 6)

下載附件  保存到相冊

2014-7-8 10:57 上傳

5.jpg (32.31 KB, 下載次數(shù): 7)

下載附件  保存到相冊

2014-7-8 10:57 上傳

在主頁設(shè)計確認(rèn)后，設(shè)計組即分工展開全套UI的設(shè)計工作，并將其一一推進(jìn)落實(shí)在產(chǎn)品上。 三、 UI設(shè)計思路： 在視覺體驗(yàn)方面，Cooface5.0電視 UI采用方與圓的設(shè)計元素相結(jié)合。整體風(fēng)格趨于扁平化、色塊化、線條化。以去繁從簡的扁平化風(fēng)格為導(dǎo)向，結(jié)合線條化icon;在顏色選擇上以彩虹色為主題，布局以彩虹順色為思路順延，紅、橙、黃、綠、藍(lán)、靛、紫這些大家熟悉的色系。由于彩色的融入，整體視覺更具靈動與變化。方形的色塊設(shè)計使得整體界面布局簡潔大方，圓形的Icon設(shè)計提升了整個界面的靈動性，也是對COOFACE4.0圓環(huán)UI在細(xì)節(jié)上的一個延續(xù)。在色彩選擇上，選擇了純度較高，但是明度適中的顏色，使得色彩明亮、豐富的同時，又很好地保護(hù)了眼睛，不會產(chǎn)生色彩疲勞。根據(jù)市場調(diào)研結(jié)果顯示，目前這套色彩的用戶接受度也比較高。 整套UI的設(shè)計是基于創(chuàng)維天賜4.0的懸浮理念，即任何的操作都不會被打斷，用戶可以在使用的時候很方便的返回到之前的操作。減輕了用戶對于未知操作的心里負(fù)擔(dān)。使的整套UI的操作更加的簡潔、安全。 四、 項(xiàng)目輸出： 整個項(xiàng)目設(shè)計團(tuán)隊(duì)輸出設(shè)計規(guī)范。包含色塊尺寸及形式，焦點(diǎn)及非焦點(diǎn)狀態(tài)，海報尺寸及推送形式，焦點(diǎn)及非焦點(diǎn)狀態(tài)。色塊與色塊、色塊與海報的形式及間隔。色塊的顏色規(guī)范；海報設(shè)計規(guī)范；字號、字體及顏色；圖標(biāo)的大小、形式及比例，等等。