項目1網店美工的基礎知識目錄任務1.1什么是網店美工任務1.2網店配色寶典任務1.3文字的應用任務1.1什么是網店美工子目錄1.1.1走進網店裝修1.1.2合理布局讓產品更搶眼任務1.1什么是網店美工技能要求（1）理解網店裝修的定義及重要性。（2）掌握適合自己網店的網店裝修風格的確定方法。（3）了解網店裝修中需要注意的問題。1.1.1走進網店裝修網店裝修主要完成網店頁面設計美化、網店促銷海報制作、把商品照片制作成寶貝描述中所需要的圖片、設計電子宣傳單等工作。1.了解網店裝修1.1.1走進網店裝修1.了解網店裝修

圖1-1

皮帶商品的原始照片圖1-2

還原皮帶的色彩圖1-3

寶貝主圖1.1.1走進網店裝修1.了解網店裝修圖1-4首圖設計示例從原始照片處理開始，通過素材之間的組合，結合當前的活動主題，最終制作成網店裝修頁面的過程就是網店美工。1.1.1走進網店裝修1.了解網店裝修圖1-5網店首頁示例好的網店美工設計可以給顧客帶來視覺上的愉悅、心靈上的震撼，讓人過目不忘、流連忘返，有助于提高成交轉化率。1.1.1走進網店裝修優秀的網店美工設計應將主次分清楚，將每個細節都做到極致，這樣才有更大的機會獲得顧客的點擊。合理的布局和精心的設計，不僅能帶來新顧客，還能留住老顧客，最終提高成交轉化率，即提高銷量。1.了解網店裝修1.1.1走進網店裝修影響網店成交的因素有很多，如決定性因素有首頁裝修、寶貝主圖、詳情頁描述、描述可信度、銷售量、服務保障、質量保證、買家評價、旺旺客服等。而這些因素中的大部分都是需要依靠網店裝修來完成的。2.網店裝修的重要性1.1.1走進網店裝修圖1-6所示的服飾由于沒有經過后期的潤色，因而顯得毫無生氣，很難讓顧客產生興趣。而圖1-7所示的服飾由于經過了后期的色調調整，而顯得明亮、鮮艷，具有品質感。2.網店裝修的重要性

圖1-6沒有經過后期的潤色圖1-7經過后期的色調調整1.1.1走進網店裝修如圖1-8所示，雖然網店銷售產品的種類很多，但是整個頁面都沒有對寶貝進行分類，消費者很難找到自己想要的產品；而如圖1-9所示，每種商品都陳列安排得很恰當，增加了顧客的停留時間。由此可以，漂亮恰當的網店裝修，會給顧客帶來美感，顧客瀏覽網頁時不易疲勞，自然愿意長時間地瀏覽。并且如圖1-9所示，商品在恰當裝飾品的襯托下，會顯得更加誘人，讓人會有購買的欲望，有利于促進成交。2.網店裝修的重要性

1.1.1走進網店裝修

圖1-8效果不好的頁面圖1-9效果好的頁面

1.1.1走進網店裝修圖1-10和圖1-11為兩個相似商品的寶貝詳情頁面，通過比較可以看出，圖1-10一開始就是大段的文字，雖然對商品進行了詳細的說明，但是沒有針對寶貝的細節進行有目的的講解，讓顧客失去了繼續閱讀的興趣。而圖1-11先展示了商品全景，再將寶貝的重要細節進行放大，充分展現出寶貝的特點。由此可以看出，只有經過深思熟慮、精細策劃的網店，才能提高顧客的興趣，從而提高網店的轉化率。3.網店裝修與轉化率的關系

1.1.1走進網店裝修圖1-10沒有瀏覽興趣的頁面

1.1.1走進網店裝修圖1-11有瀏覽興趣的頁面

1.1.1走進網店裝修大多數的設計師裝修網店時會按照品牌上的美感來裝修。然而，這種網店其實是企業用來展示品牌的，真正要達到銷售轉化是很難的。因為顧客網購的目的很明確，之所以進店，一定是對產品感興趣，所以在裝修網店時切記不可喧賓奪主，過多地花時間在裝修設計上。做好網店裝修，可為網店帶來很多好處，如引入流量，提高銷售量；為買家提供方便，使其能快速找到所需的產品；能夠提高認知度，建立品牌和網店形象；讓賣家自身對店內銷售有一個清晰的了解，最終提升網店轉化率。3.網店裝修與轉化率的關系

關系1.1.1走進網店裝修下面以網店首頁裝修為例（見圖1-12），介紹網店裝修風格布局的方法。4.如何確定網店裝修的風格

（a）網店首頁裝修實例1圖1-12

網店示例1.1.1走進網店裝修4.如何確定網店裝修的風格

（b）網店首頁裝修實例2圖1-12

網店示例1.1.1走進網店裝修4.如何確定網店裝修的風格

（c）網店首頁裝修實例3圖1-12

網店示例1.1.1走進網店裝修4.如何確定網店裝修的風格

