作者： ISUX設(shè)計(jì)部，來源：騰訊ISUX

企業(yè)里的設(shè)計(jì)師，既需具備藝術(shù)家的才華技能，同時(shí)還需兼顧從商業(yè)目標(biāo)用戶角度務(wù)實(shí)出發(fā)，兩者缺一不可，前者是基本功修煉，后者是外因環(huán)境所需，今天就和大家談?wù)勗鯓釉谏虡I(yè)環(huán)境下更好地發(fā)揮和勝任運(yùn)營專題類設(shè)計(jì)工作的話題。

前言

目前我們團(tuán)隊(duì)主要負(fù)責(zé)的項(xiàng)目是：QQ會(huì)員和QQ空間黃鉆的系統(tǒng)設(shè)計(jì)、運(yùn)營推廣等，增值服務(wù)相關(guān)業(yè)務(wù)?；谶\(yùn)營和營收核心目的延展品牌推廣、創(chuàng)意執(zhí)行、產(chǎn)品運(yùn)營和商業(yè)化營收等核心工作內(nèi)容。在2012年加入騰訊之前，我在廣告行業(yè)摸爬了五年，以乙方的角度無限挖掘和接近客戶/用戶的心理，以系統(tǒng)的創(chuàng)作技巧快速地找到出彩的創(chuàng)意切入口。

從傳統(tǒng)行業(yè)跨界到互聯(lián)網(wǎng)，給我最大的感觸是：用戶始終是本源，但互聯(lián)網(wǎng)的瞬息萬變節(jié)奏以及幾乎實(shí)時(shí)的市場反饋，要求設(shè)計(jì)師更需要敏捷、高效地滿足市場變化。這時(shí)候，設(shè)計(jì)方法和技巧則顯得尤為關(guān)鍵，如何在單位時(shí)間內(nèi)產(chǎn)出更多質(zhì)量優(yōu)異的作品，構(gòu)建設(shè)計(jì)師的核心競爭力，同時(shí)也是市場和用戶的潛在需求。所以，今天圍繞“高效”展開運(yùn)營專題的設(shè)計(jì)方法分享。

來自互聯(lián)網(wǎng)大環(huán)境：互聯(lián)網(wǎng)特性，時(shí)事熱點(diǎn)跟進(jìn)、外部競品追趕、用戶切層細(xì)分等…這些都要求高效反應(yīng)速度。

來自公司/團(tuán)隊(duì)：業(yè)務(wù)量大，節(jié)點(diǎn)多，高效能讓你提升業(yè)務(wù)消化量，小步快跑，帶動(dòng)業(yè)務(wù)的良性運(yùn)轉(zhuǎn)。

來自設(shè)計(jì)師個(gè)人：能否高效滿足業(yè)務(wù)需求，是一位資深設(shè)計(jì)師和新人職場能力的區(qū)別體現(xiàn)。熟能生巧，掌握設(shè)計(jì)方法論和技巧，結(jié)合日常業(yè)務(wù)經(jīng)驗(yàn)和實(shí)踐沉淀，讓個(gè)人能力不斷成熟精進(jìn)。

結(jié)合自身的情況，我所屬的設(shè)計(jì)團(tuán)隊(duì)主要合作的產(chǎn)品團(tuán)隊(duì)是社交增值團(tuán)隊(duì)，日常需求來源主要是從“增值、營收、運(yùn)營以及商業(yè)化”這四個(gè)方面，要求團(tuán)隊(duì)“想用戶所需，懂用戶所求”。只有精準(zhǔn)地捕捉用戶需求才能更準(zhǔn)確地創(chuàng)造“用戶價(jià)值”，同時(shí)高效地產(chǎn)出迭代版本打造“產(chǎn)品價(jià)值”，最終才能實(shí)現(xiàn)增值的商業(yè)目標(biāo)——“營收價(jià)值”。

這要求我們無論從產(chǎn)品團(tuán)隊(duì)、開發(fā)團(tuán)隊(duì)還是設(shè)計(jì)團(tuán)隊(duì)，都必須以“質(zhì)量+效率”為核心工作理念，又快又好地將符合用戶價(jià)值的產(chǎn)品需求實(shí)現(xiàn)以及傳送到用戶面前。

增值團(tuán)隊(duì)日常工作中會(huì)有很大一部分的工作是解決一些中小型運(yùn)營活動(dòng)，這類活動(dòng)我們也希望視覺呈現(xiàn)的質(zhì)量高、輸出的效率高、參與用戶的數(shù)據(jù)高為目標(biāo)。所以高效設(shè)計(jì)方法本著“四個(gè)步驟的原則”進(jìn)行講述，如何來解決團(tuán)隊(duì)的最高目標(biāo)“高質(zhì)量+高效率+高數(shù)據(jù)”。

項(xiàng)目分析四步驟

首先，在拿到項(xiàng)目需求的同時(shí)需要一個(gè)精準(zhǔn)的項(xiàng)目分析，準(zhǔn)確了解本活動(dòng)的項(xiàng)目目標(biāo)、用戶人群，再進(jìn)行洞察創(chuàng)意得出設(shè)計(jì)策略來指導(dǎo)接下來的設(shè)計(jì)執(zhí)行工作。

