本周和大家分享一些大廠常用的設(shè)計(jì)風(fēng)格线椰，這些風(fēng)格大家可能平時(shí)有見過，但是可能沒有系統(tǒng)了解纽窟，今天先和大家?guī)淼谝粋€(gè)風(fēng)格-紋理風(fēng)格肖油，特別是很多韓國設(shè)計(jì)種，他們的作品中大量運(yùn)用了這種設(shè)計(jì)手法臂港，簡單的線條森枪，點(diǎn)線的運(yùn)用，讓頁面充滿了細(xì)節(jié)审孽，在國內(nèi)電商中也運(yùn)用比較多县袱，我們一起來研究下！
它的用法并不難瓷胧，常用做法就是基于品牌衍生出一套品牌輔助圖形显拳，用在界面中，背景中或者作為肌理效果搓萧，它可以是線杂数，也可以是點(diǎn)，也可以是面瘸洛！用法也很多變化揍移，那么今天我們一起來研究下這種風(fēng)格是如何使用的。
紋 理 風(fēng) 格 特 點(diǎn)? ?
1.強(qiáng)運(yùn)用：氛圍背景
它可以作為背景反肋，讓整個(gè)畫面不那么單調(diào)那伐，同時(shí)如果紋理運(yùn)用的好，反而會顯得很高級石蔗，呈現(xiàn)那種低調(diào)的高級感罕邀！點(diǎn)線面其實(shí)一直是設(shè)計(jì)中很重要的點(diǎn)，只是如今大家都玩扁平化养距，反而很多設(shè)計(jì)忽略了這些诉探。
▲?如上圖某電商公司的輔助圖形，可以看出是由三角形棍厌，正方形肾胯，圓形，五角星耘纱，六邊形等組合而成然后基于這些基本圖形衍生出一系列組合方式去應(yīng)用到頁面各個(gè)場景敬肚，如海報(bào)，banner等束析，形成統(tǒng)一的輔助圖形符號艳馒。
▲?這種底紋在設(shè)計(jì)師手里被賦予了魔法，出現(xiàn)在海報(bào)里员寇，營銷頁面上弄慰，形成統(tǒng)一的風(fēng)格和調(diào)性。
▲?在banner中丁恭，這種輔助圖形做為底紋豐富了背景曹动，讓背景更加有層次細(xì)節(jié)
▲ 在這個(gè)海報(bào)中，背景的漩渦以及數(shù)字的圓點(diǎn)效果都很好的將品牌紋理融于到背景中去牲览。
▲?這種手法運(yùn)用起來不用那么單調(diào)墓陈，完全也可以結(jié)合設(shè)計(jì)師想象力去發(fā)揮，去延展出很多不一樣的效果第献，同時(shí)很好的達(dá)成一致性贡必。有心的同學(xué)可以去留意每年的電商設(shè)計(jì)，在背景上都會有這些統(tǒng)一的底紋細(xì)節(jié)在里面庸毫，這些不是設(shè)計(jì)師隨意加的仔拟，而是有一套系統(tǒng)的品牌體系在里面！
2.強(qiáng)運(yùn)用-主圖形
▲?Facebook 8周年的KV設(shè)計(jì)飒赃，設(shè)計(jì)師將底紋作為主要圖形利花，當(dāng)主視覺去運(yùn)用科侈，在這個(gè)工牌設(shè)計(jì)中，運(yùn)用了輔助圖形來形成整個(gè)品牌視覺語言炒事，再結(jié)合很年輕的色彩臀栈，統(tǒng)一而不單調(diào)。
▲?第54界金馬獎(jiǎng)的主LOGO挠乳，非常有特點(diǎn)权薯，設(shè)計(jì)師將54這幾個(gè)字母很好的通過圖形表現(xiàn)出來，這個(gè)LOGO圖形由4個(gè)不同圖形組成睡扬，這些輔助圖形也分別作為主視覺運(yùn)用到其他的設(shè)計(jì)上盟蚣。
▲?海報(bào)的設(shè)計(jì)，簡潔有力卖怜，配合抽象的圖片屎开，讓人充滿了期待。
▲?在2018年雙11潮流盛典的整體設(shè)計(jì)中韧涨，同樣放射重復(fù)性的正方形牍戚，底紋不斷出現(xiàn)在海報(bào)上，形成整體的風(fēng)格調(diào)性虑粥。
▲?在主會場上如孝，同樣運(yùn)用3D正方形重復(fù)作為整個(gè)舞臺來渲染，讓整體設(shè)計(jì)記憶點(diǎn)得到強(qiáng)化娩贷。
▲?在海報(bào)上第晰，背景的肌理效果貫穿始終，形成整體一套的設(shè)計(jì)風(fēng)格彬祖。
3.弱運(yùn)用-頁面輔助
前面兩種茁瘦，底紋都用作主氛圍背景，主圖形储笑，那么在很多時(shí)候甜熔，這些輔助元素運(yùn)用也可以弱一些，使用面積也比較小突倍，它的存在很多時(shí)候能夠讓頁面細(xì)節(jié)更加豐富腔稀。
▲?在平面設(shè)計(jì)中比較常見的用法，紋理和底紋作為輔助圖形羽历，讓頁面的細(xì)節(jié)和氛圍更加豐富焊虏。
▲?在UI設(shè)計(jì)中也常常會出現(xiàn)，如果你的主體是內(nèi)容秕磷，背景稍微有點(diǎn)空洞诵闭，那么就可以使用這種手法，讓背景更加有層次一些。
▲?在88會員的頁面中疏尿，會員的輔助元素作為背景出現(xiàn)在一些需要背景氛圍的設(shè)計(jì)中瘟芝，能很好的將頁面設(shè)計(jì)元素豐富起來。
?U I 中 運(yùn) 用? ?
紋理風(fēng)格應(yīng)用場景也很豐富润歉，從上面案例其實(shí)可以看出模狭，無論是平面還是營銷設(shè)計(jì)颈抚，品牌設(shè)計(jì)踩衩，UI設(shè)計(jì)中都可以去靈活運(yùn)用，關(guān)鍵是看你如何運(yùn)用贩汉。
▲?網(wǎng)易考拉的輔助圖形非常棒驱富，都是基于圓形去延展的，運(yùn)用場景也比較豐富匹舞，在官方的方案呈現(xiàn)中褐鸥，這個(gè)輔助圖形，從始至終的應(yīng)用到頁面每個(gè)場景赐稽。
▲?在頁面的海報(bào)和傳播頁面中叫榕，基于圓形的輔助圖形很好的承載了背景，簡潔的排版也很符合產(chǎn)品整體調(diào)性姊舵。
▲?官網(wǎng)的設(shè)計(jì)中晰绎，輔助圖形圓形也巧妙的運(yùn)用在設(shè)計(jì)中
▲?在APP的界面啟動頁，營銷設(shè)計(jì)括丁，會員頁面荞下，輔助圖形都很巧妙融合在品牌之中，詳細(xì)效果大家可以在http://www.plus-ex.com/#kaola中查看史飞。
▲?在上圖設(shè)計(jì)中尖昏，設(shè)計(jì)師將線條和圓形很好的融于到整個(gè)背景，讓原本平淡的頁面充滿層次和細(xì)節(jié)构资。
▲?在很多這種頭部為主核心的頁面設(shè)計(jì)中抽诉，如果只一個(gè)單獨(dú)的卡片或者按鈕會稍顯得冷淡，設(shè)計(jì)師將自己的品牌logo或者品牌輔助線條很巧妙融合到背景和卡片中吐绵，細(xì)節(jié)頓時(shí)豐富起來迹淌。
▲?這種肌理效果很多時(shí)候也可以傳遞出品牌的氣質(zhì)，品牌的調(diào)性拦赠，左側(cè)那個(gè)音樂播放界面的默認(rèn)圖片巍沙，就特別有品質(zhì)感。右側(cè)電商主界面背景荷鼠，清晰干凈句携，后面的線條背景恰到好處。
▲?在這種大面積背景上允乐，添加這種點(diǎn)線面矮嫉，或者幾何紋理背景能讓頁面不那么單調(diào)削咆，同時(shí)也能傳遞一些品牌元素
網(wǎng) 頁 中 運(yùn) 用? ?
▲?在很多設(shè)計(jì)中，底紋可以起到構(gòu)圖作用蠢笋，同時(shí)也可以做為背景細(xì)節(jié)去運(yùn)用
▲?網(wǎng)站的底紋運(yùn)用拨齐，深色背景下能增強(qiáng)光感，淺色背景下能增加空間
▲?同時(shí)在很多場景昨寞，它的手法可以是底紋瞻惋，也可以是漸變也可以是立體的效果，可以根據(jù)畫面需要效果進(jìn)行調(diào)整援岩。
平 面 中 運(yùn) 用? ?
▲?品牌宣傳海報(bào)歼狼，如果老板下班前告訴你需要做一個(gè)高級的海報(bào)，那么用這種底紋簡潔效果肯定沒錯(cuò)享怀，效果好羽峰，還容易出彩。
▲?各種科技類大會邀請添瓷，簡單的點(diǎn)線面運(yùn)用梅屉，配合一些網(wǎng)格的排版，效果也不會很差鳞贷。
▲?品牌包裝坯汤，包括我們熟知的大牌LV,BV等都是運(yùn)用一個(gè)底紋圖案去作為品牌主圖形，簡單高級悄晃。
圖 形 怎 么 來 玫霎？??
看到這里很多人可能會疑惑，這個(gè)圖形輔助形怎么來呢妈橄，一定不是網(wǎng)上隨便下載或者自己隨便畫庶近！這里需要注意是圖形一定是從你們本身的產(chǎn)品LOGO品牌里面抽取出來，然后去做演變眷蚓！
▲?如上圖鼻种，DOOTA電商的輔助圖形一定是從DOOTA整個(gè)LOGO品牌體系中推導(dǎo)出來的，一定是有一個(gè)設(shè)計(jì)原點(diǎn)在里面沙热。
▲ 考拉的輔助圖形同樣也是從LOGO中提取出來的
所以這里很重要的一點(diǎn)是叉钥，我們在使用圖形或者圖案時(shí)候，一定不是憑空而來篙贸，一定是和我們整個(gè)品牌體系有關(guān)投队，你可以是LOGO中提取的輔助圖形，你也可以是你們產(chǎn)品定位里面功能服務(wù)等等爵川，總之一定需要一個(gè)理由來證明這個(gè)圖形是正確的敷鸦！
今天和大家分享只是拋轉(zhuǎn)引玉，關(guān)于這個(gè)風(fēng)格有很多組合和技巧需要大家多去嘗試！希望可以幫助到大家扒披，下周見值依。
作者：sky，微信公眾號：我們的設(shè)計(jì)日記（ID：helloskys）
本文由 @我們的設(shè)計(jì)日記 原創(chuàng)發(fā)布于簡書碟案。未經(jīng)許可愿险，禁止轉(zhuǎn)載。