12345網店設計風格要與主營產品相符風格要統一主題突出，切忌花里胡哨合理使用色彩加載背景音樂的利弊1.1.1走進網店裝修5.網店裝修中需要注意的問題1）網店定位網店定位很重要，就像網店的一個招牌，一眼就能讓消費者了解該店是賣什么的。在網店定位中，風格定位尤為重要，風格定位要結合網店產品所對應的目標人群而定，基本分為清爽型、商業型、?？嵝?、可愛型四種。對于那些無法準確把握目標客戶和產品所針對的類型，建議以清爽型為主，把握好整體色調的搭配，給人一種間接明了、賞心悅目的感覺。1.1.1走進網店裝修5.網店裝修中需要注意的問題2）網店名稱過短的網店名稱造成的結果就是雷同的太多，沒有特色。例如，做代購起一個名字叫海外代購，搜索關鍵詞“海外代購”，結果會出來很多以“海外代購”為名稱的網店，顧客很難進行有針對性的查找。1.1.1走進網店裝修5.網店裝修中需要注意的問題2）網店名稱建議確定網店名稱時要突出本店個性，突出特色品牌和產品，最好還要跟自己的商品有關，讓人一看就懂，并且了解你網店經營的范圍。例如，淘寶網給掌柜30個字的編輯限度是非常重要的，要充分利用好30個字，因為很多人還會利用搜索網店名稱的這個方法來對寶貝進行搜索。1.1.1走進網店裝修5.網店裝修中需要注意的問題3）寶貝分類雖然產品類目采用圖片的方式來分類，更能體現出網店的個性，但是作為新手賣家，為了獲得更多的瀏覽量和人氣，建議不要用圖片進行分類，而是采用關鍵詞對寶貝進行分類。1.1.1走進網店裝修5.網店裝修中需要注意的問題4）商品描述模板賣家的網店裝修模板多為專業設計，大量的圖片不僅會占用大量的空間，而且會大大降低網頁的加載速度。網店描述模板太過華麗，會弱化顧客對商品描述的關注。因此，建議商品描述模板少用圖片，多用代碼；不要過于花哨，要突出對寶貝的描述。1.1.1走進網店裝修5.網店裝修中需要注意的問題5）網店顏色網店的顏色不要太豐富，要統一，要有一個固定的配色方案，就像百度一樣，只用了三種顏色——紅、藍、黑。對顏色進行規范，可減少視覺垃圾，可讓內容更具條理性。1.1.1走進網店裝修5.網店裝修中需要注意的問題6）背景音樂為了讓顧客選購商品時心情更舒暢，打開網頁更快，建議不要加載背景音樂。如果實在想加，也要注意優化音樂大小，設置控制開關。1.1.2合理布局讓產品更搶眼1.分析首頁布局此處添加您的標題網店LOREMIPSUMDOLOR我們以網店是旺鋪專業版，在其自定義模塊上進行裝修。1.1.2合理布局讓產品更搶眼1.分析首頁布局一個正常營業的網店首頁主要由店招、導航條、海報、廣告區、客服旺旺、產品展示、網店頁尾、網店背景等部分組成，如圖1-13所示。首頁布局示例如圖1-14和圖1-15所示。網店首頁及寶貝詳情頁應盡可能將活動和商品的信息最大程度地傳達給顧客。網店首頁首先要找到與產品協調的色調，給人一種良好的印象，其次整個首頁的排版也很重要，如果弄得不好，反而毀了整個頁面布局。1.1.2合理布局讓產品更搶眼圖1-13首頁布局1.1.2合理布局讓產品更搶眼圖1-14首頁布局示例11.1.2合理布局讓產品更搶眼圖1-15首頁布局示例21.1.2合理布局讓產品更搶眼1.分析首頁布局下面以一個化妝品類目的網店（見圖1-16）為例，說明各種裝修頁面中構成布局的組成要素。1234圖像文字背景留白1.1.2合理布局讓產品更搶眼圖1-16化妝品類目的網店1.1.2合理布局讓產品更搶眼1.分析首頁布局一個好的淘寶網店首頁，是能夠吸引買家停留駐足的頁面，在把握整體頁面布局時，首先確定畫面中的幾大模塊，如海報、促銷區、商品分類等，然后確定它們的位置，最后對每個模塊進行細節設計。一個合理的布局能夠給買家很好的購物體驗，在視覺和操作上都能夠給買家留下良好的印象。1.1.2合理布局讓產品更搶眼2.常見的寶貝詳情頁布局下面介紹幾種基本的、較為常用的寶貝詳情頁布局。1）中間對齊模式的頁面布局中間對齊模式的頁面布局是詳情頁設計中用得最廣泛的一種布局方式。如圖1-17所示，頁面結構清晰、主次分明，是初學者最容易上手的布局方法，更貼近消費者的閱讀習慣，同時能夠集中消費者的視線。中間對齊模式的頁面布局的缺點是規矩呆板，如果不注意細部色彩，很容易讓人“看之無味”。1.1.2合理布局讓產品更搶眼圖1-17中間對齊模式的頁面布局1.1.2合理布局讓產品更搶眼2.常見的寶貝詳情頁布局2）Z形模式的頁面布局Z形模式的頁面布局使得顧客的視線是沿曲線前進的，視線形成Z形模式。如圖1-18所示，Z形模式擁有更佳的敘事效果和靈活性。它層次清晰、路徑明確，很受設計師的歡迎；但是一個太生動的背景會分散顧客的視線。因此，在Z形模式中，背景應力求簡潔、平淡。1.1.2合理布局讓產品更搶眼圖1-18

