注重實用技能培養(yǎng)——打造“互聯(lián)網(wǎng)+”UI 設(shè)計師 突出創(chuàng)意設(shè)計訓(xùn)練——授人以漁而不只是作品臨摹

真實商業(yè)項目驅(qū)動——行業(yè)知識與專業(yè)設(shè)計相呼應(yīng) 學(xué)習(xí)體驗時尚前衛(wèi)——傳統(tǒng)教材與二維碼革命性攜手

隨著移動互聯(lián)技術(shù)的飛速發(fā)展，“互聯(lián)網(wǎng)+”時代已經(jīng)悄然到來，這自然催生了各行業(yè)、企業(yè)對UI設(shè)計人才的大量需求。與傳統(tǒng)美工、設(shè)計人員相比，新“互聯(lián)網(wǎng)+”時代對UI設(shè)計師提出了更高的要求，傳統(tǒng)美工、設(shè)計人員已無法勝任。在這樣的大環(huán)境下，這套“互聯(lián)網(wǎng)UI設(shè)計師”系列教材應(yīng)運而生，它旨在幫助讀者朋友快速成長為符合“互聯(lián)網(wǎng)+”時代企業(yè)需求的優(yōu)秀UI設(shè)計師。

這套教材是由課工場（kgc.cn）的UI/UE教研團隊研發(fā)的。課工場是北大青鳥集團下屬企業(yè)北京課工場教育科技有限公司推出的互聯(lián)網(wǎng)教育平臺，專注于互聯(lián)網(wǎng)企業(yè)各崗位人才的培養(yǎng)。平臺匯聚了數(shù)百位來自知名培訓(xùn)機構(gòu)、高校的頂級名師和互聯(lián)網(wǎng)企業(yè)的行業(yè)專家，面向大學(xué)生以及需要“充電”的在職人員，針對與互聯(lián)網(wǎng)相關(guān)的產(chǎn)品、設(shè)計、開發(fā)、運維、推廣和運營等崗位，提供在線的直播和錄播課程，并通過遍及全國的幾十家線下服務(wù)中心提供現(xiàn)場面授以及多種形式的教學(xué)服務(wù)，且同步研發(fā)出版最新的課程教材。

課工場為培養(yǎng)互聯(lián)網(wǎng)UI設(shè)計人才設(shè)立了UI/UE設(shè)計學(xué)院及線下服務(wù)中心，提供各種學(xué)習(xí)資源和支持，包括：

　現(xiàn)場面授課程

　在線直播課程

　錄播視頻課程

　案例素材下載

　學(xué)習(xí)交流社區(qū)

　作業(yè)提交批改系統(tǒng)

　QQ討論組（技術(shù)、就業(yè)、生活）

以上所有資源請訪問課工場UI/UE學(xué)院：kgc.cn/uiue。

■ 本套教材特點

（1）課程高端、實用——拒絕培養(yǎng)傳統(tǒng)美工。

　培養(yǎng)符合“互聯(lián)網(wǎng)+”時代需求的高端UI設(shè)計人才，包括移動UI設(shè)計師、網(wǎng)頁UI設(shè)計師、平面UI設(shè)計師。

　除UI設(shè)計師所必須具備的技能外，本課程還涵蓋網(wǎng)絡(luò)營銷推廣內(nèi)容，包括：網(wǎng)絡(luò)營銷基本常識、符合SEO標(biāo)準(zhǔn)的網(wǎng)站設(shè)計、Landing Page設(shè)計優(yōu)化、營銷型企業(yè)網(wǎng)站設(shè)計等。

　注重培養(yǎng)產(chǎn)品意識和用戶體驗意識，包括電商網(wǎng)站設(shè)計、店鋪設(shè)計、用戶體驗、交互設(shè)計等。

　學(xué)習(xí)W3C相關(guān)標(biāo)準(zhǔn)和設(shè)計規(guī)范，包括HTML5/CSS3、移動端Android/iOS相關(guān)設(shè)計規(guī)范等內(nèi)容。

