UI設計細節(jié)系列② | 讓設計細節(jié)更高級的12個實用小技巧

2021-8-5    seo達人



在這篇文章中,我整理了一些小的設計技巧,來幫助你快速改進自己的設計。有時只需要一些小的調(diào)整,就能快速提高設計的品質(zhì)。

 

1. 使用全小寫英文讓畫面更有氣質(zhì)

圖片

圖片上使用較粗的字體或開頭大寫有時候會顯得過于正式。嘗試在某些界面上使用小寫或者比較細的字體,讓畫面看起來更加有氣質(zhì)。

 

2.使用粗細、大小和顏色來表達內(nèi)容主次關(guān)系

圖片

設計文字內(nèi)容時,沒辦法時時告訴用戶哪個內(nèi)容信息是主要的哪個是次要的,但可以通過調(diào)整字體粗細、大小、顏色,讓我用戶一眼就能分辨內(nèi)容主次關(guān)系,避免閱讀中出現(xiàn)任何混亂。(彩云注:要對比就要足夠強,不要模棱兩可。)

 

3.深色背景應加粗文字

圖片

在淺色背景使用深色文本時,有時可以選擇較輕的字體粗細。但如果在深色背景使用淺色文字時,最好考慮把字體粗細稍微加粗一點,特別是長文本段落內(nèi)容的,以提高文本的最佳可讀性,避免使用戶視覺疲勞。

 

4.選擇能正確氣質(zhì)的字體

圖片

試著為呈現(xiàn)的內(nèi)容選擇合適的字體。用戶是精明的,并且對內(nèi)容氣質(zhì)會有直觀感受。所以選擇合適的字體很關(guān)鍵,能讓用戶獲得對應氣質(zhì)的閱讀體驗。(彩云注:上圖中的區(qū)別在于,左邊的字體偏古典,而插畫偏現(xiàn)代,所以右邊就會更合適一些)

 

5.界面中的字體最好控制在2種以內(nèi)

圖片

對于我來說,設計最好選擇一種類型的字體。但如果項目需要,最好控制在兩種字體以內(nèi),不要太多。對于沒有經(jīng)驗設計師來說,頁面使用多種字體視覺是很難把控的。所以建議最多使用2種字體類型,然后改變字體的粗細,大小,顏色,這樣的設計會看起來更加統(tǒng)一協(xié)調(diào)。

 

6.字體全大寫時,注意拉大字體間距

圖片

使用全大寫的文字時,只要稍微拉大下字母間的間距,就能使字母間更加容易區(qū)分,單詞更加容易閱讀,提高用戶的可閱讀性,還能使大寫字體視覺上更加美觀。

 

7.設計元素風格保持一致性

圖片

無論是網(wǎng)站或APP設計都應該保持一致性,這也是設計的最基本的原則。比如布局、圖標、顏色和按鈕都要始終保持一致,減少用戶混淆,提高用戶體驗。(彩云注:同一個界面中的元素樣式應保持一致)

 

8.設計適當增大留白

圖片

設計界面適當使用留白不僅讓界面看起來更加有空間感,主次分明,還能給人一種明朗、簡潔的心理感受。想讓設計視覺更加集中,有呼吸感,適當留白則是改進頁面視覺最簡單的方法之一。

 

9.設計開頭段落樣式,吸引用戶

圖片

如果你處理的是長篇內(nèi)容,比如博客文章,那么將讀者吸引到內(nèi)容中是很重要的。為了達到這個目的,開篇段落的外觀和內(nèi)容本身一樣重要。可以簡單調(diào)整下,如調(diào)整字體大小,行高,粗細和顏色,都可以改善第一印象。

 

10.長文本使用短段落設計

圖片

在處理長篇內(nèi)容時,盡量保持段落簡短有力,清晰呈現(xiàn)。確保用戶在短時間內(nèi)快速閱讀內(nèi)容信息。(彩云注:人的耐心很有限,盡量把長段落拆分,我自己寫公眾號文章時也會這樣做,我給自己規(guī)定一個段落最長不超過5行,并一直執(zhí)行這個標準。)

 

11.定好主色調(diào),并在設計中保持一致性

圖片

怎樣讓用戶界面看起來更專業(yè)?那就是從一開始就定義好主色調(diào),并在整個設計中始終保持一致性。如果界面隨機使用大量的顏色來設計,視覺效果只會讓用戶看起來很亂,分不清主次。

 

12.當使用8點網(wǎng)格系統(tǒng)時,圖標布局要一致

圖片

當使用圖標和 8pt 網(wǎng)格系統(tǒng) 時,你會發(fā)現(xiàn)大多數(shù)構(gòu)建良好的圖標集的圖標都位于8的倍數(shù)框架內(nèi)(即 16×16、24×24、32×32 等)。但在設計中我們常常很容易忽略這一原則。若想讓你的設計圖標在布局中保持一致性,最好確保你設計的任何圖標都在8的倍數(shù)框內(nèi)。

 

本文翻譯已獲得作者的正式授權(quán)(授權(quán)截圖如下)

圖片

 

原文地址:medium

作者:Marc Andrew

譯文地址:彩云譯設計(公眾號)

譯者:彩云Sky


轉(zhuǎn)載請注明:學UI網(wǎng)》UI設計細節(jié)系列② | 讓設計細節(jié)更高級的12個實用小技巧

藍藍設計建立了UI設計分享群,每天會分享國內(nèi)外的一些優(yōu)秀設計,如果有興趣的話,可以進入一起成長學習,請掃碼藍小助,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯(lián)系。

截屏2021-05-13 上午11.41.03.png


文章來源:csdn

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責聲明:藍藍設計尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

藍藍設計bouu.cn )是一家專注而深入的界面設計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網(wǎng)站建設 、平面設計服務


分享本文至:

日歷

鏈接

個人資料

藍藍設計的小編 http://bouu.cn

存檔