Z形模式的頁面布局1.1.2合理布局讓產品更搶眼2.常見的寶貝詳情頁布局3）左對齊模式的頁面布局要善于抓住顧客的興趣，每行只應傳達一個要點（用圖片顯示），然后將要點分散論述（用文字），左對齊模式的頁面布局適合用于表現有順序之分的內容，如商品的使用說明（見圖1-19）、商品的制作過程等。這些連貫的主題采用左對齊模式的頁面布局來表現，會獲得不錯的效果。1.1.2合理布局讓產品更搶眼圖1-19左對齊模式的頁面布局1.1.2合理布局讓產品更搶眼2.常見的寶貝詳情頁布局4）對稱型的頁面布局對稱是一種美，生活中的許多事物都是對稱的。但過度的對稱會給人一種呆板、死氣沉沉的感覺，因此要適當地打破對稱，制造一點變化。在頁面布局時，即使兩邊的組成元素不是按照完全相同的尺寸和排列方式來布置，但只要兩邊的空間寬度和重量感相同，同樣可以體現出對稱的布局效果。因此，只要頁面左右兩部分協調搭配，網頁就會有非常好的視覺效果，具有沖擊力，如圖1-20和圖1-21所示。1.1.2合理布局讓產品更搶眼圖1-20對稱型的頁面布局11.1.2合理布局讓產品更搶眼圖1-21對稱型的頁面布局21.1.2合理布局讓產品更搶眼2.常見的寶貝詳情頁布局5）棋盤式的頁面布局典型的棋盤式頁面布局與圍棋棋盤一樣，是四四方方的布局，將很多的產品圖片一次性地呈現給顧客，如圖1-22和圖1-23所示。這種布局方法在設計關聯營銷時最常見，有時也適合用在展示商品的各個細節部分上。顧客可以將眾多的商品圖片集中進行比較，在視覺上達到統一和協調。1.1.2合理布局讓產品更搶眼圖1-22棋盤式的頁面布局11.1.2合理布局讓產品更搶眼圖1-23棋盤式的頁面布局21.1.2合理布局讓產品更搶眼2.常見的寶貝詳情頁布局6）口字形模式的頁面布局口字形模式的頁面布局類似于一個方框，就是頁面的左邊和右邊一般是小圖，中間是大圖的主要內容，即鼠標移動到哪個小圖上，中間就呈現出該小圖產品的放大圖片，如圖1-24所示。這種布局的優點是充分利用版面，信息量大；缺點是頁面擁擠，不夠靈活。1.1.2合理布局讓產品更搶眼圖1-24口字形模式的頁面布局1.1.2合理布局讓產品更搶眼2.常見的寶貝詳情頁布局總之，寶貝詳情頁在重構寶貝的過程中只能通過文字和圖片來表達。排列和布置好文字及圖片，是營造良好的客戶體驗，把瀏覽者轉化為消費者的重要前提。由于寶貝的性質不同，需要裝修的風格、內容也就不同，要想給寶貝詳情頁一個合理、有效的布局，就需要確定商品的特點和意圖表現的氛圍，并結合上述的一些頁面布局方式進行設計。任務1.2網店配色寶典技能要求（1）理解色彩的基本分類及屬性。（2）學會色彩的搭配。（3）學會不同風格的產品獲得滿意配色的方法。任務1.2網店配色寶典子目錄1.2.1色彩的基礎知識1.2.2獲取滿意的配色方案1.2.1色彩的基礎知識1.色彩的基本分類我們常用的電腦顯示器等器材所顯示的色彩就是色光，而RGB就是色光的三原色：B表示藍色R表示紅色G表示綠色1.2.1色彩的基礎知識2.色彩的屬性色相即各類色彩的相貌稱謂，是色彩的首要特征，是區別各種不同色彩的最準確的標準。事實上任何黑、白、灰以外的顏色都有色相的屬性。色彩可通過色相呈現出其本質的面貌。1）色相1.2.1色彩的基礎知識2.色彩的屬性

如圖1-25（a）所示，最初的基本色相為紅、橙、黃、綠、藍、紫。在各色中間加插一兩個中間色，其頭尾色相按光譜順序為紅、紅橙、橙、黃橙、黃、黃綠、綠、綠藍、藍綠、藍、藍紫、紫、紅紫，可制出12種基本色相，如圖1-25（b）所示。若在各主要色相中再取中間色，就可做成24色相環。1）色相1.2.1色彩的基礎知識