Step 1.目標(biāo)

互聯(lián)網(wǎng)行業(yè)里常見的運(yùn)營活動(dòng)需求目標(biāo)主要是拉新、促活、回流、營收這四個(gè)目標(biāo)，同時(shí)伴隨長線的品牌價(jià)值塑造、品牌美譽(yù)度提升等品牌資產(chǎn)構(gòu)建。

拉新：通常在參與過程中設(shè)定使用產(chǎn)品的功能推廣、玩法、差異化，以獲得新用戶。

促活：盤活產(chǎn)品或功能內(nèi)的用戶，培養(yǎng)其“常用”的行為，帶動(dòng)產(chǎn)品整體的活躍。

回流：為產(chǎn)品或功能召回流失用戶，煥發(fā)活躍動(dòng)力。

營收：提升商業(yè)化滲透率，挖掘用戶付費(fèi)能力及需求并有效轉(zhuǎn)化。

在面對運(yùn)營類型需求時(shí)，設(shè)計(jì)師需要先和產(chǎn)品、運(yùn)營經(jīng)理溝通了解活動(dòng)設(shè)立的背景目標(biāo)，了解不同活動(dòng)設(shè)立的首要目的，有助于設(shè)計(jì)師在視覺主題創(chuàng)意時(shí)充分考慮方向路徑。

Step 2.用戶

需要了解本項(xiàng)目活動(dòng)的目標(biāo)用戶。針對用戶人群的不同，使用的概念與手法也相應(yīng)不同。比如：針對學(xué)生用戶使用年輕的、積極向上的；針對女性用戶使用柔軟的，文藝清新的；針對玩家用戶使用視覺刺激的、張力的等等……了解的用戶人群越精準(zhǔn)，傳達(dá)概念也就越靠近。

Step 3.洞察

從用戶的各個(gè)屬性：社交、行為、習(xí)慣，喜好、興趣包括用戶數(shù)據(jù)等等…洞察出創(chuàng)意概念的思路。

Step 4. 策略

從項(xiàng)目目標(biāo)、用戶人群、洞察中提煉出對應(yīng)的“設(shè)計(jì)策略”，落實(shí)到設(shè)計(jì)執(zhí)行當(dāng)中。策略可能是一些關(guān)鍵詞或者是一句話，這些也可以稱作為項(xiàng)目的“創(chuàng)意思路”。

案例《黃鉆十周年》項(xiàng)目分析

目標(biāo)：《黃鉆十周年》項(xiàng)目的目的是商業(yè)營收，通過“十周年特殊銘牌“吸引用戶，拉動(dòng)收入。

用戶：QQ空間黃鉆用戶以及QQ空間活躍用戶。

洞察：通過數(shù)據(jù)顯示，發(fā)現(xiàn)這類活躍用戶非常在意黃鉆會(huì)員特殊的身份價(jià)值。同時(shí)也希望通過本次活動(dòng)發(fā)放“十周年紀(jì)念身份標(biāo)識(shí)”提升用戶身份價(jià)值。

策略：黃鉆十年里程碑，著重強(qiáng)調(diào)特殊身份，引導(dǎo)用戶體驗(yàn)黃鉆新體系、新特權(quán)……

設(shè)計(jì)執(zhí)行：

為了呼應(yīng)十周年主題，在強(qiáng)化數(shù)字“10”的概念同時(shí)，運(yùn)用黃鉆“鉆石”元素貫穿始終，通過鉆石切割角度來塑造主體圖形，漂浮元素選用黃鉆特權(quán)服務(wù)，在界面設(shè)計(jì)中始終使用鉆石切面與棱角元素進(jìn)行設(shè)計(jì)延展。（包括界面，周邊，線下物料等）

通過《黃鉆十周年》活動(dòng)案例了解了如何高效地得出設(shè)計(jì)策略。有了設(shè)計(jì)策略為前提，我們繼續(xù)來探討如何高效地進(jìn)行設(shè)計(jì)執(zhí)行。

設(shè)計(jì)執(zhí)行四步驟

設(shè)計(jì)執(zhí)行也可以歸納為四個(gè)部分：高效構(gòu)圖、高效色彩、高效字體、高效延展。

（一）高效構(gòu)圖

運(yùn)營專題類需求通常頂部為視覺風(fēng)格的創(chuàng)意構(gòu)圖，是創(chuàng)作整個(gè)項(xiàng)目的主思路，構(gòu)圖創(chuàng)作會(huì)引導(dǎo)后續(xù)的各個(gè)步驟環(huán)節(jié)，通過設(shè)計(jì)策略如何高效地創(chuàng)作項(xiàng)目的構(gòu)圖呢？在這里總結(jié)了兩種比較高效的執(zhí)行方法：“現(xiàn)實(shí)形態(tài)”和“幾何形態(tài)”。

1、現(xiàn)實(shí)形態(tài)

字面意思就是以生活當(dāng)中的物體形態(tài)進(jìn)行創(chuàng)作，將項(xiàng)目主題和設(shè)計(jì)圖形強(qiáng)相關(guān)，從主題出發(fā)進(jìn)行創(chuàng)作，提煉關(guān)鍵需求內(nèi)容，在內(nèi)容上做加或減法，填充符合產(chǎn)品需求的視覺元素、文案信息。

