網路購物者，不用7秒鐘就決定了要不要再逛你的網站。

過去，實體店面是讓消費者認識商品與服務的方式，網路崛起後，網站美工設計的第一眼印象相當重要，將影響品牌形象、消費者目光，甚至與業績轉換率息息相關。

消費者常透過網站來了解一件商品、一間公司、企業，網頁視覺設計突出，才能迅速在消費者眼中留下好印象，傳達出企業的品牌形象與定位。

本課程時間為3小時15分鐘，從賣家角度出發，告訴您身為一個賣家，在設計商品圖片的過程中，該注意哪些圖片頁面、構圖、點線面、層次、合成、字體等面向，在搜索商品第一步即抓住消費者目光，到訪店舖消費。

本課程將由老A電商知名講師三元主講，三元老師曾打造過多個暢銷產品，指導診斷過淘寶線上線下多項TOP級店鋪，擅長品牌視覺定位與行銷。

課程內容（共達3個小時）

第1堂課：打好功夫- 電商美工基礎

l 買家需求為何？

l 產品案例分析-圍巾產品為例

l 產品案例分析-男性內著為例

l 如何呈現視覺核心價值

l 如何傳達好的內容

l 視覺內容該如何呈現？

l 課程回顧

第2堂課：圖片與頁面設計流程

l 美工與運營的溝通

l 設計流程梳理（確認主題、構圖、設計主題、氣氛烘托、成品）

l 案例分析：天貓雙旦季

第3堂課：素材處理

l 圖片裁減-如何讓主體更突出

l 後期修圖（光線修正、色彩修正、圖片美化）

l 無損摳圖（鋼筆摳圖、通道摳圖）

l 課程回顧

第4堂課：逃不掉的配色

l 色彩心理（哪個更暖、哪個促銷更火爆、哪個更新鮮）

l 色彩情感分析

l 選出主色系(類似色、對比色、互補色)、配色黃金比例

l 配色流程（繪製草圖、聊整主色調、添加輔色、添加點綴色）

第5堂課：設計中的構圖

l 構圖（背景、商品、文案）方式分析（上下、左右、居中）

l 刻畫主體（放大、置頂、色彩鮮明）

第6堂課：平面設計的點線面

l 為什麼要學點線面

l 點線面概念之應用（點：烘托、活躍線：引導、補充、強調面：背景、主體、內容分割）

第7堂課：做有層次的設計

l 什麼是視覺層次

l 視覺層次有什麼意義(大小、虛實、明暗、前後、遠近、)

l 案例分析：天貓雙旦季

第8堂課：圖片合成

l 如何製作圖片合成（陰影、明暗變化、元素間的融合）

第9堂課：字體怎麼選

l 如何選擇字體（黑體字的選擇、圓體字、宋體字、創意字體設計）

課程目標

1.懂得用設計概念製作網路商店宣傳物
2.將所學知識應用於淘寶賣家經營
3.了解中國大陸的設計邏輯與思維
4.將所學應用於台灣網路事業

適合對象

對於網路創業、淘寶經營、網路商家、網路拍賣有興趣者，
或網路相關設計家皆可報名

學生資格
無特殊限制

單元

30個

課程總長

195分鐘

課堂測驗

尚無測驗

無限觀看

12個月