(a)6色相環(b)12色相環1.2.1色彩的基礎知識下面通過Photoshop軟件操作來了解通過調整圖片的色相，可使其顏色發生改變。如圖1-26和圖1-27所示，通過調整樹葉的色相，使綠色的樹葉變成紅色的樹葉。圖1-26色相調整前1.2.1色彩的基礎知識下面通過Photoshop軟件操作來了解通過調整圖片的色相，可使其顏色發生改變。如圖1-26和圖1-27所示，通過調整樹葉的色相，使綠色的樹葉變成紅色的樹葉。圖1-27色相調整后1.2.1色彩的基礎知識2.色彩的屬性明度是指色彩的亮度，即顏色有深淺、明暗的變化，所有色彩都有自己的光亮。暗色被稱為低明度，亮色被稱為高明度。對于有彩色的明度差別包括兩個方面，一是指某一色相在混入黑或白色后，產生的深淺變化；二是指有彩色不同色相間存在的明度差別。2）明度1.2.1色彩的基礎知識圖1-28明度變化1.2.1色彩的基礎知識為了更好地理解明度，下面通過Photoshop軟件操作來學習。如圖1-29和圖1-30所示，調整樹葉的明度后，樹葉的顏色變得更深了。圖1-29未調整明度的樹葉1.2.1色彩的基礎知識為了更好地理解明度，下面通過Photoshop軟件操作來學習。如圖1-29和圖1-30所示，調整樹葉的明度后，樹葉的顏色變得更深了。圖1-30調整明度后的樹葉1.2.1色彩的基礎知識2.色彩的屬性飽和度也稱為純度或彩度、鮮艷度，是指色彩的純凈程度，也就是色相感覺明確或含糊、鮮艷或混濁的程度。彩度常用高低來表述，彩度越高，色越純，越鮮艷；彩度越低，色越澀，越混濁。3）飽和度1.2.1色彩的基礎知識為了更好地理解飽和度，下面通過Photoshop軟件操作來學習。如圖1-31和圖1-32所示，調整化妝品的飽和度后，商品由原來的暗淡無光變得非常鮮艷誘人。圖1-31未調整飽和度的化妝品1.2.1色彩的基礎知識為了更好地理解飽和度，下面通過Photoshop軟件操作來學習。如圖1-31和圖1-32所示，調整化妝品的飽和度后，商品由原來的暗淡無光變得非常鮮艷誘人。圖1-32調整飽和度后的化妝品1.2.1色彩的基礎知識對于非彩色，沒有色相飽和度的特征，只有明度的特征。如圖1-33、圖1-34和圖1-35所示，調整色相飽和度，圖片不會有任何變化，只有調整明度才會有變化。圖1-33色相變化1.2.1色彩的基礎知識對于非彩色，沒有色相飽和度的特征，只有明度的特征。如圖1-33、圖1-34和圖1-35所示，調整色相飽和度，圖片不會有任何變化，只有調整明度才會有變化。圖1-34飽和度變化1.2.1色彩的基礎知識對于非彩色，沒有色相飽和度的特征，只有明度的特征。如圖1-33、圖1-34和圖1-35所示，調整色相飽和度，圖片不會有任何變化，只有調整明度才會有變化。圖1-35明度變化1.2.1色彩的基礎知識3.色彩的心理感覺1）色彩有冷暖感色彩的冷暖感被稱為色性。紅、黃、橙等色相給人的視覺刺激性強，使人聯想到太陽、火光，感到溫暖，所以稱為暖色。青色和藍色使人聯想到天空、河流、陰天，感到寒冷，所以稱為冷色。1.2.1色彩的基礎知識3.色彩的心理感覺（2）色彩有興奮感和沉靜感。凡明度高、純度高的色調，又屬偏紅、橙的暖色系，均有興奮感。凡明度低、純度低的色調，又屬偏藍、青的冷色系，具有沉靜感。1.2.1色彩的基礎知識3.色彩的心理感覺（3）色彩有膨脹感和收縮感。同一面積、同一背景的物體，由于色彩的不同，給人造成大小不同的視覺效果。凡色彩明度高的物體，看起來面積大些，有膨脹的感覺；凡色彩明度低的物體看起來面積小些，有收縮的感覺。1.2.1色彩的基礎知識3.色彩的心理感覺（4）色彩有前進感和后退感。暖色和明色給人以前進的感覺，冷色和暗色給人以后退的感覺。（5）色彩有輕重感。高明度的色彩給人以輕的感覺，低明度的色彩給人以重的感覺。1.2.1色彩的基礎知識4.色彩的意義紅色是最強有力的色彩，能引起肌肉的興奮、熱烈、沖動。（1）紅色橙色較溫和，是一種很活潑、輝煌的色彩，是一種富足的、快樂的色彩；稍加黑色則顯穩重；與藍色對比時較生動。（2）橙色1.2.1色彩的基礎知識4.色彩的意義黃色亮度最高，尤其燦爛、輝煌，象征著智慧之光，象征著權力、驕傲；經不起白色的沖淡；當用黑、紫、深藍反襯時，能得到加強；淡粉色能使之變得柔和。（3）黃色綠色具有中性的特點。綠色是和平色，偏向自然美，寧靜、生機勃勃。綠色是寬容的色彩，可襯托多種顏色而達到和諧。（4）綠色1.2.1色彩的基礎知識4.色彩的意義藍色代表永恒、博大，讓人有遙遠感。（5）藍色大面積紫色會讓人有恐怖感，紫紅尤其明顯。暗紫有災難感。淡紫則是一種優美的活潑色。紫與黃共存時，消極性更加顯著。（6）紫色1.2.1色彩的基礎知識4.色彩的意義黑與白既對立又有共性，是色彩最后的抽象，能夠用來表達富有哲理性的東西。其中，黑色代表空、無、永恒的沉默；白色代表虛無，有無盡的可能性。黑色與白色都是通過對方的存在來顯示自己的力量的。（7）黑與白1.2.1色彩的基礎知識4.色彩的意義灰色是色彩中最被動的顏色，受有彩色影響極大，靠鄰近的色彩獲得自己的生命；近冷則暖，近暖則冷；最有平靜感（中性），是視覺中最安靜的色彩；有很強的調和對比的作用。（8）灰色1.2.1色彩的基礎知識5.色彩的搭配色彩像音樂一樣，是一種感覺。音樂需要依賴音階來保持秩序，而形成一個體系。同樣的，色彩的三屬性如同音樂中的音階一般，可以用來維持繁多色彩間的秩序，形成一個容易理解又方便使用的色彩體系，所有的色可排成一個環形。這種色相的環狀配列，叫做色相環。1.2.1色彩的基礎知識5.色彩的搭配眾所周知，不同的顏色會給人不同的視覺感受。網店裝修設計在配色時有一定的技巧和規則，只有掌握了這些技巧和規則，才能把自己網店的色彩做到讓顧客看著舒服，又能突出想要表達的東西。1.2.1色彩的基礎知識1）用一種彩色首先選出一種顏色作為主色調，然后調整透明度或者飽和度，說得通俗些就是將色彩加深或減淡，產生新的色彩用于網頁，這樣的頁面看起來色彩統一，有層次感。如圖1-36所示，該頁面選擇了藍色作為主色調，在頁面中配出深淺不一的藍色，這種配色方法在所有的設計中都會用到。1.2.1色彩的基礎知識1）用一種彩色圖1-36用一種彩色1.2.1色彩的基礎知識1）用一種彩色圖1-37拾色器下面說明用Photoshop軟件配出同一種色彩的方法。如圖1-37所示，拾色器中的H表示色相，S表示飽和度，B表示亮度。其中色相就像每一張色卡的“頁碼”，從0°到360°。飽和度就是這張色卡橫向的顏色變化趨勢，越往左，就越跟它差180°的顏色（補色）混合而顏色變淡。1.2.1色彩的基礎知識1）用一種彩色圖1-38亮度變化配出同一種色彩的方法是，在保證色相和飽和度不變的條件下調整亮度。如圖1-38所示，這四個色塊的色調和飽和度是一樣的，只是亮度在變化。1.2.1色彩的基礎知識1）用一種彩色同一種顏色，不同深淺度的漸變，看起來有質感，如圖1-39（a）所示。

