2018-9-27 資深UI設計者
如果您想訂閱本博客內(nèi)容，每天自動發(fā)到您的郵箱中， 請點這里
01-
肖形圖形-構(gòu)成規(guī)律：A組成B
肖形圖形就是以單一元素或多個元素的外形共同變化來進行一個新形象的創(chuàng)造并使兩者之間的含義得以連接。如果兩個物體同時改變了原先的形態(tài)，并在這兩種形態(tài)間產(chǎn)生了一種全新且嚴謹?shù)钠鹾详P(guān)系，一個新形象也就誕生了。
還記得08年奧運期間的各地景觀嗎？你去看城市市民廣場的花壇，從南到北，無不例外，用鮮花組成一個大大的奧運五環(huán)的圖形，要不然就是京的印章標志，或者就是北京歡迎你的字樣。印象最深刻的就是開幕式用擊缶來形成倒計時的數(shù)字。
肖形圖形概念是運用十分廣泛的一種創(chuàng)意概念，它好理解，上手快。但不能理解成一個簡單的重復羅列的過程，哪些圖形可以結(jié)合構(gòu)成新的意向？怎么組合更加有趣？怎么控制好元素之間的疏密關(guān)系？
當我們面對兩個形態(tài)上看似沒有什么關(guān)聯(lián)的物件時，不妨先從點、線、面、空間這些角度來解析一下，或是再換個角度看，每個物件都可分解成基本的方形、圓形和三角形，這些隱秘的關(guān)系都為它們的解析重組提供了可塑的條件。
點的創(chuàng)意表現(xiàn)
在圖形中，任何一個單獨而細小的形象都可以稱為點。點是以視覺中面積大小的感受來確定的，所以點的形狀并不一定是圓，也可以是其他的幾何形體，點是相對于線和面而存在的視覺元素。在設計中，點的排列的形狀、方向、大小、位置、聚焦、發(fā)散，能夠給人帶來不同的心理感受和視覺沖擊。點的構(gòu)成可分為密集和分散兩種不同的視覺類型。
線的創(chuàng)意表現(xiàn)
線是創(chuàng)意圖形的基本要素之一，線可以串聯(lián)各種視覺要素，可以分割畫面和圖像文字，可以使畫面充滿動感，也可以在上穩(wěn)定畫面。線與線之間的排列可以使畫面具有節(jié)奏感，線的放射、粗細、漸變排列可以體現(xiàn)三維空間的感覺。
線的編排構(gòu)成分為有節(jié)奏、有情感、有空間關(guān)系等的線。每條線都有自己獨特的情感存在，將不同的線有節(jié)奏地編排在板式中就能形成各種不同的效果。作品通過線的空間處理，利用獨特的視覺效果，能表現(xiàn)強烈的整體感和形式感。
面的創(chuàng)意表現(xiàn)
圖形設計中的面由于輪廓的作用，使形態(tài)從周圍空間中突顯出來，從而比點、線的視覺沖擊力更大。在進行面的創(chuàng)意表現(xiàn)時，要考慮形狀與面積的對比、間隔與面積的對比、面積與面積的對比等因素。面是視覺元素創(chuàng)意的基礎，可以運用不同的方式來表現(xiàn)。
02-
同構(gòu)圖形-構(gòu)成規(guī)律：A+B組合
同構(gòu)圖形更注重于體現(xiàn)視覺意義上的藝術(shù)性和完整性，通過變形、錯位、結(jié)合等種種手段來制造出虛擬的物象。同構(gòu)可以理解為是一種形態(tài)上的置換行為，即是將組成某物件的其中一部分特定元素與另一種本不屬于其自身卻具備形態(tài)上相似之處的元素進行巧妙替換，相互借用，同生共榮，形成新的異象，產(chǎn)生出新的寓意和獨特的視覺趣味。
同構(gòu)圖形在設計運用中最為廣泛的一種圖形概念，但在運用時我們必須注意做到自然巧妙而不生硬。如果總是一味的將一堆相關(guān)元素胡亂堆砌在畫面中，這樣的畫面，細看之下實在是索然無味啊。
(一半寫實一半創(chuàng)意)
一個完整的元素一分為二，一半保持元素原來的固有形態(tài)讓用戶保持認知，另一半就可以進行創(chuàng)意設計。案例一中是用直白的文案直接進入主體，使用手寫字體切近用戶的同時也彰寫了格調(diào)；案例二中為了體現(xiàn)科技感，運用了電路板進行內(nèi)部重新構(gòu)造，增加科技感的同時也不失可愛。
(圖形加文字)
圖形加文字，通過提取文案，在圖形設計中保留主要的重點文案，很明確的傳達品牌的內(nèi)涵，文字在圖形中也盡量按照圖形的走勢進行排列。案例中的文案都傳達了一種積極向上永不服輸?shù)膽B(tài)度，運動員們也為了勝利而拼搏，體現(xiàn)的耐克的品牌文化。
(雙重曝光)
雙重曝光從嚴格意義上講不屬于同構(gòu)圖形的一種，但是它也是同構(gòu)兩張圖片兩兩相合成形成的一種特有的風格，由于這種風格也算大熱的風格。我們在制作雙重曝光的時候盡可能的保證人物形態(tài)的完整性，如上圖的案例中雙重曝光的畫面很清晰，主次也很分明，很好的保留了人物的五官的完整性。
(APP節(jié)日閃屏)
(點)
(線)
(面)
(創(chuàng)意)
(插畫)
作為UI或者產(chǎn)品設計師，我們在設計界面中會很少運用肖形圖形和同構(gòu)圖形進行區(qū)創(chuàng)意。但是在APP閃屏頁中，我們就可以很好的運用的肖形圖形和同構(gòu)圖形?？梢院芎玫呐c品牌LOGO圖形相結(jié)合，更好的為品牌宣傳去服務。在這方面做的最好的當屬Q(mào)Q音樂這款產(chǎn)品，它很好的利用品牌圖形與點、線、面、插畫相結(jié)合進行創(chuàng)意，很好的體現(xiàn)了節(jié)日的主題和氛圍。
總結(jié)-
肖形圖形和同構(gòu)圖形在設計中運用廣泛，通過圖形創(chuàng)意練習可以增加我們創(chuàng)意思維，也可以鍛煉設計總的主次層級、疏密遠近的關(guān)系。相對復雜的視覺圖形元素能處理得當，相信在界面排版中也能很好的分析出層級和層次之間的關(guān)系。
藍藍設計( www.teruid.com )是一家專注而深入的界面設計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網(wǎng)站建設 、平面設計服務。