比如：創(chuàng)意得出“電玩”、“書籍”、“果汁”的主題形態(tài)，再進(jìn)行符合產(chǎn)品需求、主題信息、產(chǎn)品文案等進(jìn)行加減法的“創(chuàng)作改造”，將“電玩街機(jī)”結(jié)合街頭潮流、“書籍”結(jié)合可揚(yáng)帆的海面、“果汁”結(jié)合海灘滑翔傘……最后進(jìn)行風(fēng)格調(diào)性的統(tǒng)一性延展。

比如：用“大腦”來表達(dá)“不停聯(lián)想”進(jìn)行創(chuàng)意構(gòu)圖；用“神燈”來表達(dá)“許愿主題”進(jìn)行創(chuàng)意構(gòu)圖；用“時(shí)光機(jī)”來表達(dá)“周年歷程”講述時(shí)光流逝心路歷程的創(chuàng)意構(gòu)圖；用“駕駛賽車的第一視角”來表達(dá)“游戲的3周年里程杯似的慶典”。

利用現(xiàn)實(shí)形態(tài)、場景來表達(dá)創(chuàng)意構(gòu)圖可以產(chǎn)生很多的方案。但是有時(shí)會(huì)發(fā)現(xiàn)，在執(zhí)行中會(huì)可能比較復(fù)雜、或者沒有合適的形態(tài)來表達(dá)主題，那么用”幾何形態(tài)“來進(jìn)行定位主題，可以幫你來解決這類難題。

2、幾何形態(tài)

提到幾何形態(tài)大家馬上會(huì)浮現(xiàn)“方形、圓形、三角形”的影子。

其實(shí)利用這三種幾何形態(tài)來輔助構(gòu)圖，也能傳達(dá)較為準(zhǔn)確的視覺感受。特別是在做視覺構(gòu)圖排版、輔助文字、輔助構(gòu)圖時(shí)，幾何形態(tài)更是便捷的元素。

方形

方形是最簡潔的形態(tài)，由直線構(gòu)成、在很多的排版中最常出現(xiàn)，方形、矩形會(huì)讓你的設(shè)計(jì)空間利用最佳化，在閱讀瀏覽上方形可以盡量排除形態(tài)上的干擾，橫平豎直以最整潔的方式梳理信息，所以方形經(jīng)常出現(xiàn)在信息量較大的頁面中，包括一些文字的排版，利用方形的幾何規(guī)則，會(huì)讓你高效地進(jìn)行創(chuàng)作。

圓形

圓形跟方形完全不同，圓形是使用較多的一種圖形，它是由弧線組成、外形光滑、圓潤飽滿，這樣的形態(tài)通常讓我們浮現(xiàn)，可愛、靈動(dòng)、有親和力的畫面想象，它通常在一些Q版、歡樂的主題中出現(xiàn)。運(yùn)用圓形元素，會(huì)有令你意想不到的效果，圓形往往是很吸引眼球的，它會(huì)讓你脫穎而出。圓形的構(gòu)圖會(huì)讓畫面信息留白，適當(dāng)?shù)牧舭讓Ξa(chǎn)品來說相當(dāng)重要，同時(shí)也考驗(yàn)設(shè)計(jì)師的基礎(chǔ)訓(xùn)練是否扎實(shí)。就個(gè)人圖像而言，同樣尺寸下，圓形又能比方形多一些留白空間（在四角處），除了增加與其他內(nèi)容的區(qū)隔性外，也能讓界面帶點(diǎn)趣味性。

三角形

三角形跟以上兩個(gè)圖形比起來更加特殊，三角形上有急轉(zhuǎn)、指示的意思，尖銳的造型給人以強(qiáng)烈的情感刺激和反差，傾斜的角度也會(huì)帶給人以速度感。所以三角形的形態(tài)給我們帶來的感受通常是刺激的，運(yùn)動(dòng)的，時(shí)尚的，尖銳的。這樣的形態(tài)時(shí)常會(huì)出現(xiàn)在一些時(shí)尚運(yùn)動(dòng)品牌或體現(xiàn)速度感、暴力、刺激等主題中。

3、線的運(yùn)用

在構(gòu)圖排版中“線”的使用是必不可少的，靈活地借助線排版會(huì)讓設(shè)計(jì)構(gòu)圖變得更加準(zhǔn)確高效。

輔助線：運(yùn)用線來進(jìn)行元素對齊，可以幫助設(shè)計(jì)構(gòu)圖、版式中構(gòu)建更好的秩序和層次結(jié)構(gòu)，從而實(shí)現(xiàn)設(shè)計(jì)稿層次清晰、簡單易讀，視覺美觀的布局。

分割線：為了用戶更好的閱讀瀏覽，可以運(yùn)用細(xì)線來區(qū)分在板塊結(jié)構(gòu)、或主題文字等……不僅起到了分割效果，而且整體排版中帶有節(jié)奏和對比。