（a）（b）圖1-39漸變色注意：漸變色一般不用兩個色系的顏色做漸變，如紅色到藍色、黃色到藍色等。因為不同顏色的漸變，看起來不協調、無質感，而且很刺眼，如圖1-39（b）所示。1.2.1色彩的基礎知識2）選第二種色彩第二種色彩，是基于第一個主色調的對比色。什么是對比色？舉個例子，如果我們在白紙上寫白色的字，是看不到的；但如果寫紅色的字，就可以看到。這里，白色和紅色就是對比色。1.2.1色彩的基礎知識2）選第二種色彩圖1-40對比色不明顯如果在黃色底上寫白色的字，在暗紅色色底上寫黑色的字，因為這些顏色都不是對比色，所以離屏幕遠了根本看不清楚，如圖1-40所示。1.2.1色彩的基礎知識2）選第二種色彩圖1-41對比色太刺眼，色調不統一網店如果沒有對比色，那么這個網店看起來就會很單調，而且沒有重點。但如果在選擇對比色時只憑感覺，就會使設計出來的對比色不夠清晰或者太刺眼，色調不統一，如圖1-41所示。1.2.1色彩的基礎知識2）選第二種色彩圖1-42對比色突出，整體協調如圖1-42所示，對比色突出，整體協調。

1.2.1色彩的基礎知識2）選第二種色彩圖1-43找到某個底色的對比色下面說明用Photoshop軟件找到某個底色的對比色的方法。

