2018-8-7 ui設(shè)計(jì)分享達(dá)人
如果您想訂閱本博客內(nèi)容，每天自動(dòng)發(fā)到您的郵箱中， 請(qǐng)點(diǎn)這里
在產(chǎn)品設(shè)計(jì)領(lǐng)域，或許有人認(rèn)為已經(jīng)到了成熟階段，已沒(méi)有太多空間進(jìn)行創(chuàng)新。
但事實(shí)上，由于品牌需要新鮮的東西持續(xù)吸引用戶的注意力，新的設(shè)計(jì)或者對(duì)舊設(shè)計(jì)的改造依舊層出不窮。那些真正實(shí)用和有價(jià)值的想法最終會(huì)沉淀下來(lái)，成為一種設(shè)計(jì)趨勢(shì)。
最近，我們?cè)絹?lái)越多地看到很多品牌和設(shè)計(jì)師在嘗試一種有機(jī)設(shè)計(jì)和幾何設(shè)計(jì)的組合。比起注重對(duì)概念的描述，開(kāi)始更注重整體的形象和感覺(jué)。這便是一種“抽象設(shè)計(jì)”的回歸。
像圓形、長(zhǎng)方形和多邊形這種幾何圖形在產(chǎn)品設(shè)計(jì)領(lǐng)域已經(jīng)出現(xiàn)已久，一直效果不錯(cuò)：通過(guò)創(chuàng)造出結(jié)構(gòu)層次，它們讓內(nèi)容的組織更清晰；在插畫中，它們代表著一種“極簡(jiǎn)”作風(fēng)，留給用戶想象的空間。
現(xiàn)在，這種簡(jiǎn)潔的幾何風(fēng)格繼續(xù)進(jìn)化：有更自然和自由的形狀。
波浪線、多樣的曲線、有力的拱形、跟更偏功能性的幾何風(fēng)格相比，創(chuàng)造出更加獨(dú)特、更具吸引力的組合。這樣的設(shè)計(jì)更具象征意義，而沒(méi)有太多描述性，因此留下足夠的空間讓用戶發(fā)掘和演繹。當(dāng)然，這可能同時(shí)是優(yōu)勢(shì)和缺點(diǎn)，設(shè)計(jì)師要具體情況具體分析。
這種抽象化、有機(jī)化的幾何風(fēng)格傾向會(huì)深刻影響2018年設(shè)計(jì)方向。比起以往，能理解圖形背后的意義和其對(duì)感官的沖擊力愈加重要。
幾何圖形
幾何圖形具有平衡感和高辨識(shí)度，通常暗示著結(jié)構(gòu)、順序和效率。
正方形和長(zhǎng)方形是最常見(jiàn)的，它們能制造出一種平等和一致的感覺(jué)，代表著穩(wěn)定和可靠的品質(zhì)。
圓形和橢圓是最友好的，有著統(tǒng)一、完整、以及無(wú)限的感覺(jué)，代表著愛(ài)護(hù)、和諧和感激。
三角形是最具矛盾感的，有時(shí)代表著一種不穩(wěn)定，給人一種緊張、矛盾、侵犯性的感受；有時(shí)也代表著一種穩(wěn)定，象征著法律、科學(xué)和宗教。
漩渦形狀是最有創(chuàng)新性的，代表著成長(zhǎng)和進(jìn)化，傳遞著變化、生活和神秘的意念。順時(shí)針的漩渦暗示著專注和目的，逆時(shí)針的漩渦則暗示著圓滿。
十字形狀是最富精神層面意義的，代表著平衡、治愈、智慧、希望和信心。重心偏垂直方向的十字暗示著強(qiáng)壯，而偏水平方向的十字代表著平和。
有機(jī)圖形
有機(jī)圖形是指那些不規(guī)范、隨意、并不怎么對(duì)稱的形狀，經(jīng)常是對(duì)大自然的模擬。因此有機(jī)圖形的內(nèi)涵常來(lái)自它們模仿的自然物體。
尖刺圖形是最具有反叛意義的，代表著自然流露、玩世不恭、難以預(yù)測(cè)、常能吸引人的注意力。
云朵形狀是最讓人愉悅的，代表著友好、溫暖、舒適、和善良。
波浪型是最“涼爽”的，代表著放松、平穩(wěn)，有時(shí)候因難以預(yù)測(cè)而增添扣人心弦的感覺(jué)。
抽象圖形
抽象圖形就是常見(jiàn)元素或形狀的簡(jiǎn)化版，大多是基于幾何圖形和有機(jī)圖形。
抽象圖形通常是隨意的，因?yàn)樗鼈兊耐庠谛问娇梢杂卸喾N。根據(jù)它們的形狀和細(xì)節(jié)可以傳遞不同的想法和情緒。抽象圖形可以非常有趣，非常獨(dú)特，可以代表前沿，代表玩趣，代表神秘，或者放松，迷惑等等，可塑性超強(qiáng)。
現(xiàn)在我們了解了抽象風(fēng)格的一些基本元素，現(xiàn)在來(lái)看看在這基礎(chǔ)上的后期修飾。通過(guò)在顏色、漸變色、重復(fù)圖案、紋理、字體和圖片層面的設(shè)計(jì)，我們可以額外為設(shè)計(jì)增添深度、個(gè)性和趣味。
顏色
顏色能夠表達(dá)和影響情緒和想法，跟我們對(duì)世界的認(rèn)知息息相關(guān)。
白色-安全：純真 純潔 干凈
黑色-神秘：正式 神秘 睿智
紅色-活力： 危險(xiǎn) 有力 激情
橘色-溫暖：創(chuàng)意 熱情 鼓勵(lì)
黃色-樂(lè)觀：活力 忠誠(chéng) 開(kāi)心
綠色-和諧：新鮮 自然 安全
藍(lán)色-信任：自信 智慧 明智
紫色-神圣：奢華 明智 雄心
粉色-魅力：甜蜜 溫柔 玩趣
顏色是復(fù)雜的，不同的色度和色調(diào)，不同的顏色搭配，都會(huì)產(chǎn)生不同的感官體驗(yàn)。而且對(duì)于不同的人來(lái)說(shuō)，還會(huì)傳遞不同的情緒和意義。年齡、種族、文化、性別、甚至心情都會(huì)影響感知。因此我們不能單純依賴顏色來(lái)傳遞信息或行為，而要首先考慮設(shè)計(jì)目標(biāo)和用戶。
漸變色
漸變色是兩種顏色或一種顏色不同色調(diào)的漸進(jìn)式混合。大自然中到處都能看到漸變色，因?yàn)闈u變色看上去有熟悉感和愉悅感。使用漸變色能為設(shè)計(jì)元素帶來(lái)深度和維度，從而增添摩登、新鮮和獨(dú)特感。
我們可以用淺色調(diào)的組合吸引用戶注意力，或者使用深色調(diào)組合為設(shè)計(jì)增添深度。使用色輪里相近的顏色，能創(chuàng)造出平滑、明亮的漸變；使用色輪里距離較遠(yuǎn)的顏色，就會(huì)產(chǎn)生一個(gè)更加“中性”的中間色，視覺(jué)效果一般，此時(shí)可以嘗試增加第三種更亮的顏色。
通過(guò)調(diào)整透明度、旋轉(zhuǎn)度等，我們可以讓漸變色更富創(chuàng)意一些。大自然完全可以是我們獲取漸變色靈感的來(lái)源。
重復(fù)圖案
重復(fù)圖案是指一個(gè)或多個(gè)視覺(jué)元素的重復(fù)，能給設(shè)計(jì)帶來(lái)統(tǒng)一感、質(zhì)感，豐富細(xì)節(jié)，加強(qiáng)視覺(jué)沖擊力。不過(guò)重復(fù)圖案同時(shí)也會(huì)增加視覺(jué)上的負(fù)擔(dān)，因此簡(jiǎn)約和細(xì)膩是關(guān)鍵。
重復(fù)圖案能夠給我們的抽象組合增添節(jié)奏和移動(dòng)感，在視覺(jué)上有五種節(jié)奏：隨意、規(guī)律、交替、流動(dòng)、漸進(jìn)。每一種都能提供無(wú)限的組合和可能。我們既可以在簡(jiǎn)單的圖形里，也可以在背景中使用重復(fù)圖案。
紋理
紋理是指表面的品質(zhì)特點(diǎn)，對(duì)于抽象設(shè)計(jì)來(lái)說(shuō)，是很好的增加視覺(jué)豐富性、深度和趣味的方式。紋理既能展現(xiàn)表面的視覺(jué)形象，也能傳遞情感。質(zhì)感可以是粗礪的、平滑的、柔軟的、絲滑的、閃亮的、毛絨感的、液態(tài)的等等。可以體現(xiàn)自然感或者人為感，厚重感或輕薄感，固體或流動(dòng)感。
字體排版
字體排版是選擇和安排字體的藝術(shù)和技巧。要選擇字體時(shí)，我們首先要確定設(shè)計(jì)的目標(biāo)和受眾。我們想傳達(dá)什么信息？ 想要傳遞什么情緒？我們想要吸引誰(shuí)？挑戰(zhàn)誰(shuí)？說(shuō)服誰(shuí)？告知誰(shuí)？
字體排版是為我們?cè)O(shè)計(jì)奠定情緒、風(fēng)格的關(guān)鍵。每一種字體都有它自己的性格。字體可以是友好的、花哨的、嚴(yán)肅的、侵略性的、玩趣的等等。字體的個(gè)性會(huì)影響我們對(duì)文字內(nèi)容的感受，也會(huì)影響我們接受信息的效果。
有時(shí)我們需要走出舒適區(qū)，加以探索，使用不同的字體來(lái)創(chuàng)造視覺(jué)上的對(duì)比效果，比如使用不同風(fēng)格的字體、字體大小、字重和顏色。當(dāng)然要適量而行，太多的字體變化在視覺(jué)上也會(huì)造成迷惑。
照片
使用照片，我們同樣可以為設(shè)計(jì)增添深度、附加情緒、突出風(fēng)格。因此選擇合適的照片至關(guān)重要，照片要跟設(shè)計(jì)的整體主題和風(fēng)格相協(xié)調(diào)。
根據(jù)主題、技巧和風(fēng)格的不同，照片可以分為很多類別，比如風(fēng)景照、人像、靜物、黑白照、時(shí)尚、美女、自然、天空、概念照等等。我們還可以再后期編輯，比如把顏色調(diào)淡，或者調(diào)亮、調(diào)深，或者改變顏色、剪裁、模糊、變形等等，后期的可能性無(wú)窮無(wú)盡。
如何使用圖片也是發(fā)揮創(chuàng)造的一方面，可以將圖片設(shè)為背景，或者加蒙版；可以整體應(yīng)用，也可以只用一部分，甚至可以將其作為紋理。我們還能在圖片上寫字、變色、打碎、加邊框等。
視覺(jué)層次&對(duì)比&平衡
所以，我們應(yīng)該如何組合不同的視覺(jué)元素呢？ 層次、 對(duì)比和平衡，這三點(diǎn)能助我們?cè)O(shè)計(jì)出吸引人而且容易閱讀的作品。以下是一些設(shè)計(jì)原則：
尺寸：增加某個(gè)元素的尺寸是最直接的增加其視覺(jué)重要性的方法。使用不同尺寸的元素，自然會(huì)引導(dǎo)用戶理解元素的層次。
顏色：我們會(huì)本能地被顏色吸引。明亮的顏色抓人眼球，但是如果顏色過(guò)多，就很難突出一種來(lái)。有目的地節(jié)制地使用吸引人的顏色才是關(guān)鍵。我們可以調(diào)整不同的色溫、色度、色調(diào)、飽和度等；也可以策略性地使用明亮色或啞光色，創(chuàng)造出高對(duì)比度和低對(duì)比度的設(shè)計(jì)。
留白：空白處可以起到引導(dǎo)用戶視線的作用，切割不同的視覺(jué)元素，創(chuàng)作一種視覺(jué)層次。留白處可以讓眼睛得以休憩，并舒適地定位到焦點(diǎn)位置。
移動(dòng)： 我們的眼球會(huì)自然被動(dòng)的物體吸引，增加移動(dòng)效果可以讓某些元素輕易地突出。
對(duì)稱和非對(duì)稱：視覺(jué)上的對(duì)稱設(shè)計(jì)可以帶來(lái)和諧和秩序感，如果用非對(duì)稱元素干擾平衡性，則會(huì)增添一份趣味性和強(qiáng)烈度。
*其他還有一些可以考慮的設(shè)計(jì)方法，比如運(yùn)用具備自然平衡美感的黃金分割定律，運(yùn)用格式塔原理設(shè)計(jì)組合和布局，或者利用“視覺(jué)三角形”突出強(qiáng)調(diào)，以及“三分法”制造一個(gè)具有強(qiáng)烈感的構(gòu)圖。
善用抽象設(shè)計(jì)
一些抽象設(shè)計(jì)佳作
現(xiàn)在，你大概已經(jīng)理解了能實(shí)現(xiàn)抽象設(shè)計(jì)的各種基本元素，以及一些策略方法。
不過(guò)也要記得，一千個(gè)人眼中有一千個(gè)哈姆雷特，不同的用戶可能對(duì)這種“任意”的設(shè)計(jì)有“任意”的解讀。因此使用抽象設(shè)計(jì)風(fēng)格要謹(jǐn)慎，如果你的信息傳達(dá)不夠準(zhǔn)確，或者信息本身非常依賴視覺(jué)元素，就要避免使用這種風(fēng)格。
藍(lán)藍(lán)設(shè)計(jì)( tweetduck.com )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(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://tweetduck.com