引導(dǎo)線：引導(dǎo)用戶瀏覽路徑，讓元素、圖片、內(nèi)容更好的對應(yīng)，讓用戶在看完內(nèi)容后，順其自然的將焦點(diǎn)引導(dǎo)看到后續(xù)內(nèi)容。又使得排版的形式不一樣，彌補(bǔ)畫面平衡。

其他線：波浪線、曲線、斜線等。線的寬窄樣式和線的平直彎曲，這些形態(tài)上的變化，可以表現(xiàn)出謹(jǐn)慎嚴(yán)肅，也能釋放某種率性天真。可完全裝飾，也可附帶功能，實(shí)際應(yīng)用中需要根據(jù)自身的需求來搭配運(yùn)用。

（二）高效配色

色彩是運(yùn)營專題設(shè)計(jì)必不可少的，色彩的搭配可以改變產(chǎn)品給人的印象。在這個(gè)五彩繽紛的世界里，雖然每天都在享受大自然給予的視覺盛宴，但輪到我們自身來運(yùn)用色彩時(shí)，是不是又覺得無章可循呢？在這將會(huì)介紹基礎(chǔ)的配色理論和一些實(shí)用的高效配色方法：

建立色彩索引

主體構(gòu)圖構(gòu)建好之后，需要定義出：主色、輔色、背景色以及強(qiáng)調(diào)色，作為基本的色彩定義索引。

1、運(yùn)用色環(huán)

色環(huán)是在彩色光譜中所見的長條形的色彩序列，比較基礎(chǔ)就不介紹了。

互補(bǔ)色：挑選色環(huán)上相對對立位置的顏色進(jìn)行搭配?！赴萃辛?！粉絲」運(yùn)營活動(dòng)中是使用了色環(huán)上距離最遠(yuǎn)的黃色和紫色，90%以上的的色彩對比可以足夠吸引用戶眼球。類似這樣的經(jīng)典的對比色還有：圣誕經(jīng)典配色“紅與綠、“橙與藍(lán)”等……

近似色：挑選色環(huán)上距離相鄰的顏色進(jìn)行搭配。這套KAKAOGame游戲論壇現(xiàn)場視覺包裝就是使用黃-橙的近似色進(jìn)行色彩搭配；黃色與綠色也是色環(huán)上的距離相近的顏色。

三色調(diào)：挑選色環(huán)上三種距離基本相等的色彩進(jìn)行搭配。巴塞羅那足球俱樂部的球衣、球場、包括城市相關(guān)的色彩就是用紅、黃、藍(lán)的色彩進(jìn)行色彩搭配，給人深刻的印象。

四色調(diào)：挑選色環(huán)上四種距離基本相等的色彩進(jìn)行搭配。2017年騰訊設(shè)計(jì)周的整體視覺就是采用四色調(diào)進(jìn)行搭配。

Tip：在使用色環(huán)搭配色彩時(shí)，也不能機(jī)械拷貝色環(huán)上的色彩、距離，需要做出優(yōu)化與微調(diào)形成更適合項(xiàng)目的色彩。

2、主題聯(lián)想

根據(jù)項(xiàng)目分析得出設(shè)計(jì)策略，創(chuàng)作的主題方向進(jìn)行搭配色彩，可以在相應(yīng)的主題照片、建筑、室內(nèi)設(shè)計(jì)、視頻等資料中吸取主題需要的色彩。比如：從“甜蜜的馬卡龍?zhí)瘘c(diǎn)”中吸取色彩來渲染濃烈甜蜜浪漫的氛圍；從“清涼解暑夏日照片或廣告”中吸取色彩來注入清涼解暑的夏日派對；從“優(yōu)雅圣誕的擺件、海報(bào)”中吸取色彩來打造溫馨優(yōu)雅圣誕約會(huì)等…

Tips：可以根據(jù)項(xiàng)目目標(biāo)進(jìn)行品牌色的使用，比如：拉新或提升品牌這類目標(biāo)活動(dòng)，可以考慮采用品牌色進(jìn)行創(chuàng)作。

3、搜尋色彩

通過配色網(wǎng)站進(jìn)行色彩搜尋也是有高效簡單的方法。比如：Pinterest是世界上最大的創(chuàng)意工作者的集散地，這里也有著數(shù)量龐大、可供選擇的調(diào)色板。如果打算創(chuàng)作冬天主題的設(shè)計(jì)，在搜索欄內(nèi)輸入：winter color palette，搜尋浪漫的色彩可以輸入：romantic color palette 等等……

當(dāng)然還有很多的配色網(wǎng)站大家也可以進(jìn)行類似相關(guān)的搜索，來輔助你的設(shè)計(jì)比如：shapefactory.co、picular.co等…

4、色彩漸變

色彩漸變是通過使用兩種或多種不同的色彩來進(jìn)行色彩創(chuàng)作，同時(shí)在顏色的交界處逐漸衰減來創(chuàng)造。它能讓設(shè)計(jì)師創(chuàng)造出以前不存在的色彩感覺。在項(xiàng)目中使用色彩漸變，可以讓項(xiàng)目色彩更加豐富加深用戶的視覺印象，也可以更好強(qiáng)化物體的素描明暗關(guān)系。常用的色彩漸變的形式分為三種：色相漸變、明度漸變、色溫漸變。