第一堂課：打好功夫- 電商美工基礎
1 買家需求為何？免費試看試看 15:29
2 產品案例分析-圍巾產品為例免費試看試看 05:14
3 產品案例分析-男性內著為例免費試看試看 02:22
4 如何呈現視覺核心價值免費試看試看 08:59
5 如何傳達好的內容免費試看試看 03:05
6 視覺內容該如何呈現？免費試看試看 03:29
第二堂課：圖片與頁面設計流程
7 美工與運營的溝通免費試看試看 03:15
8 設計流程梳理（確認主題、構圖、設計主題、氣氛烘托、成品）免費試看試看 03:54
9 案例分析：天貓雙旦季免費試看試看 05:17
第三堂課：素材處理
10 圖片裁減-如何讓主體更突出免費試看試看 05:10
11 後期修圖（光線修正、色彩修正、圖片美化）免費試看試看 01:41
12 無損摳圖（鋼筆摳圖、通道摳圖）免費試看試看 09:33
13 課程回顧免費試看試看 04:28
第四堂課：逃不掉的配色
14 色彩心理（哪個更暖、哪個促銷更火爆、哪個更新鮮）免費試看試看 03:56
15 色彩情感分析免費試看試看 05:18
16 選出主色系(類似色、對比色、互補色)、配色黃金比例免費試看試看 12:10
17 配色流程（繪製草圖、聊整主色調、添加輔色、添加點綴色）免費試看試看 05:21
第五堂課：設計中的構圖
18 構圖（背景、商品、文案）方式分析（上下、左右、居中）免費試看試看 08:29
19 刻畫主體（放大、置頂、色彩鮮明）免費試看試看 13:56
第六堂課：平面設計的點線面
20 為什麼要學點線面免費試看試看 03:15
21 點線面概念之應用（點：烘托、活躍線：引導、補充、強調面：背景、主體、內容分割）免費試看試看 19:52
第七堂課：做有層次的設計
22 什麼是視覺層次免費試看試看 03:56
23 視覺層次有什麼意義(大小、虛實、明暗、前後、遠近、) 免費試看試看 08:52
24 案例分析：天貓雙旦季免費試看試看 05:24
第八堂課：圖片合成
25 如何製作圖片合成 - 陰影篇免費試看試看 05:42
26 如何製作圖片合成 - 明暗變化篇免費試看試看 03:06
27 如何製作圖片合成 - 元素間的融合免費試看試看 03:23
第九堂課：字體怎麼選
28 如何選擇字體 - 黑體字篇免費試看試看 09:19
29 如何選擇字體 - 宋體字篇免費試看試看 06:53
30 如何選擇字體 - 創意字體篇免費試看試看 04:06

開始分享你的學習成果吧！

這裡是專屬於課堂學員及老師可以互動的作業區，學員們可以透過實際操作來複習課程中所學習到的內容，作業完成後只要簡單上傳到平台裡，就能得到更多老師的指點唷！同時，在這裡也可以觀摩其他學員的成果，一起來互相切磋吧！

<%if list.length == 0 %>

尚無作業

老師還沒有出作業唷！

<%else%> <%props list%>

作業<%>~numToZH(~toInt(key) + 1)%>

<%if prop.type == 'image' %> 圖片檔 <%else prop.type == 'pdf' %> PDF <%else prop.type == 'youtube' %> Youtube 影片連結 <%else prop.type == 'ppt' %> PowerPoint <%else prop.type == 'sound' %> 錄音檔 <%/if %>

<%:prop.title%>

<%/props%> <%/if%>

作業觀摩

目前還沒有任何學員上傳作業喔！來當第一個吧～

<%props data%>

<%if prop.type == 'image' %> <%else prop.type == 'pdf' %> <%else prop.type == 'youtube' %> <%else prop.type == 'ppt' %> <%else prop.type == 'sound' %> <%/if %> 作業<%>~numToZH(~toInt(key) + 1)%> <%:prop.title%>

<%:~loadTmpl('homework-card', prop.rows)%>

<%/props%>

<%props data%>

<%if prop.type == 'image'%>

<%:~isGif(prop.cover)%>

<%else prop.type == 'pdf' %>

<%else prop.type == 'youtube' %>

<%else prop.type == 'ppt' %>

<%else prop.type == 'sound' %>

<%/if%>

<%if prop.visible == 1 %> <%/if %>

<%:~formatDate(prop.create, 'YYYY-MM-DD')%>

<%:prop.title%>

<%:prop.user%>

<%if prop.isAuthor == true %> 刪除編輯 <%/if %>

<%:prop.comment_count%>

<%/props%>

錄音 <%:~numToZH(sort + 1)%>

來關注最新的課程資訊吧！

這裡是專屬課程的公告區，老師將在此發佈與課程相關的重要資訊，您可以在此看到所有與課程有關的最新公告。

尚無公告

老師還沒有發佈公告唷！

<%props data%>

<%:~formatDate(prop.publishDate, 'YYYY/MM/DD')%>

<%:prop.title%>

<%if ~root.isStudent === false && ~root.isTeacher === false && prop.permission === 'private' %>

本篇公告僅限購課學員閱讀，若您已購買本堂課程，請先以購課帳號登入！

<%else%> <%:prop.content%> <%/if%>

<%/props%>

開始分享你的學習成果吧！

作業觀摩

來關注最新的課程資訊吧！

讓店舖更吸引人-九堂網路商店設計課