雷火平台-中国知名电竞赛事平台

聯(lián)系我們 face+ 關(guān)于 服務(wù) 案例
首頁(yè) 案例 服務(wù) 關(guān)于 face+

提升Android視覺效果的ui設(shè)計(jì)技巧

Time: 2019-12-27


設(shè)計(jì)師在做安卓系統(tǒng)的ui設(shè)計(jì)的時(shí)候,是需要確定下使用的ui設(shè)計(jì)風(fēng)格的,那么ui設(shè)計(jì)風(fēng)格有哪些?提升Android視覺效果的ui設(shè)計(jì)技巧有哪些呢?今天就給大家具體介紹下這些問題。


什么是ui設(shè)計(jì)風(fēng)格

  風(fēng)格嘛,可以理解成模樣,人與人之間有不同的模樣,軟件與軟件,界面與界面都有各自的樣子;再理解深入點(diǎn):比如你設(shè)計(jì)一個(gè)界面,將其定義成了“中國(guó)風(fēng)”的風(fēng)格,那在設(shè)計(jì)界面的時(shí)候,就要圍繞中國(guó)風(fēng)這個(gè)主題來展開,所有的元素,都要把握這個(gè)中心。風(fēng)格有很多種類了,簡(jiǎn)單理解就是每個(gè)界面都有自己的風(fēng)格,設(shè)計(jì)時(shí)定義風(fēng)格,然后實(shí)現(xiàn)出來,那么這套UI就成了一個(gè)獨(dú)立的風(fēng)格了。


ui設(shè)計(jì)風(fēng)格大致都有哪些

  1.扁平化風(fēng)格

  2.三維設(shè)計(jì)風(fēng)格

  3.幾何風(fēng)格

  4.漸變風(fēng)格

  5.標(biāo)題風(fēng)格


1.jpg

(圖片來自網(wǎng)絡(luò))


ui設(shè)計(jì)風(fēng)格必須是簡(jiǎn)潔大方風(fēng)格嗎?

  前兩年比較流行酷黑炫光的效果,立體3D的效果;

  但是隨著目前功能的增加,簡(jiǎn)單的設(shè)計(jì)才不會(huì)顯得沉重繁雜;加上微軟的metro風(fēng)格的盛行,大家越來越追求簡(jiǎn)介平面的風(fēng)格,所以現(xiàn)在很多人將配了清爽顏色(多指淺色冷色調(diào))的簡(jiǎn)潔頁(yè)面稱為小清新。

  無論是安卓還是其他的系統(tǒng),簡(jiǎn)潔的界面設(shè)計(jì)是趨勢(shì),因?yàn)楣δ軙?huì)越來越多,用戶也越來越最求簡(jiǎn)便且人性化的操作方式。


提升Android應(yīng)用視覺效果的UI設(shè)計(jì)技巧

技巧1:使用大小適當(dāng)?shù)膱D像

  在圖像方面,許多Android應(yīng)用開發(fā)者都是采用一種通用的尺寸。盡管這會(huì)使資源管理變得更為簡(jiǎn)單,但就應(yīng)用的視覺吸引力而言,這是個(gè)錯(cuò)誤的做法。要讓應(yīng)用呈現(xiàn)出最佳的視覺效果,那么就應(yīng)當(dāng)針對(duì)具體的設(shè)備屏幕設(shè)計(jì)不同的圖像,最適當(dāng)?shù)膱D像才能構(gòu)建出最棒的用戶體驗(yàn)。

  技巧2:使用適當(dāng)格式的圖像

  我們都見過有些應(yīng)用在嘗試加載某些大型圖像時(shí)會(huì)暫停,這不僅僅因?yàn)閳D像的大小存在偏差,而且還因?yàn)閳D像采用了非理想的格式。Android平臺(tái)支持許多種媒體格式,比如PNG、JPEG、GIF、BMP和WebP(僅Android 4.0+版本支持)。PNG是無損圖片的理想格式,而JPEG的呈現(xiàn)質(zhì)量并不穩(wěn)定。

  Android還支持帶有Nine-Patch的彈性圖像。如果可行的話,可以考慮使用WebP來替代JPEG,因?yàn)檫@種格式在存儲(chǔ)和下載時(shí)效率更高。也就是說,如果將其作為與較老格式同時(shí)使用的獨(dú)立圖片,那么應(yīng)用整體規(guī)模會(huì)變大,這就削減了使用新格式的優(yōu)勢(shì)。


2.jpg

(圖片來自網(wǎng)絡(luò))


  技巧3:運(yùn)用微妙動(dòng)畫,顏色來呈現(xiàn)狀態(tài)改變

  在屏幕轉(zhuǎn)場(chǎng)時(shí)運(yùn)用微妙動(dòng)畫以及UI控制顏色變化來呈現(xiàn)應(yīng)用狀態(tài)改變,這會(huì)讓你的應(yīng)用更顯專業(yè)感。比如,活動(dòng)間的淡入淡出使屏幕轉(zhuǎn)變更為自然,改變被按動(dòng)的按鍵顏色會(huì)突顯正在發(fā)生的用戶動(dòng)作,清晰地呈現(xiàn)出用戶正在做的事情。

  Android 3.x及隨后的版本可開啟硬件加速,這會(huì)讓動(dòng)畫運(yùn)行更為流暢。但是需要進(jìn)行測(cè)試,因?yàn)椴⒎菓?yīng)用的所有功能都能夠兼容硬件加速。

  技巧4:用圓角效果來軟化UI

  Button、PageView等用戶界面控制按鈕在屏幕上都會(huì)呈現(xiàn)矩形的像素形狀,但這需要進(jìn)行處理。在控制界面上,使用圓角效果來軟化用戶界面的外觀,這顯得很像Web的風(fēng)格,但確實(shí)很受用戶喜歡。