色相漸變：色相代表色環(huán)中顏色所對應(yīng)的區(qū)域、角度。色相漸變，指的是從一個(gè)色相的顏色過渡到另外一個(gè)色相的顏色。

明度漸變：明度是指顏色的亮度。就像一個(gè)顏色里加黑色，就會(huì)變暗，加白色會(huì)變亮，這類漸變的形式可以加強(qiáng)主體物的體積感、真實(shí)感。

色溫漸變：色溫更多是色彩對心理因素、情感因素的影響。比如藍(lán)色感覺冰冷，紅色感覺溫暖。色環(huán)上也會(huì)形成冷暖色。

關(guān)于色彩漸變的搭配網(wǎng)站，輔助設(shè)計(jì)師來進(jìn)行漸變配色搭配及其靈感創(chuàng)意。

https://webgradients.com/

https://www.grabient.com/

當(dāng)活動(dòng)畫面的主題構(gòu)圖和色彩搭配大框架搭建完畢，整個(gè)設(shè)計(jì)基調(diào)已初步確認(rèn)。

在 Part1 中，我們一起探討了項(xiàng)目分析的四個(gè)步驟，從項(xiàng)目目標(biāo)到用戶人群，進(jìn)行分析洞察得出設(shè)計(jì)執(zhí)行方向的策略。在設(shè)計(jì)執(zhí)行版塊中介紹了【高效構(gòu)圖】、【高效色彩】的方法與技巧，接下來繼續(xù)跟隨我探討【字體】與【延展】的高效設(shè)計(jì)方法。

（三）高效字體

字體設(shè)計(jì)是在創(chuàng)作運(yùn)營設(shè)計(jì)中重要的組成部分，也是互聯(lián)網(wǎng)行業(yè)從事設(shè)計(jì)所最重要的基礎(chǔ)要素。運(yùn)用裝飾手法來美化文字，增強(qiáng)視覺效果，提高作品的訴求和賦予版面的審美價(jià)值。但創(chuàng)作一款字體需要花費(fèi)較大的時(shí)間成本，那么在我們節(jié)奏較快的運(yùn)營設(shè)計(jì)中，如何高效地創(chuàng)作一款適合項(xiàng)目主題并且符合設(shè)計(jì)審美的字體呢？我總結(jié)出了四套設(shè)計(jì)方法：字庫造字、矩形造字、鋼筆造字、手繪造字。

首先在開始創(chuàng)作字體之前，需要了解基本的造字流程，同樣也分為四個(gè)步驟：

分析：根據(jù)“項(xiàng)目分析”得出的設(shè)計(jì)策略，對“活動(dòng)標(biāo)題”或“主題文案”進(jìn)行字體分析得出適合的風(fēng)格方向，收集相關(guān)主題案例資料，輔助創(chuàng)作。

搭建：利用字庫字體或手繪來搭建該字體骨架。

創(chuàng)作：使用變化、裁剪、裝飾、添加等方法進(jìn)行創(chuàng)作表達(dá)主題風(fēng)格寓意。

塑造：添加顏色、特效、裝飾物、背景，置入使用場景，搭配輔助文案驗(yàn)證其效果。了解了造字的基本流程，設(shè)計(jì)師還需完善好電腦里的字庫，對字體廠商需要保持好奇、敏感以及尊敬。接下來將介紹四種字體設(shè)計(jì)的高效方法：

1、字庫造字

利用現(xiàn)有字庫字體，進(jìn)行有主題的字體改造、筆畫添加、筆畫刪減、或重新組合的方法。分為：嫁接、刪減、替代三種不同的方法，適應(yīng)不同的創(chuàng)作方向。

嫁接：根據(jù)主題進(jìn)行針對性的設(shè)計(jì)修飾，在橫、豎、撇、捺的筆畫端點(diǎn)或字體的襯線部分出進(jìn)行添加，通過“多”出來的細(xì)節(jié)，讓字體符合項(xiàng)目主題。比如：添加剛直硬朗的裝飾讓字體變得有力量，添加尖銳三角裝飾讓字體變得尖銳等…

刪減：刪減與嫁接是相對應(yīng)的，在保證字體識(shí)別度的前提下，對筆畫進(jìn)行斷筆、刪除、裁剪；或者將筆畫的某一個(gè)局部斷開，讓字體存在殘缺之美。

替代：在原字體的基礎(chǔ)上，刪減某處或多處筆畫，再用其他形式進(jìn)行代替，可以是另一種字體筆畫替代或是圖形創(chuàng)意的添加。

2、矩形造字

利用矩形、方形、平行四邊形進(jìn)行拼接方法字體設(shè)計(jì)，選取一款適合的字體作為基礎(chǔ)骨架，根據(jù)主題需要進(jìn)行拉伸變形（高、矮、胖、瘦）再將“矩形”元素在骨架上拼接設(shè)計(jì)。

Tips：在使用矩形造字法的過程中，需要遵循字體的粗細(xì)原則（字體在字體筆畫結(jié)構(gòu)簡單的情況下，可以用同樣粗細(xì)的矩形來拼接，但是字體為較復(fù)雜大筆畫結(jié)構(gòu)時(shí)可以遵循以下五個(gè)原則：橫細(xì)豎粗、副細(xì)主粗、內(nèi)細(xì)外粗、密細(xì)疏粗、交叉變細(xì)）

