當字體設計好后，我們就要給字體添上合適效果，如果說字體設計是創造，那字效呈現就是美化，對于更追求促銷感和氛圍感的電商設計，有時字效會比字體設計更加重要，通過添加合適效果能使字體更具美感和吸引力，同時也更利于信息和情感傳達，總之是種錦上添花的重要手段。注意字效需遵循“一致性”原則：即字效呈現的氣質需和整體風格一致。只有這樣，才能發揮字效的真正作用，不然就會適得其反，畫面反而顯得不倫不類。

對于電商視覺，字效廣泛用于各類活動頁中，由于字效的樣式豐富，所以對畫面整體及氛圍的影響都非常明顯，有時甚至超過了字體本身。因此對于字體設計能力薄弱的設計師而言，將字效做的好看，往往可彌補字形的普通，正所謂“字形不夠，字效來湊”。關于字效，這里歸納出 4 種常用手法。

立體

通過立體來賦予字體三維屬性，使之具備空間感，這樣會讓文字更有分量和沖擊。常見立體形式有 2 種：直接立體和透視立體，而實現立體效果的方式有“合成”和“三維”。

1. 直接立體

如上圖所示，直接立體又分“加厚”和“凸起”兩大方向。

加厚

直接將字體設計成有厚度的立體字，使文字飽滿突出，形成強有力的沖擊感，特別適合大促主題。“加厚”上手有難度，若是表現寫實風格將更難，需要大家熟能生巧。但立體字也易出效果，在強調信息的同時，畫面設計感也不差。

因為立體字本身就有很強裝飾性，只需放大便能成為主視覺。如下圖所示，立體標題都是畫面的核心部分，再在文字周圍加些點綴元素，這樣視覺就很豐富。

凸起

是指將字體調成微微凸起的樣式，有點類似“浮雕”。“凸起”不如“厚度”效果那么明顯，主要是讓文字多些細節，看著沒那么單調，但總體而言，“凸起”效果稍顯平庸，用的相對較少。

2. 透視立體

一種很有意思的立體形式，“直接立體”是將字體根據自身結構和排布直接立體化；而“透視立體”則是立體化的同時還要與空間透視保持一致，這樣就能融入場景，讓畫面更有帶入感，當然前提是畫面要有相應的場景塑造。

另外字體有時也可不設厚度，直接透視變形即可，如下圖所示。

邊框

在字體周圍加上邊框，使文字更為突出也更有活力，常規有“描邊”和“加框”2 種思路。

1. 描邊

“描邊”可以說無處不在，這是非常經典的處理手法，能豐富字體細節，并提升信息關注度，但用的不好也會顯得 “俗套”，核心是需把握好描邊粗細及配色，如下圖所示，不管粗細還是配色，都要和畫面的主視覺協調統一，不能有違和感。當然描邊可以不止一層，有時可用多層描邊來強化字效（左一）。

2. 加框

通過加底框讓文字多一層“面”，這層“面”將文字圖形化，成為畫面中一個相對獨立的視覺元素，這樣更利于內容凸顯，也更具視覺沖擊。但加框會遮住畫面的部分內容，也使空間沒那么透氣，因此要注意元素分布，盡量不和底框相沖突。根據表現形式的不同，底框又分“圖形”和“擬物”兩大類別。

圖形

如下圖所示，圖形類的底框能使文字排布更加規整。而關于圖形外觀，既可是幾何狀的規則圖形（左一）；也可是圍繞文字的不規則圖形（左二、左三）。

擬物

“擬物”適用于有場景塑造的畫面，注意擬物后的底框一定要和場景氛圍相呼應，例如下方的所有案例，擬物后都能合理存在于各個場景中。

陰影

通過添加陰影使字體呈現出前后層次感，根據添加位置的不同，有 3 種形式：文字疊壓、筆畫疊壓和文字投影。其中文字疊壓和筆畫疊壓由于設計簡單、形式感強、不挑風格等優勢，常被用于各類主題中。

1. 文字疊壓

一般是在每個文字的銜接處添加陰影，使文字呈現出前后層疊感。如下圖所示，“文字疊壓”適用于各種風格，這種微妙空間感能讓標題變的生動有趣。

使用“文字疊壓”需注意 2 點：1）標題的每個字體都要靠近些，這樣前后疊壓才會明顯；2）由于陰影是深色調，所以標題盡量選擇淺色調，只有明暗對比強烈，疊壓效果才更真實。

筆畫疊壓

同樣是疊壓，只是變為在筆畫上添加陰影，使筆畫呈現前后層疊感，像是交織在一起，有點類似“折紙”效果。如圖所示，這種方式能讓標題引人注目，多些細節，但又不會過于浮夸。

“筆畫疊壓”是我常用的一種字效形式，前面很多案例都用了這招，使用時同樣注意 2 點：1）不是字體的每一筆都要添加陰影，而是有選擇的部分添加，一般每字添加 2-3 處即可；2）標題顏色也盡量選擇淺色調。

3. 文字投影

“文字投影”的操作就更加簡單，直接對文字添加“投影”即可，這樣文字和背景便可形成一前一后的空間關系。但要注意投影的虛實程度：越實則文字離背景越近；越虛則文字離背景越遠，具體依需求而定。“文字投影”一般適合背景單純的畫面，因為單純，投影才會明顯，下面展示案例。

質感

通過賦予字體某種肌理或形態，使文字富有質感。根據質感屬性不同又分“筆刷”和“寫實”。

1. 筆刷

用肌理筆刷對字體進行處理，最終模擬出各類筆觸在各種材質上手寫時的狀態。例如下方案例就模擬了斑駁字（左一、左二）、涂鴉字（左三、左四），這些肌理和筆觸讓字體個性十足，同時還促進了字義的情感傳達。

一般來講，“模擬材質”的斑駁字相對容易，只需用筆刷對字體直接刷涂；而“模擬筆觸”的涂鴉字則有難度，只有筆觸和字體筆法的走向完全吻合，才會出現自然流暢的手寫感。

2. 寫實

給字體添加現實中的真實肌理，同時模擬出這類肌理的應有形態。例如金屬字，首先需刻畫出金屬的材質和光影，其次還要將字體設計成金屬常見的剛硬形態，這樣塑造才真實，如下圖所示。

“寫實”的質感種類非常多，選哪種則看頁面主題和風格，但不管哪種都需和場景氛圍高度統一。

霓虹燈 氣球 冰塊

總結

關于字效的 4 種手法，常常會組合使用，核心是要根據畫面風格找到最佳組合方式。如下圖所示，不同的手法組合能使字體呈現出更加豐富的視覺效果，但要記住字效最終是為了提升視覺美感以及更好的傳達信息，千萬不要為字效而字效，要避免出現形式大于內容的“浮夸”字效。

上：立體（直接立體）+邊框（加框）+質感（寫實） 立體（直接立體）+邊框（加框）；下：陰影（筆畫疊壓）+質感（寫實） 立體（透視立體）+邊框（描邊）

本文節選自《移動端賣貨式設計：適配手機屏的電商設計法則與實戰應用（上下冊）》，這本書是作者12年經驗的沉淀，656頁干貨內容搭配22小時案例講解視頻，只教你做移動端能賣貨的有效設計 ?????https://detail.tmall.com/item.htm