（2）真實商業(yè)項目驅(qū)動——行業(yè)知識、專業(yè)設(shè)計一個也不能少。

　與知名4A公司合作，設(shè)計開發(fā)項目課程。

　幾十個實訓(xùn)項目，涵蓋電商、金融、教育、旅游、游戲等行業(yè)。

　不僅注重商業(yè)項目實訓(xùn)的流程和規(guī)范，還傳遞行業(yè)知識和業(yè)務(wù)需求。

（3）更時尚的二維碼學(xué)習(xí)體驗——傳統(tǒng)紙質(zhì)教材學(xué)習(xí)方式的革命。

　每章提供二維碼掃描，可以直接觀看相關(guān)視頻講解和案例操作。

　課工場UI/UE學(xué)院（kgc.cn）開辟教材配套版塊，提供素材下載、學(xué)習(xí)社區(qū)等豐富的在線學(xué)習(xí)資源。

■ 讀者對象

（1）初學(xué)者：本套教材將幫助你快速進入互聯(lián)網(wǎng)UI設(shè)計行業(yè)，從零開始，逐步成長為專業(yè)UI設(shè)計師。

（2）設(shè)計師：本套教材將帶你進行全面、系統(tǒng)的互聯(lián)網(wǎng)UI設(shè)計學(xué)習(xí)，傳遞最全面、科學(xué)的設(shè)計理論，提供實用的設(shè)計技巧和項目經(jīng)驗，幫助你向互聯(lián)網(wǎng)方向迅速轉(zhuǎn)型，拓寬設(shè)計業(yè)務(wù)范圍。

課工場出品（kgc.cn）

第1章
    網(wǎng)站UI項目管理規(guī)范
本章簡介 2
1.1 互聯(lián)網(wǎng)網(wǎng)站的分類 2
1.2　構(gòu)成網(wǎng)頁的元素 8
1.2.1　文字 8
1.2.2　圖像 9
1.2.3　多媒體 11
1.2.4　交互元素 12
1.3　網(wǎng)頁UI設(shè)計的基本步驟 13
1.3.1　設(shè)計頁面的前期準(zhǔn)備 13
1.3.2　使用參考線繪制大致結(jié)構(gòu) 15
1.3.3　繪制內(nèi)容 16
1.3.4　輸出切片 16
1.4　網(wǎng)頁設(shè)計原則及規(guī)范 17
1.4.1　布局實用原則 17
1.4.2　網(wǎng)頁配色實用原則 21
1.4.3　設(shè)計的四大基本原則 24
1.5　網(wǎng)頁切片輸出 24
1.5.1　切片概述 25
1.5.2　規(guī)則切片 26
1.5.3　手動切片 27
1.5.4　輸出、保存文件設(shè)置 30
1.5.5　編輯切片 31
1.5.6　常用切片技巧 32
本章總結(jié) 33
第2章
    聯(lián)想官網(wǎng)——營銷型企業(yè)網(wǎng)站視覺設(shè)計