案例：《放肆青春》

分析：該字體是QQ空間12周年的一款廣告字體，需要運(yùn)用在運(yùn)營活動(dòng)、品牌廣告等一系列的地方。品牌紋樣的方形搭配以及構(gòu)成形式，需要一款偏方塊字體來進(jìn)行搭配。

搭建：結(jié)合方形品牌紋樣，選取了結(jié)構(gòu)比較方正硬朗結(jié)實(shí)的“造字工房版黑”字體來作為字體骨架。

創(chuàng)作：根據(jù)搭建的版黑字體骨架將字體進(jìn)行“矩形再造”，使用“斷筆處理”增強(qiáng)設(shè)計(jì)感。設(shè)計(jì)過程中調(diào)整筆畫粗細(xì)、端點(diǎn)以及角度。

塑造：利用矩形造字的五大原則，進(jìn)行最終的完稿調(diào)整。以及運(yùn)用同樣的原理，輸出了整套的文案字庫來適應(yīng)QQ空間12周年項(xiàng)目中所有運(yùn)用。

完稿后，將其他文案字體也進(jìn)行了同樣的創(chuàng)作設(shè)計(jì)，適用在品牌廣告、運(yùn)營活動(dòng)當(dāng)中。

3、鋼筆造字

利用“鋼筆工具”來設(shè)計(jì)字體的筆畫，通過字體的相連、相減、圓滑達(dá)到設(shè)計(jì)感符合項(xiàng)目主題。

案例：《空間大咖秀》

分析：QQ空間直播平臺(tái)推出的欄目，會(huì)讓合作藝人來進(jìn)行直播、互動(dòng)。需要整個(gè)主題字有節(jié)目感、時(shí)尚感、娛樂性、親民性等特點(diǎn)。

搭建：運(yùn)用手繪的形式來進(jìn)行基礎(chǔ)搭建，在草圖形式上大概畫出字體造型，需表達(dá)粗細(xì)、筆畫、曲線、組合形式等。

創(chuàng)作：在軟件里用鋼筆工具畫出筆畫、曲線、以及圓角半徑和線條粗度，進(jìn)行字體編排組合，添加“播放”相關(guān)創(chuàng)意的圖形。

塑造：繼續(xù)調(diào)整字的大小與結(jié)構(gòu)，置入使用場景，確定最終描邊粗度，添加色彩、效果、質(zhì)感讓主題文字表述得更為形象生動(dòng)。

4、手繪造字

這類字體本身帶有手繪痕跡，清新別致，利用筆刷直接在軟件里寫出的字體，隨性自由，使用場景廣泛，但對設(shè)計(jì)師的字體基礎(chǔ)和書法功底要求很高。這種方法當(dāng)然因人而異，根據(jù)設(shè)計(jì)師的書法功底，也有不同的做法，可以直接書寫，也可以使用一款字庫字體作為骨骼框架，在其基礎(chǔ)上進(jìn)行手繪創(chuàng)作。

案例：《QQ空間直播版本宣傳》

QQ空間直播版本宣傳，UGC直播場景，用直播來給好友分享此時(shí)此刻的心情、感受、畫面。采用了手繪體、手記體形式可以增添直播場景中的即時(shí)感。

最后，按其方法繼續(xù)延展出其他兩組字體，覆蓋更多的直播場景中的故事……

（四）高效延展

經(jīng)過構(gòu)圖、色彩、字體的設(shè)計(jì)執(zhí)行基本完成頂部為視覺風(fēng)格的創(chuàng)意構(gòu)圖，接下來就開始進(jìn)入設(shè)計(jì)延展的設(shè)計(jì)。好的設(shè)計(jì)延展，可讓活動(dòng)變得加分添彩。那么如何高效地進(jìn)行設(shè)計(jì)延展部分呢？分為“表現(xiàn)方式”與“設(shè)計(jì)方法”兩個(gè)部分來進(jìn)行設(shè)計(jì)。

表現(xiàn)方式

表現(xiàn)方式我們可以從最基礎(chǔ)的，點(diǎn)、線、面的形式進(jìn)行拆分，來輔助設(shè)計(jì)延展。

點(diǎn)：網(wǎng)格布局、線性布局、隨機(jī)布局、半調(diào)化以及粒子組合。

線：線性排列、面化、結(jié)構(gòu)化、粗細(xì)混合以及異性組合。

面：拼接、疊加、偽3D、Alpha、層級化。

設(shè)計(jì)方法

將表現(xiàn)方式進(jìn)行設(shè)計(jì)再創(chuàng)作可分為：拆分、釋義、聯(lián)想、重構(gòu)的方法。

1、拆分法

將品牌logo主體，拆分為多個(gè)簡約的圖形元素作為輔助圖形進(jìn)行延展。

案例：《Buchanan》