技巧5:在3D效果中使用一致性的“光照”

  最新版本的Android平臺(tái)使用全息樣式和3D圖標(biāo)等。如果你在應(yīng)用的控制按鍵中使用投影和其他此類樣式,確保要使用一致性的“光照”。換句話說,要確保陰影在屏幕上的朝向一致。在圖像編輯器中使用相同的數(shù)值來創(chuàng)造相同的斜度和紋理。

  技巧6:使用高對(duì)比度配色方案

  當(dāng)某個(gè)家庭成員(往往是老一輩的人)首次發(fā)現(xiàn)可以在郵件中使用帶顏色的字體和背景,于是發(fā)送給你一封使用白色背景和檸檬黃色字體的電子郵件,這樣的郵件閱讀起來相當(dāng)費(fèi)勁。有些人在設(shè)計(jì)應(yīng)用的屏幕時(shí),可能會(huì)讓玩家難以閱讀或?qū)Ш狡聊恢械膬?nèi)容。使用適當(dāng)?shù)母邔?duì)比度顏色,會(huì)讓屏幕更易于查看,緩解眼睛的壓力。要將配色方案作為系統(tǒng)資源的一部分,以此為基礎(chǔ)來開展其他工作。

  技巧7:使用大型和易讀的字體

  和上述不良配色方案一樣,我們也會(huì)收到家庭成員發(fā)送來帶有某些古怪字體、難以閱讀的文字。相比其他字體,有些字體確實(shí)閱讀起來更為容易。

  字體大小也是個(gè)重要因素,在保持與其他屏幕功能的平衡性的前提下,盡量將字體制作得夠大。就像在使用傳真機(jī)時(shí),使用小于12磅的字體并不合適。

  Android 4.0的設(shè)計(jì)師推出了一種只適用于該平臺(tái)的新字體,這種字體在移動(dòng)設(shè)備上的閱讀很容易,它被稱為Roboto。


3.jpg

(圖片來自網(wǎng)絡(luò))


  技巧8:不要過多偏離平臺(tái)規(guī)范

  許多成功的手機(jī)應(yīng)用會(huì)使用人們較為熟悉的用戶界面。它們有簡(jiǎn)單且主流的用戶界面,其使用的控制方式也是用戶所熟悉的。在用戶界面控制和屏幕設(shè)計(jì)中,不要表現(xiàn)得過于另類。盡量簡(jiǎn)單化,與平臺(tái)其他應(yīng)用的表現(xiàn)保持一致。以平臺(tái)作為決定應(yīng)用表現(xiàn)和行為的線索。

  如果你正在制作的創(chuàng)想者UI與眾不同,確保用AB測(cè)試等客觀方法來比較新UI和傳統(tǒng)UI,由此來決定新設(shè)計(jì)方案是否更優(yōu)化,比如更有效、更易于使用或者看起來更為舒適。

  技巧9:遵從UI指導(dǎo)原則

  Android程序說明書中有許多可以整合到應(yīng)用中的UI指導(dǎo)原則。根據(jù)應(yīng)用所使用的Android版本的不同,這些指導(dǎo)原則往往也有所差異。當(dāng)出現(xiàn)這種情況時(shí),你需要制作多種資產(chǎn)來應(yīng)對(duì)多種指導(dǎo)原則。指導(dǎo)原則涵蓋了圖標(biāo)、小部件、菜單和活動(dòng)等部分。

  技巧10:測(cè)試用戶界面

  開發(fā)者往往不是優(yōu)秀的QA或測(cè)試者。應(yīng)用可穩(wěn)定運(yùn)行后,面向完全不熟悉應(yīng)用設(shè)計(jì)和意圖的用戶開展測(cè)試是很有價(jià)值的做法。應(yīng)用設(shè)計(jì)師往往自認(rèn)為用戶會(huì)覺得他們的應(yīng)用UI很直觀,情況或許并非如此。只有真正讓用戶來測(cè)試應(yīng)用,你才能夠在發(fā)布應(yīng)用前發(fā)現(xiàn)許多意料之外的問題。


  通過以上的內(nèi)容,大家已經(jīng)了解了ui設(shè)計(jì)風(fēng)格有哪些了,可見,ui設(shè)計(jì)風(fēng)格是有多種的,具體選擇哪種,還要根據(jù)實(shí)際的情況去選擇。


合作咨詢

上海(總部)

上海市浦東新區(qū)郭守敬路498號(hào)22號(hào)樓
021-61057328
service@faceui.com

辦公地址地圖

北京

北京市東城區(qū)后永康17號(hào)A座
010-64015620
service@faceui.com

辦公地址地圖

成都

四川省成都市錦江區(qū)東大街牛王廟段100號(hào)
028-62790929
service@faceui.com

辦公地址地圖
首頁(yè) | 案例 | 服務(wù) | 關(guān)于 | face+ | 智見

Copyright ? 2009-2022 FaceUI design. All rights reserved


滬ICP備13044459號(hào)-5

上海辦公地點(diǎn)地圖
北京辦公地點(diǎn)地圖
深圳辦公地點(diǎn)地圖
在微信中搜索faceui
或保存二維碼在微信中打開