本章簡介 36
2.1　聯(lián)想官網(wǎng)——營銷型企業(yè)網(wǎng)站設(shè)計需求概述 36
2.1.1　項目名稱 37
2.1.2　項目定位 37
2.1.3　聯(lián)想集團企業(yè)背景 37
2.1.4　網(wǎng)站功能要求 37
2.1.5　網(wǎng)站風(fēng)格要求 38
2.2　營銷型企業(yè)網(wǎng)站相關(guān)理論講解 38
2.2.1　營銷型企業(yè)網(wǎng)站概述 38
2.2.2　營銷型企業(yè)網(wǎng)站和普通企業(yè)網(wǎng)站的區(qū)別 38
2.2.3　需要營銷型網(wǎng)站的企業(yè) 40
2.3　聯(lián)想官網(wǎng)——營銷型企業(yè)網(wǎng)站設(shè)計需求分析 40
2.3.1　競爭對手分析 40
2.3.2　目標(biāo)用戶分析 43
2.4　聯(lián)想官網(wǎng)——營銷型企業(yè)網(wǎng)站設(shè)計規(guī)劃 43
2.4.1　界面整體風(fēng)格定位 43
2.4.2　首頁界面布局分析 44
2.4.3　界面色彩定位 44
2.5　聯(lián)想官網(wǎng)——營銷型企業(yè)網(wǎng)站視覺設(shè)計思路 45
2.5.1　技術(shù)要點 45
2.5.2　大體框架、色調(diào) 45
2.5.3　素材準(zhǔn)備 47
2.5.4　頂部設(shè)計 47
2.5.5　設(shè)計導(dǎo)航 48
2.5.6　設(shè)計主要banner 48
2.5.7　設(shè)計新品推薦等內(nèi)容區(qū) 49
2.5.8　設(shè)計版權(quán)區(qū) 49
2.5.9　切片輸出 50
本章總結(jié) 51
第3章
    天貓商城——電商網(wǎng)站視覺設(shè)計
本章簡介 54
3.1　電商網(wǎng)站概述 54
3.1.1　什么是電商網(wǎng)站 54
3.1.2　電商網(wǎng)站的功能 56
3.2　從電商出發(fā)——界面設(shè)計前的準(zhǔn)備 59
3.2.1　銷售的是什么 59
3.2.2　需要的功能 60
3.2.3　目標(biāo)用戶群 60
3.3　電商網(wǎng)站主要頁面設(shè)計技巧 61
3.3.1　首頁設(shè)計 61
3.3.2　列表頁設(shè)計 70
3.3.3　商品詳情頁設(shè)計 71
3.3.4　其他頁面 71
3.4　天貓商城——電商網(wǎng)站首頁設(shè)計 72
3.4.1　技術(shù)要點 73
3.4.2　劃分大致布局 73
本章總結(jié) 76
第4章
   　三星天貓旗艦店——電商網(wǎng)站店鋪視覺
營銷設(shè)計
本章簡介 78
4.1　三星天貓旗艦店——電商網(wǎng)站店鋪裝修需求描述 78
4.1.1　項目名稱 78
4.1.2　項目描述 78
4.1.3　界面要求 78
4.2　電商網(wǎng)站店鋪裝修相關(guān)理論 79
4.2.1　店鋪首頁 79
4.2.2　店鋪詳情頁 87
4.3　三星天貓旗艦店——電商網(wǎng)站店鋪裝修需求分析 92
4.3.1　競爭對手分析 92
4.3.2　用戶（消費群體）分析 94
4.4　三星天貓旗艦店——電商網(wǎng)站店鋪裝修思路 95
4.4.1　技術(shù)要點 96
4.4.2　店鋪首頁設(shè)計 96
本章總結(jié) 99
第5章
  　Apple Watch百度推廣頁——Landing Page設(shè)計與優(yōu)化
本章簡介 102
5.1　Landing Page概述 102
5.1.1　Landing Page的定義 103
5.1.2　互聯(lián)網(wǎng)營銷的目標(biāo) 103
5.1.3　用戶到達Landing Page的行為 105
5.2　Landing Page的類型 107
5.2.1　交易型Landing Page 107
5.2.2　參考型Landing Page 107
5.2.3　壓縮型Landing Page 108
5.3　Landing Page的內(nèi)容選擇 109
5.3.1　明確核心目的 109
5.3.2　明確目標(biāo)人群 110
5.3.3　分析目標(biāo)人群的特征 110
5.3.4　確定賣點和主題 111
5.3.5　整理、組織內(nèi)容 111
5.4　Landing Page的設(shè)計方法 115
5.4.1　Landing Page頁面結(jié)構(gòu)概述 115
5.4.2　Landing Page頁面元素布局 119
5.4.3　Landing Page頁面顏色配置 128
5.5　返利網(wǎng)Landing Page的分析與優(yōu)化 131
5.5.1　案例描述 131
5.5.2　案例分析 131
5.6　返利模塊優(yōu)化 133
5.7　Apple Watch Landing Page的設(shè)計分析 133
5.7.1　需求說明 134
5.7.2　實現(xiàn)流程 135
5.7.3　蘋果Landing Page分析 135
本章總結(jié) 137
第6章
   　英雄聯(lián)盟——游戲類網(wǎng)站改版設(shè)計