從Buchanan的品牌logo中拆分出圖形元素進(jìn)行重新排列，組合新的品牌元素（數(shù)字、圖形）結(jié)合品牌色進(jìn)行設(shè)計(jì)延展。案例：《QGC》是QQ游戲嘉年華的簡稱，是一年一度QQ游戲平臺(tái)的賽事盛宴，為了更好的突出QQ游戲的品牌創(chuàng)作了機(jī)甲戰(zhàn)鵝來演繹QGC的專屬形象，在logo的字體設(shè)計(jì)、以及輔助圖形創(chuàng)作上中也同樣提取了高達(dá)的機(jī)甲元素進(jìn)行設(shè)計(jì)延展。

案例：《QGC》

是QQ游戲嘉年華的簡稱，是一年一度QQ游戲平臺(tái)的賽事盛宴，為了更好的突出QQ游戲的品牌創(chuàng)作了機(jī)甲戰(zhàn)鵝來演繹QGC的專屬形象，在logo的字體設(shè)計(jì)、以及輔助圖形創(chuàng)作上中也同樣提取了高達(dá)的機(jī)甲元素進(jìn)行設(shè)計(jì)延展。

2、釋義法

結(jié)合品牌釋意或形象，衍伸出多種關(guān)聯(lián)圖形元素作為輔助圖形進(jìn)行設(shè)計(jì)延展。

案例：《COP25》

這款氣候變化大會(huì)的品牌創(chuàng)意是從不同天氣、氣候的特征提取的元素進(jìn)行l(wèi)ogo創(chuàng)作，輔助圖形也是根據(jù)天氣、氣候的各種形態(tài)進(jìn)行重組搭配創(chuàng)作。

案例：《QQ20周年 · 大會(huì)員預(yù)熱》

太空企鵝探索科技作為本次20周年的品牌理念，來寓意新的里程碑。在進(jìn)行運(yùn)營活動(dòng)設(shè)計(jì)時(shí)，希望繼續(xù)延展探索宇宙的概念。用深藍(lán)色宇宙銀河作為整個(gè)主活動(dòng)的背景承托氛圍。主視覺使用了Cyperpunk動(dòng)畫效果，延展設(shè)計(jì)中按鈕和邊框色圖形上也效仿科技電影中未來UI效果，強(qiáng)化整個(gè)活動(dòng)的科技未來感受。

3、聯(lián)想法

總結(jié)品牌圖形特征，通過相似形代表品牌主題，進(jìn)行設(shè)計(jì)延展。

案例：《TEDx Koenigsallee》

從X的變化進(jìn)行圖形創(chuàng)作，形成有序的X，成為輔助圖形進(jìn)行品牌設(shè)計(jì)延展。

案例：《Qzone 12th》

從QQ空間的logo出發(fā)，圍繞星星造型設(shè)計(jì)延展出不同的圖形。注入最有記憶點(diǎn)的品牌色，紋樣的多樣性也映射出用戶青春故事的多樣性。

4、重構(gòu)法

總結(jié)品牌圖形特征，通過相似形代表品牌主題符號(hào)。

案例：《黃鉆10周年》

從logo從中提取“10”和“黃鉆”元素來進(jìn)行設(shè)計(jì)創(chuàng)作，使用重構(gòu)法重新對黃鉆的特權(quán)進(jìn)行歸納。分會(huì)場以及其他的延展圖形（游戲、直播、情侶空間、旅行、個(gè)性化等）繼續(xù)沿用10字的造型進(jìn)行重構(gòu)延展。

案例：《騰訊20周年》

騰訊公司旗下已經(jīng)有數(shù)百種產(chǎn)品服務(wù)和組織機(jī)構(gòu)，在20周年之際設(shè)計(jì)團(tuán)隊(duì)發(fā)起把每一個(gè)業(yè)務(wù)、部門進(jìn)行圖形創(chuàng)作，利用重構(gòu)法進(jìn)行延展設(shè)計(jì)，表達(dá)出每個(gè)子品牌、業(yè)務(wù)、部門的不同的性格、特性以及職能。

以上高效的創(chuàng)作方法與技巧，希望對大家后續(xù)的設(shè)計(jì)工作中有所幫助，為了項(xiàng)目的準(zhǔn)確性，需要多與你的合作伙伴、需求方進(jìn)行反復(fù)溝通；明確了項(xiàng)目目標(biāo)、用戶人群，進(jìn)行創(chuàng)意、洞察得出指導(dǎo)項(xiàng)目的設(shè)計(jì)策略進(jìn)行高效的設(shè)計(jì)執(zhí)行。

案例應(yīng)用

通過《星聯(lián)賽》案例來復(fù)盤一次完整的運(yùn)營需求設(shè)計(jì)步驟。首先從需求目標(biāo)入手，電競行業(yè)近年來可謂炙手可熱，用戶玩家都以觀眾的身份投身于電競項(xiàng)目，能以選手身份在電競比賽中競技的人其實(shí)鳳毛麟角，許多玩家都會(huì)幻想成為一名電競選手征戰(zhàn)電競比賽?！缎锹?lián)賽》洞察了玩家草根的電競夢，希望能承辦實(shí)現(xiàn)每個(gè)玩家心中電競夢想的比賽，全民體驗(yàn)電競的樂趣。

構(gòu)圖-logo

