當(dāng)學(xué)會(huì)了這“3招”UI版式,整個(gè)人都精神了
編輯導(dǎo)語(yǔ):隨著互聯(lián)網(wǎng)行業(yè)的快速發(fā)展,各種APP也開(kāi)始應(yīng)運(yùn)而生,現(xiàn)在不論是哪個(gè)行業(yè),關(guān)于UI設(shè)計(jì)師都是一個(gè)必要的崗位,設(shè)計(jì)好板式是很重要的一項(xiàng)工作,那怎樣可以設(shè)計(jì)出屬于自己的版式呢,本文就來(lái)為大家聊一聊!
每次拿到原型開(kāi)始設(shè)計(jì),總是沒(méi)有好的想法;每次做出來(lái)的設(shè)計(jì),不是同質(zhì)化,就是很平庸,該如何破局?
這是80%的設(shè)計(jì)師目前的現(xiàn)狀,設(shè)計(jì)好的UI版式真的很難么?答案顯然是否定的。
如果,大家經(jīng)常去關(guān)注一些前沿設(shè)計(jì)作品,設(shè)計(jì)概念,你就會(huì)發(fā)現(xiàn)別人的設(shè)計(jì)其實(shí)也沒(méi)用什么牛逼的技法,就是普通的版式,也可以設(shè)計(jì)感很強(qiáng)。
他們到底怎么做到的?
下面我來(lái)給你拆解3個(gè)方向,尤其是第二個(gè),很容易學(xué);但,就是越簡(jiǎn)單的東西,越容易被忽略。
一、圖文序列
圖形與文字版式組合創(chuàng)新設(shè)計(jì),形成可見(jiàn)的幾何序列或者幾何矩陣,從而達(dá)到增強(qiáng)設(shè)計(jì)版式的視覺(jué)效果。
比如,我們常見(jiàn)的線條序列幾何、或者塊面序列幾何、點(diǎn)陣序列幾何。
很多人說(shuō),這些我都知道,但是靈感從哪里來(lái)?我們做UI設(shè)計(jì)不一定只看這個(gè)領(lǐng)域的參考。
比如,我們可以去看看平面、品牌、建筑、裝置藝術(shù)、概念藝術(shù)、街頭藝術(shù)、建筑藝術(shù)。
來(lái)看個(gè)例子,下面這張平面海報(bào)的設(shè)計(jì)。
將圖形與文字混合穿插排版,增強(qiáng)了形式感與版式感,這樣的思路我們?cè)赨I版式中也可以使用。
這種設(shè)計(jì)手法特征關(guān)鍵詞:穿插組合、幾何序列、疊加序列、重復(fù)序列。
下面,我們看幾個(gè)案例。
大量重復(fù)使用幾何線條序列,區(qū)分信息層級(jí)的同時(shí),還增加了版式感。
重復(fù)幾何序列矩陣,疊加,重復(fù)切割。
Nike Run Club
二、比大更大
大小對(duì)比,我們從學(xué)設(shè)計(jì)時(shí),就已經(jīng)知道了,但就是用不好。
因?yàn)榇蠹遥汛笮?duì)比理解成就是放大或者縮小兩者之間的差距,這個(gè)理解只能說(shuō)正確一半。
我們要真正意義上理解大小對(duì)比,應(yīng)該是需要更大,再大一些,形成鮮明的對(duì)比。
Short Waves Festival
Tech Central
雜志設(shè)計(jì),大家應(yīng)該都看過(guò),之所以雜志周刊很有版式感、設(shè)計(jì)感,是因?yàn)樗麄冊(cè)O(shè)計(jì)大膽。
比如,字體喜歡用大號(hào)文字,這樣更顯得直觀、清晰,在視覺(jué)上產(chǎn)生強(qiáng)烈的對(duì)比沖突,喚起思考。
下面,我們來(lái)看看在UI中的應(yīng)用案例。
分離派
上圖網(wǎng)頁(yè)UI設(shè)計(jì),有了大字號(hào)數(shù)字排版,這個(gè)頁(yè)面才有了靈魂。
Tech Central
三、強(qiáng)化負(fù)空間
通過(guò)負(fù)空間也能產(chǎn)生設(shè)計(jì)感,增強(qiáng)界面版式質(zhì)感。那么,如何通過(guò)強(qiáng)化負(fù)空間來(lái)增加設(shè)計(jì)版式感?
首先要明白負(fù)空間的含義是留白,加大負(fù)空間的應(yīng)用,就是增加留白,讓頁(yè)面更有呼吸感。
蘋果官網(wǎng),通過(guò)大量營(yíng)造負(fù)空間效果,從而產(chǎn)生高級(jí)感,版式簡(jiǎn)約而不簡(jiǎn)單。
Enabling EV
下面看幾個(gè)應(yīng)用案例。
Upwork
在APP界面設(shè)計(jì)中,加大負(fù)空間效果,營(yíng)造更多的設(shè)計(jì)留白,從而來(lái)營(yíng)造版式感。
四、最后
版式是一切設(shè)計(jì)的基礎(chǔ),做平面,品牌包裝,海報(bào)運(yùn)營(yíng)等都需要好的版式,在UI中也是一樣。
為什么在日常工作中,我們?cè)O(shè)計(jì)出來(lái)的UI界面不是很平庸就是同質(zhì)化,最大的原因是思維局限,思維沒(méi)打開(kāi)。
我們可以從多維度去思考找靈感,夸領(lǐng)域汲取,從其他設(shè)計(jì)領(lǐng)域中找答案,這也是今天這篇文章的核心。
比如,通過(guò)從平面或者品牌中汲取版式靈感,再通過(guò)內(nèi)化、嘗試、探索應(yīng)用到你的界面設(shè)計(jì)中,設(shè)計(jì)創(chuàng)新就是這樣來(lái)的。
#專欄作家#
Tony,微信公眾號(hào):功夫體驗(yàn)設(shè)計(jì),人人都是產(chǎn)品經(jīng)理專欄作家。百度視覺(jué)體驗(yàn)設(shè)計(jì)師,一直堅(jiān)持原創(chuàng)文章,樂(lè)于幫助新人。擅長(zhǎng)作品集指導(dǎo)、筆試題指導(dǎo)、UI視覺(jué)創(chuàng)意、設(shè)計(jì)趨勢(shì)風(fēng)格等。
本文原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載。
題圖來(lái)自Unsplash,基于CC0協(xié)議
好看有設(shè)計(jì)感的ui界面真的很吸引人,留白感和數(shù)字放大真的滿滿高級(jí)感
精神了,真的精神了,一篇文章里面好多圖片看著還是挺好的。
關(guān)于這些設(shè)計(jì)圖片看得好舒服,設(shè)計(jì)界面整體構(gòu)造就很nice。
哇哦,今天的這個(gè)設(shè)計(jì)我覺(jué)得有點(diǎn)新奇了哈哈哈,是我不常接觸的色彩,不過(guò)最近好像很流行
ui版式真的很吸引人,我每次都會(huì)被好看的ui版式所吸引,這方面還是要下功夫琢磨的