本章簡介 140
6.1　英雄聯(lián)盟——游戲類網(wǎng)站改版項目背景 140
6.2　網(wǎng)站改版的好處及注意事項 141
6.2.1　網(wǎng)站改版的好處 141
6.2.2　網(wǎng)站改版的注意事項 142
6.3　英雄聯(lián)盟——游戲類網(wǎng)站改版項目分析 143
6.3.1　風(fēng)格定位 143
6.3.2　對老官網(wǎng)進行分析 143
6.3.3　對新游戲UI進行分析 145
6.4　英雄聯(lián)盟——游戲類網(wǎng)站改版項目設(shè)計規(guī)劃 146
6.4.1　布局規(guī)劃 146
6.4.2　色調(diào)規(guī)劃 147
6.5　英雄聯(lián)盟——游戲類網(wǎng)站改版項目首頁視覺設(shè)計 148
本章總結(jié) 150
第7章
   　我秀網(wǎng)“開學(xué)季”專題頁視覺設(shè)計
本章簡介 152
7.1　我秀網(wǎng)“開學(xué)季”專題頁視覺設(shè)計項目需求 152
7.1.1　項目名稱 152
7.1.2　項目背景 152
7.1.3　項目功能要求 153
7.2　專題頁視覺設(shè)計相關(guān)理論 154
7.2.1　專題頁和傳統(tǒng)產(chǎn)品頁面的視覺差異 154
7.2.2　專題頁的結(jié)構(gòu) 155
7.2.3　專題頁的組成 158
7.3　我秀網(wǎng)“開學(xué)季”專題頁視覺設(shè)計項目需求分析 159
7.3.1　競爭對手分析 159
7.3.2　用戶分析 161
7.4　我秀網(wǎng)“開學(xué)季”專題頁視覺設(shè)計項目設(shè)計規(guī)劃 161
7.4.1　界面整體結(jié)構(gòu) 161
7.4.2　頁面風(fēng)格 162
7.5　項目實現(xiàn)思路 162
7.5.1　整體設(shè)計風(fēng)格定位 162
7.5.2　素材搜集 163
7.5.3　首屏展示內(nèi)容 164
7.5.4　次屏展示內(nèi)容 165
7.5.5　版權(quán)區(qū)設(shè)計 165
7.5.6　切片輸出 165
本章總結(jié) 167
第8章
   　北大青鳥信息管理系統(tǒng)——企業(yè)OA系統(tǒng)
界面設(shè)計
本章簡介 170
8.1　北大青鳥信息管理系統(tǒng)——企業(yè)OA系統(tǒng)界面設(shè)計項目
   需求概述 170
8.1.1　項目名稱 171
8.1.2　項目背景 171
8.1.3　項目要求 171
8.2　企業(yè)OA系統(tǒng)相關(guān)理論知識 172
8.2.1　企業(yè)OA系統(tǒng)包含的常規(guī)內(nèi)容 172
8.2.2　企業(yè)OA的優(yōu)勢 173
8.3　像產(chǎn)品經(jīng)理一樣進行需求分析 174
8.3.1　用戶分析 174
8.3.2　項目設(shè)計規(guī)劃 174
8.4　北大青鳥OA系統(tǒng)——企業(yè)OA系統(tǒng)界面設(shè)計項目
   實現(xiàn)思路 176
