|
關(guān)于我們
 書單推薦 新書推薦 |
移動(dòng)端UI元素圖形創(chuàng)意設(shè)計(jì)案例教程 
定 價(jià)：57.8 元
9 7 4 8 3 7 8 1 3 2 0 1 1 讀者對(duì)象:計(jì)算機(jī)軟件技術(shù)專業(yè)學(xué)生、計(jì)算機(jī)數(shù)字媒體專業(yè)學(xué)生、平面設(shè)計(jì)專業(yè)學(xué)生、包裝設(shè)計(jì)專業(yè)學(xué)生、產(chǎn)品設(shè)計(jì)專業(yè)學(xué)生等。 
本書對(duì)接1+X職業(yè)技能等級(jí)證書考試內(nèi)容，融入課程思政內(nèi)容，是崗課賽證融通的項(xiàng)目化教材。本書以培養(yǎng)學(xué)生的UI元素圖形創(chuàng)意能力為根本，結(jié)合繪圖軟件的功能演示，通過案例有針對(duì)性地講解UI項(xiàng)目的設(shè)計(jì)過程及軟件的操作步驟，從而達(dá)到讓學(xué)生熟練掌握繪圖軟件的目的。案例所使用的軟件包括Photoshop、Illustrator和After Effects。全書共10個(gè)項(xiàng)目，項(xiàng)目1是概述，包含UI設(shè)計(jì)的基礎(chǔ)知識(shí)和3個(gè)軟件的功能簡(jiǎn)述。項(xiàng)目2～項(xiàng)目9是各個(gè)案例的分步解析，通過案例講解界面構(gòu)圖、圖形元素和色彩、字體規(guī)范等。項(xiàng)目10是綜合實(shí)戰(zhàn)，包括從項(xiàng)目分析、策劃和設(shè)計(jì)到制作規(guī)范和如何完成的全過程講解。本書不僅可以幫助學(xué)生迅速進(jìn)入職場(chǎng)角色，還提供了豐富的教學(xué)資源幫助教師快速開課。本書主要適合作為軟件技術(shù)專業(yè)，以及UI方向和藝術(shù)設(shè)計(jì)類相關(guān)專業(yè)的高職本科、�？茖W(xué)生的教材。
魏云柯，碩士研究生畢業(yè)于四川大學(xué)，任教于廣東科學(xué)技術(shù)職業(yè)學(xué)院�，F(xiàn)任軟件技術(shù)UI方向團(tuán)隊(duì)負(fù)責(zé)人，澳門設(shè)計(jì)師協(xié)會(huì)會(huì)員，中外設(shè)計(jì)研究院理事。有多年設(shè)計(jì)和一線教學(xué)經(jīng)驗(yàn)，設(shè)計(jì)作品曾獲得亞洲設(shè)計(jì)聯(lián)盟主辦首屆亞洲設(shè)計(jì)雙年展入選作品，并在韓國展出；秘魯“水”主題海報(bào)設(shè)計(jì)比賽入選作品，并在秘魯展出；中國創(chuàng)意設(shè)計(jì)年鑒.2018/2019金獎(jiǎng)一項(xiàng)、銀獎(jiǎng)兩項(xiàng)、銅獎(jiǎng)一項(xiàng)；第七屆中國高等院校設(shè)計(jì)大賽一等獎(jiǎng)一項(xiàng)、三等獎(jiǎng)兩項(xiàng)；第10屆中國高校美術(shù)作品學(xué)年展三等獎(jiǎng)等。指導(dǎo)學(xué)生參加大學(xué)生廣告藝術(shù)大賽、廣東省大學(xué)生計(jì)算機(jī)設(shè)計(jì)大賽等獲得多個(gè)等級(jí)獎(jiǎng)。
項(xiàng)目1 概述............................................................................................ 001
1.1 UI 設(shè)計(jì)的概念和設(shè)計(jì)原則 ....................................................................... 001 1.2 UI 設(shè)計(jì)的流程 ......................................................................................... 003 1.3 UI 元素的分類 ......................................................................................... 007 1.4 UI 版面和字體設(shè)計(jì) .................................................................................. 009 1.4.1 版面設(shè)計(jì)的思路 ......................................................................... 010 1.4.2 版面設(shè)計(jì)的步驟 ......................................................................... 015 1.4.3 字體設(shè)計(jì)在圖標(biāo)和彈出窗口中的運(yùn)用 ......................................... 016 1.4.4 字體設(shè)計(jì)的方法和步驟 ............................................................... 017 1.5 UI 色彩和圖形設(shè)計(jì)概述 .......................................................................... 019 1.5.1 UI 色彩運(yùn)用法則......................................................................... 019 1.5.2 色彩規(guī)范的制作 ......................................................................... 021 1.5.3 圖形設(shè)計(jì)在UI 中的運(yùn)用 ............................................................. 022 1.5.4 圖形設(shè)計(jì)的方法和步驟 ............................................................... 023 1.6 繪圖軟件Photoshop 界面工具和功能簡(jiǎn)述.............................................. 024 1.7 繪圖軟件Illustrator 界面工具和功能簡(jiǎn)述 ................................................ 027 1.8 動(dòng)效軟件After Effects 界面工具和功能簡(jiǎn)述 ........................................... 028 項(xiàng)目2 小學(xué)霸英語App 功能圖標(biāo)設(shè)計(jì)及繪制方法........................................... 030 2.1 功能圖標(biāo)的概念 ...................................................................................... 030 2.2 功能圖標(biāo)范例——已上線 ........................................................................ 030 2.3 功能圖標(biāo)的設(shè)計(jì)原則 ............................................................................... 032 2.4 功能圖標(biāo)的風(fēng)格類型 ............................................................................... 035 2.5 功能圖標(biāo)的設(shè)計(jì)步驟 ............................................................................... 036 2.6 完整項(xiàng)目課堂演示+ 學(xué)生實(shí)操 小學(xué)霸英語App 底部標(biāo)簽欄圖標(biāo)設(shè)計(jì)及 繪制方法 ................................................................................................. 042 2.6.1 項(xiàng)目相關(guān)知識(shí) ............................................................................. 042 2.6.2 項(xiàng)目準(zhǔn)備與設(shè)計(jì) ......................................................................... 042 2.6.3 項(xiàng)目實(shí)施 .................................................................................... 044 2.6.4 項(xiàng)目總結(jié) .................................................................................... 055 2.7 拓展練習(xí) ................................................................................................. 056 項(xiàng)目3 甜在心App 圖標(biāo)設(shè)計(jì)及繪制方法....................................................... 058 3.1 App 圖標(biāo)的概念 ...................................................................................... 058 3.2 App 圖標(biāo)范例——已上線 ........................................................................ 058 3.3 App 圖標(biāo)的設(shè)計(jì)原則 ............................................................................... 064 3.4 App 圖標(biāo)的設(shè)計(jì)步驟 ............................................................................... 064 3.5 完整項(xiàng)目課堂演示+ 學(xué)生實(shí)操 甜在心App 圖標(biāo)設(shè)計(jì)及繪制方法 ............ 070 3.5.1 項(xiàng)目相關(guān)知識(shí) ............................................................................. 070 3.5.2 項(xiàng)目準(zhǔn)備與設(shè)計(jì) ......................................................................... 070 3.5.3 項(xiàng)目實(shí)施 .................................................................................... 072 3.5.4 項(xiàng)目總結(jié) .................................................................................... 089 3.6 拓展練習(xí) ................................................................................................. 091 項(xiàng)目4 桃兔社交通信App 圖標(biāo)和個(gè)人頁設(shè)計(jì)及繪制方法.................................. 092 4.1 色彩的重要性 .......................................................................................... 092 4.2 什么是色彩 ............................................................................................. 092 4.3 色彩搭配方法 .......................................................................................... 096 4.4 優(yōu)秀的圖標(biāo)和界面配色案例賞析 ............................................................. 099 4.5 使用繪圖軟件設(shè)置色彩 ........................................................................... 101 4.6 完整項(xiàng)目課堂演示+ 學(xué)生實(shí)操 桃兔社交通信App 圖標(biāo)和個(gè)人頁設(shè)計(jì)及 繪制方法 ................................................................................................. 107 4.6.1 項(xiàng)目相關(guān)知識(shí) ............................................................................. 107 4.6.2 項(xiàng)目準(zhǔn)備與設(shè)計(jì) ......................................................................... 108 4.6.3 項(xiàng)目實(shí)施 .................................................................................... 109 4.6.4 項(xiàng)目總結(jié) .................................................................................... 124 4.7 拓展練習(xí) ................................................................................................. 125 項(xiàng)目5 怪魚旅行App 引導(dǎo)頁設(shè)計(jì)及繪制方法..................................................126 5.1 引導(dǎo)頁的概念 .......................................................................................... 126 5.2 引導(dǎo)頁范例——已上線 ........................................................................... 126 5.3 引導(dǎo)頁的設(shè)計(jì)原則................................................................................... 129 5.4 引導(dǎo)頁的類別 .......................................................................................... 130 5.5 引導(dǎo)頁的設(shè)計(jì)步驟................................................................................... 136 5.6 完整項(xiàng)目課堂演示+ 學(xué)生實(shí)操 怪魚旅行App 引導(dǎo)頁設(shè)計(jì)及繪制方法 ..... 139 5.6.1 項(xiàng)目相關(guān)知識(shí) ............................................................................. 140 5.6.2 項(xiàng)目準(zhǔn)備與設(shè)計(jì) ......................................................................... 140 5.6.3 項(xiàng)目實(shí)施 .................................................................................... 142 5.6.4 項(xiàng)目總結(jié) .................................................................................... 149 5.7 拓展練習(xí) ................................................................................................. 150 項(xiàng)目6 “不期而遇”女裝促銷Banner 設(shè)計(jì)及繪制方法....................................152 6.1 Banner 的概念 ........................................................................................ 152 6.2 Banner 的設(shè)計(jì)原則 ................................................................................. 153 6.3 Banner 的設(shè)計(jì)步驟 ................................................................................. 155 6.4 完整項(xiàng)目課堂演示+ 學(xué)生實(shí)操 “不期而遇”女裝促銷Banner 設(shè)計(jì)及 繪制方法 ................................................................................................. 163 6.4.1 項(xiàng)目相關(guān)知識(shí) ............................................................................. 164 6.4.2 項(xiàng)目準(zhǔn)備與設(shè)計(jì) ......................................................................... 164 6.4.3 項(xiàng)目實(shí)施 .................................................................................... 165 6.4.4 項(xiàng)目總結(jié) .................................................................................... 170 6.5 拓展練習(xí) ................................................................................................. 170 項(xiàng)目7 好又省家裝詳情頁一屏和個(gè)人頁一屏設(shè)計(jì)及繪制方法...............................172 7.1 詳情頁和個(gè)人頁的概念 ........................................................................... 172 7.2 詳情頁和個(gè)人頁范例——已上線 ............................................................. 173 7.3 詳情頁和個(gè)人頁的設(shè)計(jì)原則 .................................................................... 180 7.4 詳情頁和個(gè)人頁的設(shè)計(jì)步驟 .................................................................... 185 7.5 完整項(xiàng)目課堂演示+ 學(xué)生實(shí)操 好又省家裝詳情頁一屏和個(gè)人頁一屏設(shè)計(jì) 及繪制方法 ............................................................................................. 188 7.5.1 項(xiàng)目相關(guān)知識(shí) ............................................................................. 188 7.5.2 項(xiàng)目準(zhǔn)備與設(shè)計(jì) ......................................................................... 188 7.5.3 項(xiàng)目實(shí)施 .................................................................................... 191 7.5.4 項(xiàng)目總結(jié) .................................................................................... 194 7.6 拓展練習(xí) ................................................................................................. 195 項(xiàng)目8 “Weather Icons”動(dòng)態(tài)圖標(biāo)設(shè)計(jì)及繪制方法......................................196 8.1 動(dòng)態(tài)圖標(biāo)的概念 ...................................................................................... 196 8.2 動(dòng)態(tài)圖標(biāo)范例——已上線 ........................................................................ 197 8.3 動(dòng)態(tài)圖標(biāo)的類型 ...................................................................................... 199 8.4 After Effects 操作入門 ............................................................................ 203 8.5 完整項(xiàng)目課堂演示+ 學(xué)生實(shí)操 “Weather Icons”動(dòng)態(tài)圖標(biāo)設(shè)計(jì)及 繪制方法 ................................................................................................. 206 8.5.1 項(xiàng)目相關(guān)知識(shí) ............................................................................. 208 8.5.2 項(xiàng)目準(zhǔn)備與設(shè)計(jì) ......................................................................... 208 8.5.3 項(xiàng)目實(shí)施 .................................................................................... 208 8.5.4 項(xiàng)目總結(jié) .................................................................................... 215 8.6 拓展練習(xí) ................................................................................................. 216 項(xiàng)目9 怪魚旅行App 首頁版式設(shè)計(jì)及繪制方法...............................................217 9.1 了解移動(dòng)端界面版式設(shè)計(jì) ........................................................................ 217 9.2 優(yōu)秀的移動(dòng)端App 首頁版式范例——已上線 .......................................... 217 9.3 App 界面的布局構(gòu)成 ............................................................................... 219 9.4 App 界面的設(shè)計(jì)原則 ............................................................................... 229 9.5 App 界面的設(shè)計(jì)規(guī)范 ............................................................................... 231 9.6 完整項(xiàng)目課堂演示+ 學(xué)生實(shí)操 怪魚旅行App 首頁版式設(shè)計(jì)及繪制方法 ... 232 9.6.1 項(xiàng)目相關(guān)知識(shí) ............................................................................. 232 9.6.2 項(xiàng)目準(zhǔn)備與設(shè)計(jì) ......................................................................... 233 9.6.3 方案一項(xiàng)目實(shí)施 ......................................................................... 233 9.6.4 方案二項(xiàng)目實(shí)施 ......................................................................... 248 9.6.5 項(xiàng)目總結(jié) .................................................................................... 249 9.7 拓展練習(xí) ................................................................................................. 250 項(xiàng)目10 怦然樂動(dòng)App 界面設(shè)計(jì)及繪制方法...................................................251 10.1 App 界面設(shè)計(jì)概述 ................................................................................ 251 10.2 項(xiàng)目啟動(dòng) ............................................................................................... 251 10.3 項(xiàng)目調(diào)研與分析 .................................................................................... 252 10.4 系統(tǒng)設(shè)計(jì) ............................................................................................... 260 10.5 視覺設(shè)計(jì) ............................................................................................... 264 10.6 完整項(xiàng)目課堂演示+ 學(xué)生實(shí)操 怦然樂動(dòng)App 界面 設(shè)計(jì)及繪制方法 ..... 268 10.6.1 項(xiàng)目相關(guān)知識(shí) ........................................................................... 268 10.6.2 項(xiàng)目準(zhǔn)備與設(shè)計(jì) ....................................................................... 268 10.6.3 項(xiàng)目實(shí)施 .................................................................................. 268 10.6.4 項(xiàng)目總結(jié) .................................................................................. 271 10.7 拓展練習(xí) ............................................................................................... 272
你還可能感興趣
我要評(píng)論
|