如圖1-43所示，左上角的對比色顏色與背景色只是改變了亮度，其余三個圖形的對比色亮度值保持不變，色相和飽和度可以任意調節，從這四幅圖的對比可以看出，大多數情況下，對比色與背景色的色調、飽和度統一搭配，可使色彩看起來更穩重，色調更統一，而且層次分明。1.2.1色彩的基礎知識3）同一色系圖1-47同一色系簡單地說，同一色系就是同一種感覺的色彩，如淺粉色、淺藍色、淺黃色或者暗紅色、暗黃色等。在實際應用中，同一色系的配色要領是，在保證亮度不變的前提下任意調節色相，就可以調出同一種感覺的色彩。如圖1-47所示。

1.2.2獲取滿意的配色方案1.了解配色方案所謂配色方案，簡單地說就是如何將不同的顏色搭配到一起，起到一種和諧的或者有視覺沖擊力的效果。配色方案主要有以下兩種方式。（1）通過色彩的色相、明度和純度的對比來控制視覺刺激，達到配色的效果。（2）通過心理層面感觀傳達、間接性地改變顏色，從而達到配色的效果。1.2.2獲取滿意的配色方案1.了解配色方案如圖1-48所示，黃色和橙色就是鄰近色的搭配。圖1-48鄰近色的搭配

1.2.2獲取滿意的配色方案1.了解配色方案如圖1-49所示，背景色為產品顏色的明度和純度變化，字體采用亮色與背景暗色形成對比。圖1-49對比色的使用1.2.2獲取滿意的配色方案1.了解配色方案如圖1-50、圖1-51所示，從標題的配色能感覺到清爽，符合夏天的感覺，我們會想到夏日、藍天、沙灘、大海、冰塊。圖1-50標題的配色11.2.2獲取滿意的配色方案1.了解配色方案如圖1-50、圖1-51所示，從標題的配色能感覺到清爽，符合夏天的感覺，我們會想到夏日、藍天、沙灘、大海、冰塊。圖1-51標題的配色21.2.2獲取滿意的配色方案2.色彩的基本搭配方法對于美工設計師來講，學配色必須了解配色比例和色彩的關系，這樣才能設計出優秀的作品。如圖1-52所示，日本的設計師提出過一個配色黃金比例，即70∶25∶5，其中70%為大面積使用的主色，25%為輔助色，5%為點綴色。主色的確立會影響整個畫面的格調。圖1-52配色黃金比例1.2.2獲取滿意的配色方案2.色彩的基本搭配方法一般情況下，建議畫面色彩不超過3種，3種是指的3種色相，比如深藍和天藍就是一種色相。一般來說，顏色用得越少越好，顏色越少畫面越簡潔，作品會顯得更加成熟。顏色越少，越容易控制畫面，除非是特殊情況，比如一些節日類的海報等，要求畫面有一種熱鬧、活力的感覺。多些顏色可使畫面顯得很活躍，但是顏色越多越要嚴格按照配色比例來進行分配，不然會使畫面非?；靵y，難以控制。1.2.2獲取滿意的配色方案3.配色方案的制作過于花哨的頁面只能造成訪客的混亂。所以，網店的整體顏色一定要給人統一諧調的感覺。當然，統一的外觀并不是說只能用一種顏色，而是指主色調（在頁面中占據的面積最大且具有主導作用的色彩）只能有一種，在此基礎上再搭配一些其他顏色。如圖1-53所示，主色調是紅色，文字用白色或黑色點綴其間，使得整個頁面既統一又不古板。1）統一的外觀1.2.2獲取滿意的配色方案3.配色方案的制作統一的外觀不僅僅針對某一個頁面，而是對整個網店的所有頁面都適用；否則風格差異太大，當顧客從一個頁面進入另一個頁面時，很容易產生進入了不同網店的錯覺。當然，除了色彩的統一，其他元素（如店招、導航條等）也應統一。1）統一的外觀1.2.2獲取滿意的配色方案3.配色方案的制作圖1-53統一的外觀1.2.2獲取滿意的配色方案3.配色方案的制作（1）單一色彩頁面。選擇單一色彩，并不表示就毫無變化，可以通過調整透明度或飽和度，使單一色彩深淺有別。如圖1-54所示，主色調是藍色，店招、商品修飾圖形及部分文字采用了藍紫色、淺藍色和深藍色等，使得整個頁面看起來色彩統一、有層次感。2）統一色彩的搭配1.2.2獲取滿意的配色方案