8.4.1　技術(shù)要點 177
8.4.2　繪制登錄頁效果圖 177
8.4.3　繪制主界面效果圖 177
本章總結(jié) 179

1. 基于AE與C#的地理信息系統(tǒng)二次開發(fā) [李小根 賈艷昌 喬翠平 姜彤 ]
2. 微信小程序開發(fā)項目實戰(zhàn)（微課版） [主編 黃龍泉 郭峰 朱倩]
3. 基于雙元制的建筑工程技術(shù)專業(yè)標(biāo)準(zhǔn)開發(fā) [主編 李紅立 徐小珊]
4. 基于雙元制的機電一體化技術(shù)專業(yè)、工業(yè)機器人技術(shù)專業(yè)標(biāo)準(zhǔn)開發(fā) [主編 黃崇富 朱永麗 胡銀全]
5. 鴻蒙系統(tǒng)應(yīng)用開發(fā)項目化教程 [鄧文達　史勁　李禮]
6. 人工智能開發(fā)框架應(yīng)用 [主編 王明超 蘆婭云]
7. 三峽梯級電站水資源決策支持系統(tǒng)研究與開發(fā) [姚華明 潘紅忠 湯正]
8. Web技術(shù)開發(fā)教程（基于.NET開源MVC框架） [王合闖 韓紅玲 王青正 陳海蕊]
9. SwiftUI完全開發(fā) [李智威 著]
10. Unity3D虛擬現(xiàn)實應(yīng)用開發(fā)實踐 [主 編 劉龍]
11. 黃河流域非遺衍生品傳播與經(jīng)濟開發(fā)協(xié)同發(fā)展研究 [畢雪燕 趙爽 著]
12. 人工智能應(yīng)用系統(tǒng)開發(fā)項目化教程 [主編 楊家慧 周永福 魏育華]
13. 媒體融合影響下的體育電視傳播與價值開發(fā)策略研究——以世界杯/NBA為例 [趙曉琳 著]
14. “學(xué)賽一體化”課程開發(fā)研究 [李作聚 著]
15. VR-X3D虛擬現(xiàn)實開發(fā)與設(shè)計 [張金釗 張金鏑]
16. 網(wǎng)站前端技術(shù)案例教程（HTML+CSS+JavaScript）（第二版） [黃華升]
17. Web前端開發(fā)項目化教程（微課版） [主編　郭立文　王洪波]
18. Unity應(yīng)用開發(fā)與實戰(zhàn)（微課版） [主 編 程永恒]
19. 深入淺出OpenHarmony——架構(gòu)、內(nèi)核、驅(qū)動及應(yīng)用開發(fā)全棧 [李傳釗 著]
20. Python開發(fā)實踐教程（第二版） [于京 陳平生 編著]
21. Java Web開發(fā)技術(shù)任務(wù)驅(qū)動式教程 [金靜梅]
22. HTML5+CSS3前端開發(fā)項目式教程（微課版） [主編 譚衛(wèi) 徐文義]
23. iOS項目開發(fā)實戰(zhàn) [主編 趙善龍 劉俊馳]
24. UI設(shè)計與開發(fā) [主編　李昀蕓　宋蓓蓓　王悅娟]
25. ASP.NET（C#）網(wǎng)站開發(fā)（第二版） [主編 張志明 王輝]
26. ARM Cortex-M體系架構(gòu)與接口開發(fā)實戰(zhàn) [林慶峰 等 編著]
27. 基于Android平臺的移動開發(fā)技術(shù) [主編 徐碩博 黃衛(wèi)東 賈雁]
28. Android 應(yīng)用開發(fā)項目實戰(zhàn) [主編 梁 琨 朱冰鴻]
29. Java Web開發(fā)技術(shù)與項目實戰(zhàn) [主編 羅如為]
30. Android開發(fā)基礎(chǔ)教程 [黃日勝 謝志偉 楊凌 楊琳芳]