2021-5-26 seo達(dá)人
無論是設(shè)計(jì)網(wǎng)頁還是海報(bào),背景圖片都是最常用、也最能體現(xiàn)當(dāng)下設(shè)計(jì)趨勢(shì)的一種設(shè)計(jì)元素。在設(shè)計(jì)APP 的時(shí)候同樣是如此。過去的10年當(dāng)中,用戶的品味發(fā)生了不小的變化,而現(xiàn)在,整個(gè)設(shè)計(jì)趨勢(shì)上,似乎正處在一個(gè)關(guān)鍵的轉(zhuǎn)折點(diǎn)上。
在我們所能觀察到的諸多設(shè)計(jì)當(dāng)中,淺色的背景是當(dāng)之無愧的主流。淺色背景本身就不太可能喧賓奪主,讓視覺主體更加突出。而如今,我們逐漸發(fā)現(xiàn),背景還具備補(bǔ)充主體的功能,并且這種補(bǔ)充是潛移默化的。背景的功能性其實(shí)還可以強(qiáng)化,這種思路可以在如今的APP 界面設(shè)計(jì)當(dāng)中應(yīng)用,讓整體設(shè)計(jì)更加平衡。
如今的UI設(shè)計(jì)師大都明白在背景中融入元素來吸引用戶的眼球,提升產(chǎn)品調(diào)性,提高內(nèi)容的可讀性。而這也促使圖片、插畫、色塊等元素在背景當(dāng)中發(fā)揮了更大的作用。
分屏式設(shè)計(jì)并不新鮮,它是一個(gè)存在了很長(zhǎng)時(shí)間的設(shè)計(jì)趨勢(shì)了。在桌面端的屏幕上,分屏式設(shè)計(jì)一直都很有效,寬廣的屏幕讓設(shè)計(jì)師有足夠的施展空間,但是在移動(dòng)端上則是個(gè)挑戰(zhàn)。
在 UI 設(shè)計(jì)師們找到了解決方案,對(duì)比色是增加視覺吸引力的最佳方式。
在 Tubik Studio 的這個(gè)設(shè)計(jì)案例當(dāng)中,設(shè)計(jì)師使用不均等分布的色塊來分割屏幕,同時(shí)使用白色背景區(qū)塊來承載主體內(nèi)容,避免被背景色彩干擾。設(shè)計(jì)師充分利用了對(duì)比色的對(duì)抗性,以及和白色之間的對(duì)比度,功能完善,但是有趣又漂亮。
雖然在背景圖片中疊加各種圖形化的元素聽起來很奇怪,但是確實(shí)是逐漸流行起來的一種背景設(shè)計(jì)玩法。不過,這存在一種風(fēng)險(xiǎn),就是如果疊加太多的圖形化元素,會(huì)讓整體看起來過于雜亂。盡量在豐富視覺和制造視覺污染之間找到平衡,最終的設(shè)計(jì)效果,能夠給你帶來意料之外的優(yōu)質(zhì)效果。
雖然手機(jī)越來越大,但是屏幕空間依然很寶貴。通過疊加一些特定的圖形元素來創(chuàng)造視覺深度,給用戶以空間感。
這種背景設(shè)計(jì)的另外一個(gè)好處在于,你可以讓整個(gè)UI顯得更加富有視覺吸引力。在設(shè)計(jì)的時(shí)候,需要注意的是,要保持元素之間的一致性,確保不同的元素在屏幕上呈現(xiàn)的時(shí)候,仍然保持協(xié)調(diào)。
使用整張圖片作為背景,一直被UI/UX領(lǐng)域的設(shè)計(jì)師所爭(zhēng)論。對(duì),你沒看錯(cuò),這個(gè)事情一直存在爭(zhēng)議。有人非常喜歡使用圖片背景,有人則完全無法接受這種呈現(xiàn)方式。
但是撇開個(gè)人喜好,趨勢(shì)上,這種背景運(yùn)用方式還是越來越流行了。在APP的UI界面中,如果你能靈活自由地使用全屏背景的化,對(duì)于接下來的設(shè)計(jì)肯定是有所助益的。
圖片所呈現(xiàn)的信息量當(dāng)然是毋庸置疑的,更重要的是如何貼合品牌和氛圍,呈現(xiàn)出應(yīng)有的氣場(chǎng)。
當(dāng)然,最核心的技巧,是在于透明度的控制,和內(nèi)容框的設(shè)計(jì)。為了避免信息和背景之間的對(duì)比度不足,合理的方法是使用內(nèi)容框?qū)⑶熬暗脑爻休d起來。而為了避免背景圖片喧賓奪主,還可以借助透明度的控制,來確保背景圖片更加平滑自然,不會(huì)影響到閱讀和使用。
漸變色在幾年前回歸之后,在設(shè)計(jì)當(dāng)中的運(yùn)用范圍越來越廣。漸變色不僅賦予設(shè)計(jì)更加強(qiáng)烈的個(gè)性,而且能夠和用戶之間產(chǎn)生足夠的情感共鳴。
你可以使用漸變色來營(yíng)造調(diào)性,創(chuàng)造對(duì)比,甚至還可以借助漸變色才來作為視覺線索和引導(dǎo)。比如當(dāng)你在背景中使用藍(lán)色的時(shí)候,可以通過深淺漸變來創(chuàng)造方向性,引導(dǎo)用戶向特定的地方瀏覽。
但是,漸變色背景流行起來最重要的原因還是它的情感共鳴的能力。許多 UI 設(shè)計(jì)師已經(jīng)意識(shí)到心理因素在移動(dòng)端設(shè)備中的巨大影響,能否喚醒用戶的情感是關(guān)鍵。
漸變色背景的設(shè)計(jì)玩法有很多,變化幅度的大小,方向,對(duì)比度和亮度的變化差異,都會(huì)帶來不同的影響。當(dāng)然,漸變背景同樣必須遵循一個(gè)原則,那就不能喧賓奪主。在設(shè)計(jì)的時(shí)候,同樣可以借助透明度的調(diào)整,來降低它和CTA按鈕之間的對(duì)比度。
插畫師可以根據(jù)需求更加自由地繪制足以滿足不同需求的插畫,獨(dú)特,個(gè)性,定制化。不過,想要?jiǎng)?chuàng)建足以代表企業(yè)、團(tuán)隊(duì)、產(chǎn)品或者用戶角色的插畫,并不能憑空創(chuàng)建,而是需要一個(gè)研究過程,通過調(diào)研和分析,才能提出需求,再做執(zhí)行。它是一個(gè)機(jī)器人,還是一個(gè)更加擬真的角色?又或者使用動(dòng)物擬人化的形象更合適?
許多設(shè)計(jì)師更加傾向于在APP中使用自定義插畫,因?yàn)檫@樣更加自由輕松地達(dá)成各種目標(biāo),從新用戶引導(dǎo),到提供教程。
幾何圖形本身是非常基礎(chǔ)的元素,它們的含義和感覺非?;A(chǔ),也具有普世性。雖然它們很簡(jiǎn)單,但是在UI 設(shè)計(jì)中非常強(qiáng)大。單一的幾何形狀是簡(jiǎn)單的,但是結(jié)合不同的效果、不同的組合,即使使用簡(jiǎn)單的幾何形狀,也能夠發(fā)揮出多樣的變化。
當(dāng)然,具體怎么運(yùn)用幾何圖形,還要看你的UI界面上,有哪些東西,作為背景的幾何圖形和 UI 中的主體元素之間,空間關(guān)系要怎么控制,怎樣保持優(yōu)雅簡(jiǎn)潔,確保品牌信息的傳達(dá)。
就像 UI 界面中其他的元素一樣,背景同樣值得關(guān)注和規(guī)劃。最重要的是,你想表達(dá)什么,傳達(dá)什么樣的信息,想借助整個(gè)UI 界面來實(shí)現(xiàn)什么樣的功能,規(guī)劃好了才能更好地呈現(xiàn)內(nèi)容。
背景的選取之所以會(huì)成為UI設(shè)計(jì)趨勢(shì)的關(guān)注點(diǎn),很大程度是因?yàn)閁I 和UX 設(shè)計(jì)的關(guān)注點(diǎn)開始越來也深入到設(shè)計(jì)的方方面面,大家考慮問題也需要越來越細(xì)致。
文章來源:快資訊 作者:衍果設(shè)計(jì)
藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)掃碼藍(lán)小助,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系。
分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( bouu.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
藍(lán)藍(lán)設(shè)計(jì)的小編 http://bouu.cn