你曾經(jīng)是否有過被別人說設計無細節(jié),無品質(zhì)感等這樣的經(jīng)歷,其實每個人都會有這個過程,只是或長或短的時間而已。
設計細節(jié)不只體現(xiàn)一個設計師的能力水平,還體現(xiàn)他對產(chǎn)品的理解,對生活的認知。今天的思路能讓你在做設計時候,多注意細節(jié),提高美感!
今日分享大綱:
1,使用圖標 / 圖形
2,融入3D元素
3,使用高清圖片
4,運用網(wǎng)格
5,注意版式
6,一致性
7,注意顏色
1.使用圖標
添加圖標或者圖形可以使界面中元素的功能更加清晰直觀,同時易于全球化設計和用戶對功能的快速識別記憶。
如上圖案例,左側添加圖標,右側純文字設計。左側美觀度提升,同時更加利于用戶去使用與記憶功能。
IBM設計圖,上下可對比,第一張圖,去掉圖形目前看著也能用,第二張圖增加圖形,畫面顯得飽滿一些,功能都通過圖標示意出來,直觀易觸達。
當然需要注意的點,切勿過度使用,造成畫面花哨。
2.融入3D元素
3D設計不用多說,是當下比較火熱的設計手法,它在平面包裝、電商領域、動態(tài)視頻、UI設計等涉及范圍廣,設計新穎,刺激大眾感官。
韓國UI
騰訊視頻
騰訊視頻將異常狀態(tài)3D化設計展示
3.使用高清圖片
圖片在設計中起著重要作用,包括我們概念方案中的情緒圖,或者在產(chǎn)品設計中使用圖片,都可以更加生動體現(xiàn)產(chǎn)品性格特征。
圖片使用3大要點:有意境,簡單干凈,高清大圖
左側app:29cm,右側app:Vsco
來源:NIO Lifea
電商設計領域更是廣泛攝影圖
給大家推薦高清攝影圖網(wǎng)站:網(wǎng)站不在于多而在于精
1,https://unsplash.com/
2,https://www.pexels.com/
4.運用網(wǎng)格
網(wǎng)格可以讓界面更加有層次與節(jié)奏,一致性更強。網(wǎng)格已經(jīng)在平面雜志設計中多年使用歷史,同樣在UI設計中運用它,一樣可以做出優(yōu)質(zhì)設計。
雜志化產(chǎn)品視覺特征打造已是趨勢,如果還不熟悉網(wǎng)格的運用,可以搜索下我之前寫的一些關于網(wǎng)格的文章。
5.注意版式
這里說的版式也包括字體類型,版式中需要注意文字排版間距,字體行間距,對比度,層次結構,這些都是導致UI細節(jié)不完善的原因之一,也是我們最容易掌握的。
左側設計中,輸入框里面信息基本看不清,層級不明顯;右側層次凸顯同時,信息能清晰識別到。
左側排版無層級,右側版式更加直觀清晰,對比度明顯。
6.一致性
一致性是一個老生常談話題,但它確實是保證產(chǎn)品系統(tǒng)性,品牌性不可獲取的條件,比如系統(tǒng)中圖標樣式一致、排版網(wǎng)格一致、插畫元素一致、符號一致等。
下面展示一款韓國APP在這方面做得具有代表性:
實際線上的產(chǎn)品在一致性方面做得比較到位,一致性的運用,能使產(chǎn)品更加風格化,記憶特征明顯,區(qū)分競品,美學體驗到達極致。
7.注意顏色
界面設計中,色彩是一切的靈魂,因為色彩,可以讓我們對該品牌記憶深刻。
8.感悟
文中今天說了7種比較實用,同時大家易于掌握的方法與思路,幫助大家開竅。當然也需要靈活運用,每次在做界面設計的注意下這些細節(jié),多思考,堅持下來,成為一個能做出好設計的設計師。
除了上面7種實用方法,還有其他類型的方法,比如微交互、情感化插圖、UI品牌系統(tǒng)化、定義統(tǒng)一的具有DNA特征的品牌、功能場景感塑造。對于基礎薄弱的伙伴可以先從上面7種入手。
全站高品質(zhì)素材免費下載!