圖1-54單一色彩頁面1.2.2獲取滿意的配色方案3.配色方案的制作（2）對比色頁面。先選定一種色彩，然后選擇它的對比色，這個對比色就是第二種顏色。一般來說，色彩的對比強，看起來就有誘惑力，能夠起到集中視線的作用。如圖1-55所示，采用了橙色和藍色的對比，屬于最強烈的色相對比，令人感受到一種極強烈的色彩沖突，產生深刻的印象。2）統一色彩的搭配1.2.2獲取滿意的配色方案圖1-55對比色頁面1.2.2獲取滿意的配色方案3.配色方案的制作（3）類似色頁面。類似色彩雖不是同一色彩但又非常接近，在色相環中，90°角內相鄰接的色，由于其色相對比不強而給人以色感平靜、調和的感覺。如圖1-56所示，使用藍色和紫色兩種類似色彩搭配，這兩種色彩都屬于低明度，由于在色環中屬于類似色，所以在搭配的時候顯得較為自然。這個色彩搭配方案在時尚領域中較為常見，多面向女性受眾和一些對色彩要求較為時尚的場合。2）統一色彩的搭配1.2.2獲取滿意的配色方案圖1-56類似色頁面1.2.2獲取滿意的配色方案3.配色方案的制作（1）合理地使用色彩，可使頁面變得鮮艷、生動、富有活力。但色彩數量的增加并不能與頁面的表現力成正比，要有一種主色貫穿其中，主色不一定是面積最大的顏色，也可以是最重要、最能揭示和反映主題的顏色。不要將所有顏色都用到，盡量控制在3~5種色彩。3）使用色彩的注意事項1.2.2獲取滿意的配色方案3.配色方案的制作（2）在生活中，我們看顏色時會感覺到某些顏色很刺眼，看起來比較累。買家上網絕不希望對自己的視力有損害。因此，頁面用色要盡量少用視疲勞度高的色調。一般來說，高明度、高純度的顏色，刺激強度高，疲勞度也大。在無彩色系中，白色的明度最高，黑色的明度最低；在彩色系中，最明亮的是黃色，最暗的是紫色。刺激強度高的色彩不宜大面積使用，出現的頻率也不宜太高。低明度色彩的色疲勞度雖然較小，但往往給人以壓抑感。因此，比較理想的色調是柔和、明快的淺調暖色。3）使用色彩的注意事項任務1.3文字的應用技能要求（1）理解常見的基礎字體。（2）掌握字體的不同創作手法。（3）學會文字的搭配與布局。任務1.3文字的應用子目錄1.3.1網店設計中字體的選擇1.3.2創意使文字更具創造力1.3.3文字的布局與搭配1.3.1網店設計中字體的選擇從網店設計應用的角度來看，常見的基礎字體有以下幾種。（1）宋體類型（見圖1-57）。宋體是默認文檔的字體，其客觀、典雅、嚴肅，給人古色古香的視覺效果，在網頁中的運用較為普遍。宋體的點、撇、捺、鉤等筆畫有尖端，屬于襯線字體。宋體筆畫中的橫筆較細，不好識別，所以在海報中運用的較少。宋體一般只出現在標題中，在正文內容中運用較少。圖1-57宋體類型

1.3.1網店設計中字體的選擇從網店設計應用的角度來看，常見的基礎字體有以下幾種。（2）黑體類型（見圖1-58）。黑體給人時尚、厚重、搶眼的感覺，多用于標題制作、字幕展示，有強調的效果。Windows系統里自帶的黑體筆畫較細，不太適合直接用于廣告設計中。目前，標題和導語多采用粗黑、大黑、中黑、雅黑加粗等。圖1-58黑體類型1.3.1網店設計中字體的選擇從網店設計應用的角度來看，常見的基礎字體有以下幾種。（3）書法體類型（見圖1-59）。書法體的傳統韻律比較強，在中國式傳統類的設計對象中運用廣泛。例如，隸書剛柔并濟、優雅、表現力豐富、古色古香、韻味十足。因此，書法體在前沿時尚類廣告的設計中不適用。圖1-59書法體類型1.3.1網店設計中字體的選擇從網店設計應用的角度來看，常見的基礎字體有以下幾種。（4）創意類型（見圖1-60）。創意類型即藝術體，藝術體的字體形式比較多變，造型風格各有千秋。例如，娃娃體稚嫩可愛；飾藝體造型復古、優美、活潑，猶如西文的花體字。因此，藝術體常應用于特定人群或節日等創意型、個性型網頁的設計中。圖1-60創意類型1.3.1網店設計中字體的選擇從網店設計應用的角度來看，常見的基礎字體有以下幾種。不一樣的字體會呈現不同的文字風格，給人的感覺不一樣，文化底蘊也不同。注意：字體的選擇要注意字體的使用版權，通常情況下，Windows自帶的字體是可以直接使用的；其他下載的字體，理論上都須授權后才可使用，特別不能直接用于企業網店的標志，以免造成日后出現版權糾紛。1.3.2創意使文字更具創造力1.字體創意設計形象變化是指將整個字作形象化處理。如圖1-61所示，筆畫公用是文字圖形化創意設計中廣泛運用的一種形式。文字是一種視覺圖形，它的線條有著強烈的構成性，可以從單純的構成角度來看筆畫之間的異同，尋找筆畫之間的內在聯系，找到它們可以共同利用的條件，把它提取出來。1）形象變化1.3.2創意使文字更具創造力