不同于普通的運(yùn)營活動(dòng)，星聯(lián)賽項(xiàng)目啟動(dòng)后，第一步，需為整個(gè)活動(dòng)設(shè)立品牌logo，將QQ空間logo與“Victory”進(jìn)行結(jié)合創(chuàng)造“勝利五星”的圖形，象征每位玩家角逐勝利的雄心壯志，寓意很貼切電競比賽，也容易讓用戶聯(lián)想到QQ空間。

字體-logo

在進(jìn)行創(chuàng)作logo字體設(shè)計(jì)時(shí)，也提煉出的“V”和“三角”元素運(yùn)用在字體中。為了貼合電競比賽緊張激情氛圍，將心跳波動(dòng)的元素與“星聯(lián)賽”字體結(jié)合。

色彩-logo

活動(dòng)單色反白logo確定之后，我們繼續(xù)塑造logo的質(zhì)感，三角形作為背景襯托整個(gè)《星聯(lián)賽》logo。在選取配色的時(shí)候，考慮到電競比賽也是體育競技的一環(huán)，在「星聯(lián)賽」籌備同時(shí)，亞運(yùn)會(huì)也將電子競技項(xiàng)目正式納入了亞運(yùn)會(huì)表演項(xiàng)目，所以我們選取了象征勝利榮耀的金色與紅色來詮釋星聯(lián)賽的體育競技屬性。

構(gòu)圖-主視覺

確定好logo設(shè)計(jì)后，我們進(jìn)入構(gòu)圖的創(chuàng)作，主KV的構(gòu)圖風(fēng)格需與logo呼應(yīng)，同時(shí)它也將奠定界面的視覺設(shè)計(jì)延展基調(diào)。為此創(chuàng)作了三個(gè)方向的概念稿：一是插滿各種游戲道具的武器星球；二是結(jié)合“鐵王座”的梗，設(shè)計(jì)一個(gè)游戲道具打造的至尊王座；三是由游戲中的元素共同組成的勝利之門。

最終選擇了和logo外形更加適配的倒三角形“勝利之門”這一方案作進(jìn)一步細(xì)化。3D白模階段，同樣運(yùn)用了打散重組的方式，將幾款游戲的元素集結(jié)到主體模型中；王者榮耀的水晶塔、武器、翅膀；兩側(cè)部分為QQ飛車中的賽車模型，下半部分則是出和平精英中的各類武器。

色彩-主視覺

主視覺整體的色彩搭配，沿用logo的配色，象征勝利榮耀的金色與紅色來詮釋星聯(lián)賽的體育競技屬性。背景搭配宇宙深邃的藍(lán)色來突出Cyperpunk三角金屬門，希望通過這種三維虛擬的表現(xiàn)形式第一時(shí)間抓住用戶眼球，增強(qiáng)畫面對用戶的感染力，添加藍(lán)色與紅色的對比進(jìn)行競技對抗。

延展-主活動(dòng)

活動(dòng)中有大量圖片展示（如每款游戲的輪播圖、賽事和戰(zhàn)隊(duì)精彩視頻回放、積分商城獎(jiǎng)品展示、浮層等）這都是需要我們利用起來強(qiáng)化品牌感的位置，也可以打造活動(dòng)細(xì)節(jié)，提升項(xiàng)目視覺品質(zhì)。以《星聯(lián)賽》首頁輪播圖為例，運(yùn)用logo中提煉出的“V”元素，延續(xù)整個(gè)活動(dòng)傳達(dá)出的品牌感受，結(jié)合偏游戲感擬物化的視覺表現(xiàn)，搭配金色，雕琢細(xì)節(jié)，強(qiáng)化質(zhì)感，貫穿到整個(gè)延展設(shè)計(jì)中。

活動(dòng)詳情頁是對具體游戲相關(guān)數(shù)據(jù)展示，頭部運(yùn)用等邊三角形元素對logo加以修飾，結(jié)合本款游戲的CG原畫，增強(qiáng)頁面的游戲感和競技感。戰(zhàn)隊(duì)詳情頁主要展示本戰(zhàn)隊(duì)的排名、戰(zhàn)績、參賽場次等數(shù)據(jù)烘托戰(zhàn)隊(duì)競賽氛圍。 

游戲《王者榮耀》、《QQ飛車》以及《和平精英》，在icon的設(shè)計(jì)中體現(xiàn)出每款游戲特點(diǎn)的同時(shí)還要與星聯(lián)賽整體的視覺調(diào)性保持一致，首先提取游戲中具有代表性的元素，分別來代表：報(bào)名玩家、參賽戰(zhàn)隊(duì)、對戰(zhàn)場次。圖形以三角形為基礎(chǔ)，添加質(zhì)感，折角由45°角相切而成，三角邊框協(xié)調(diào)圖標(biāo)之間的平衡感，確保圖標(biāo)體量感統(tǒng)一。

最后，希望本文介紹的方法可以幫助大家的設(shè)計(jì)創(chuàng)作提升效率速度。

經(jīng)授權(quán)轉(zhuǎn)載至成都，轉(zhuǎn)載請聯(lián)系原作者
作者公眾號(hào)：騰訊ISUX(ID:tencent_isux)