圖1-61形象變化1.3.2創意使文字更具創造力

圖1-62代替法如圖1-62所示，圓形代替方形可以說是代替法的一種，也就是把豎線、橫線或折線換成其他比劃。1.3.2創意使文字更具創造力

圖1-63形象變化如圖1-63所示，找到標志中的一個點或一條線作為重點，將其適當拉長，起到畫龍點睛的作用。1.3.2創意使文字更具創造力

圖1-64疊加法如圖1-64所示，疊加法是將文字的筆畫互相重疊或將字與字、字與圖形相互重疊的表現手法。疊加能使圖形產生三度空間感，通過疊加處理的實形和虛形，增加了設計的內涵和意念，以圖形的巧妙組合與表現，使單調的形象豐富起來。

1.3.2創意使文字更具創造力

圖1-65斷肢法如圖1-65所示，將一些封合包圍的字適當地斷開，或把左邊斷一截，或將右邊去一截，稱為斷肢法。

提示：斷肢法應在能識別文字的情況下采用。1.3.2創意使文字更具創造力1.字體創意設計通過字體的肌理變化、漸變效果、字內裝飾、字外裝飾等方式使文字的表現更加具象化。如圖1-66所示，替換法是在統一形態的文字元素中加入另類不同的圖形元素或文字元素。其本質是根據文字的內容意思，用某一形象替代字體的某個部分或某一筆畫。這些形象或寫實或夸張。將文字的局部進行替換，使文字的內涵外露，在形象和感官上都增加了一定的藝術感染力。2）裝飾變化1.3.2創意使文字更具創造力

圖1-66替換法

1.3.2創意使文字更具創造力

圖1-67漸變效果如圖1-67所示，在文字上添加漸變效果，強調主題活動，提前告知消費者網店的銷售信息。

1.3.2創意使文字更具創造力1.字體創意設計根據字詞含義及圖片的應景需要設計字體整體形象。如圖1-68所示，把橫中間拉成圓弧，角也用圓處理。這個方法還有重要的一點就是色彩，在字體處理的基礎上搭配色彩，才能做出俏皮可愛的字體。3）意象變化1.3.2創意使文字更具創造力

圖1-68意象變化

1.3.2創意使文字更具創造力

圖1-69文字錯落有致排列如圖1-69所示，把左右改為左上左下、上下排或斜排（一邊高、一邊低），讓文字錯落有致地排列。

1.3.2創意使文字更具創造力1.字體創意設計畫出字的三維空間感，從視覺上帶給人震撼，甚至讓人激動。鑒于這種立體效果給人的特殊感覺，很多主題文字因為添加了立體效果而容易讓人記住。如圖1-70所示，主題文字的立體變化營造出特定的銷售氛圍。4）立體變化1.3.2創意使文字更具創造力

圖1-70立體變化

1.3.2創意使文字更具創造力2.通過文字營造意境通過文字來傳遞信息、營造意境是設計的有效方式之一。不同的字體擁有不同的特征，如黑體字的莊重肅穆、楷書的優美圓潤、隸書的嚴謹秀氣和草書的張狂飛揚等，這些多樣化字體的應用豐富了畫面意境。例如，炎炎夏日的海報設計中使用帶有冰塊元素的文字，可以營造冰爽的意境。1.3.2創意使文字更具創造力2.通過文字營造意境網店的裝修字體設計不僅應符合網店的風格，還要根據季節、節日的變化而發生相對的變化。簡單的文字配合一些氣氛的營造或色調的渲染，可以讓海報整體呈現不一樣的感覺；還可通過改變顏色、改變字體等方式使主要文字在整體排列中更加突出。1.3.2創意使文字更具創造力2.通過文字營造意境如圖1-71所示，畫面中的文字稍微傾斜，同時主題文字帶有立體效果，再配上漂浮的紅絲帶，整體營造出動態的效果；在文字上使用卡通帽子、小熊、愛心等素材渲染出主題“萌”“愛”的意境；色彩背景給人清新淡雅的感覺，搭配暖色調的主題文字，帶給人濃濃的親情感。1.3.2創意使文字更具創造力2.通過文字營造意境圖1-71文字營造意境11.3.2創意使文字更具創造力2.通過文字營造意境如圖1-72所示，畫面中的主題文字借助書法抽象而成視覺符號，并借助輕重緩和之筆表現出書法獨特的形式美，賦予其濃厚的人文情懷。模特的飄渺，促銷文字的渾厚、“生命的顏色”的雋秀共同打造出一種極富藝術魅力、質樸飄逸的東方意境之美。除此之外，畫面中的紅色文字模塊突出了節日的氛圍，傳遞出網店活動的主要內容。1.3.2創意使文字更具創造力2.通過文字營造意境圖1-72文字營造意境21.3.2創意使文字更具創造力2.通過文字營造意境如圖1-73所示，設