《UI設(shè)計(jì)從零蛻變:UI、UE與動(dòng)效設(shè)計(jì)全解密》通過精選案例引導(dǎo)讀者深入學(xué)習(xí),系統(tǒng)地介紹了UI設(shè)計(jì)的相關(guān)知識(shí)和應(yīng)用方法。
全書分為7篇,共26章。1篇為Hello UI篇,主要介紹UI基礎(chǔ)知識(shí)和UI設(shè)計(jì)師的自我修養(yǎng)。第2篇為設(shè)計(jì)之道,主要介紹設(shè)計(jì)中的點(diǎn)、線、面、色彩的表達(dá)藝術(shù)等內(nèi)容。第3篇為圖標(biāo)設(shè)計(jì),主要介紹PS圖標(biāo)設(shè)計(jì)技巧、iOS圖標(biāo)、生活類、視聽類、攝影類、質(zhì)感類和Dribbble風(fēng)格的APP圖標(biāo)設(shè)計(jì)。第4篇為Sketch界面設(shè)計(jì),主要介紹Sketch的系統(tǒng)知識(shí)、簡單的時(shí)鐘案例、MBE風(fēng)格、網(wǎng)易云音樂實(shí)戰(zhàn)等內(nèi)容。第5篇為AE動(dòng)效設(shè)計(jì),主要介紹動(dòng)效設(shè)計(jì)基礎(chǔ)原則、天氣類、音樂播放器、健身行車類、注冊(cè)界面、計(jì)時(shí)類、支付類等APP動(dòng)效設(shè)計(jì)。第6篇為高手秘笈,主要介紹UI設(shè)計(jì)師的求職秘笈和UI設(shè)計(jì)的外包單報(bào)價(jià)秘笈等。第7篇,主要介紹項(xiàng)目實(shí)戰(zhàn)內(nèi)容。
本書不僅適合UI設(shè)計(jì)初級(jí)、中級(jí)用戶學(xué)習(xí),也可以作為各類院校相關(guān)專業(yè)學(xué)生和UI設(shè)計(jì)培訓(xùn)班學(xué)員的教材或輔導(dǎo)用書。
(1)針對(duì)性強(qiáng)。對(duì)于想從事UI設(shè)計(jì)工作的讀者大有裨益,全面講解UI、UE、UED與動(dòng)效方面的知識(shí)。
(2)實(shí)戰(zhàn)性強(qiáng)。綜合應(yīng)用PS AI AE Sketch軟件,對(duì)各種風(fēng)格的圖標(biāo)以及UI界面進(jìn)行了細(xì)致的講解。
(3)零基礎(chǔ)也可以學(xué)。沒有軟件基礎(chǔ)的讀者,可以先學(xué)習(xí)附贈(zèng)資源中的PS基礎(chǔ)技法課程。
(4)提升審美。除了講解UI設(shè)計(jì)本身,還對(duì)色彩及排版進(jìn)行了全面剖析,提升讀者的眼界,讓讀者在設(shè)計(jì)時(shí)能從容避開雷區(qū)。
顧領(lǐng)中,任職C課堂教育總監(jiān)一職,從事IT培訓(xùn),2014年入駐網(wǎng)易云課堂、教育、百度傳課,2015年創(chuàng)辦C課堂,同年入駐騰訊課堂、meia、優(yōu)酷課堂。主要設(shè)計(jì)包括:PS,店鋪裝修,平面設(shè)計(jì),網(wǎng)頁設(shè)計(jì),家裝設(shè)計(jì),影視后期,包裝設(shè)計(jì),VI設(shè)計(jì),logo設(shè)計(jì),設(shè)計(jì)理論等。
第1篇HelloUI
第1章初識(shí)UI設(shè)計(jì)
1.1UI行業(yè)前景分析
1.1.1UI設(shè)計(jì)師到底做些什么
1.1.2為何UI設(shè)計(jì)行業(yè)門檻越來越高
1.1.3UI行業(yè)發(fā)展前景
1.2開發(fā)流程App誕生記
1.3UI設(shè)計(jì)師的工作內(nèi)容
1.4各類設(shè)計(jì)的常用軟件
第2章UI設(shè)計(jì)師的自我修養(yǎng)
2.1認(rèn)識(shí)UE設(shè)計(jì)
2.2五大設(shè)計(jì)原則
2.3讓用戶擁有自主控制權(quán)
2.4狀態(tài)跟蹤
2.5設(shè)計(jì)規(guī)范
2.6簡化元素
2.7面試技巧
第2篇設(shè)計(jì)之道
第3章設(shè)計(jì)中的點(diǎn)、線、面
3.1平面構(gòu)成中的點(diǎn)究竟是怎樣的
3.2很多時(shí)候吸引眼球就靠點(diǎn)
3.3從蘋果公司廣告片分析點(diǎn)的氣質(zhì)
3.4再簡單也可以做創(chuàng)意
3.5點(diǎn)的固位性與凝聚性
3.6點(diǎn)元素在后期印刷中的作用
3.7平面構(gòu)成中線的特質(zhì)
3.8線元素的應(yīng)用
3.9對(duì)線元素進(jìn)行破壞組合
3.10利用線元素的延伸豐富結(jié)構(gòu)
3.11平面構(gòu)成中面的類型
3.12面的情感與表現(xiàn)力
第4章色彩的表達(dá)藝術(shù)
4.1色彩的三大屬性
4.2夠出彩才夠出色
4.3色彩數(shù)量
4.4色彩重量
4.5色彩群組
4.6色彩的可視性
第3篇圖標(biāo)設(shè)計(jì)
第5章PS圖標(biāo)設(shè)計(jì)小技巧
5.1動(dòng)作的使用
5.2繪制參考線的技巧
5.3像素對(duì)齊的重要性
5.4布爾運(yùn)算
5.4.1初識(shí)布爾運(yùn)算
5.4.2通過布爾運(yùn)算設(shè)計(jì)E-mail圖標(biāo)
5.4.3通過布爾運(yùn)算設(shè)計(jì)Camera圖標(biāo)
第6章iOS全系列圖標(biāo)
6.1我的第一個(gè)iOS圖標(biāo)FaceTime
6.2注意字體的使用日歷
6.3炫彩圖標(biāo)照片
6.4輕質(zhì)感圖標(biāo)相機(jī)
6.5換種思路做設(shè)計(jì)天氣
6.6早起早睡必備鬧鐘
6.7再也不擔(dān)心走丟了地圖
6.8喜歡看什么都行視頻
6.9畫畫、記事、拍照備忘錄
6.10你身邊的小秘書提醒事項(xiàng)
6.11曲曲折折疏疏密密股市
6.12我的游戲中心GameCenter
6.13醫(yī)生時(shí)刻在你身邊健康
6.14看似復(fù)雜,實(shí)則簡單iTunesStore
6.15耐心、細(xì)節(jié)、化簡AppStore
6.16其實(shí)真的很簡單設(shè)置
6.17常聯(lián)系、別忘記信息
6.18還是有些小技巧的郵件
6.19超贊瀏覽器Safari
6.20靜靜地聽會(huì)Music音樂
6.21團(tuán)隊(duì)需要協(xié)同工作命名規(guī)范
6.22規(guī)范文檔成品展示
第7章生活必備的App
7.1朋友圈就是全世界微信
7.2陪你到永遠(yuǎn)QQ
7.3每天刷夠100遍微博
7.4不止一面,大有看頭QQ瀏覽器
7.5方便每一個(gè)人的出行滴滴出行
7.6吃遍所有,買夠一條街餓了么
第8章視聽類App設(shè)計(jì)
8.1悅享品質(zhì)的視頻App愛奇藝
8.1.1悅享品質(zhì)的視頻App愛奇藝01
8.1.2悅享品質(zhì)的視頻App愛奇藝02
8.2不負(fù)好時(shí)光騰訊視頻
8.3音樂總有新玩法酷狗
8.4金曲撈QQ音樂
8.5這世界很酷優(yōu)酷
8.6量身定做的音樂播放器網(wǎng)易云音樂
第9章攝影類App圖標(biāo)設(shè)計(jì)
9.1瞬間提高顏值美顏相機(jī)
9.2我就是喜歡秀美圖秀秀
9.3越親密越有趣激萌
第10章質(zhì)感類圖標(biāo)設(shè)計(jì)
10.1巧用漸變色電梯按鈕
10.2圖層樣式使用技巧電話
10.3漸變疊加與形狀合并郵件
10.4超酷炫的安全App密碼鎖
第11章Dribbble設(shè)計(jì)風(fēng)格
11.1Dribbble餐飲風(fēng)格啤酒
11.1.1Dribbble餐飲風(fēng)格啤酒01
11.1.2Dribbble餐飲風(fēng)格啤酒02
11.2Dribbble餐具風(fēng)格烤箱
11.2.1Dribbble餐具風(fēng)格烤箱01
11.2.2Dribbble餐具風(fēng)格烤箱02
11.3Dribbble餐具風(fēng)格煎烤
11.3.1Dribbble餐具風(fēng)格煎烤01
11.3.2Dribbble餐具風(fēng)格煎烤02
11.4Dribbble閱讀風(fēng)格書籍
11.4.1Dribbble閱讀風(fēng)格書籍01
11.4.2Dribbble閱讀風(fēng)格書籍02
11.5Dribbble美食風(fēng)格披薩
11.5.1Dribbble美食風(fēng)格披薩01
11.5.2Dribbble美食風(fēng)格披薩02
第4篇Sketch界面設(shè)計(jì)
第12章Sketch系統(tǒng)知識(shí)介紹
12.1Sketch界面初識(shí)
12.2布爾運(yùn)算、編組、對(duì)齊與分布
12.3變換、混合模式、投影、內(nèi)陰影、輸出
12.4像素對(duì)齊、蒙版、創(chuàng)建輪廓、歷史記錄
12.5旋轉(zhuǎn)復(fù)制的技巧
12.6非規(guī)則形狀調(diào)整
12.7快速制作手機(jī)App的神奇秘密Craft
12.8B站界面案例實(shí)戰(zhàn)
12.9超級(jí)方便的標(biāo)注插件SketchMeasure
12.10更加高效的設(shè)計(jì)復(fù)用樣式
12.11快速修改設(shè)計(jì)風(fēng)格更改復(fù)用樣式
12.12嫌編組太麻煩怎么辦創(chuàng)建并編輯復(fù)用樣式
12.13靈活修改tabbar
12.14物理分辨率與邏輯分辨率
12.15一起打包多對(duì)象的命名與輸出
12.16千萬不要犯迷糊路徑詳解
12.17位圖的相關(guān)編輯技巧
12.18文字的編輯技巧
第13章簡單的時(shí)鐘案例
13.1基礎(chǔ)規(guī)范
13.2布爾運(yùn)算
13.3細(xì)節(jié)修飾
13.4路徑與復(fù)用樣式
13.5制作表盤刻度
13.6對(duì)齊與分布的相關(guān)技巧
13.7套用iOS10UIkit
第14章漂亮的MBE風(fēng)格
14.1風(fēng)格介紹與應(yīng)用
14.2虛線條的制作方法
14.3蒙版多層嵌套關(guān)系
14.4通過常用工具快速修飾細(xì)節(jié)
14.5臉部細(xì)節(jié)描繪
14.6繪制表情
14.7繪制身體
14.8繪制頭發(fā)
第15章網(wǎng)易云音樂項(xiàng)目實(shí)戰(zhàn)
15.1App界面的設(shè)計(jì)規(guī)范與顏色標(biāo)注
15.2頁面的制作過程
15.3導(dǎo)航欄與狀態(tài)欄的制作
15.4下方標(biāo)簽欄細(xì)節(jié)調(diào)整
15.5頂部標(biāo)簽欄的設(shè)計(jì)
15.6制作私人FM每日歌曲推薦云音樂熱歌榜等部分
15.7設(shè)置封面圖片
15.8Craft該用就用
15.9網(wǎng)易云音樂LOGO繪制
15.10快速制作icon
15.11復(fù)用樣式
15.12資源導(dǎo)出
第5篇AE動(dòng)效設(shè)計(jì)
第16章AE動(dòng)效設(shè)計(jì)基本原則
16.1先混個(gè)臉熟認(rèn)識(shí)AE界面
16.2旋轉(zhuǎn)跳躍我不停歇基本動(dòng)畫屬性
16.3就是不走尋常路緩動(dòng)
16.4你怎樣我就怎樣繼承關(guān)系
16.5對(duì)象關(guān)系和層次結(jié)構(gòu)偏移與延遲
16.6用好路徑是關(guān)鍵變形
16.7遮遮掩掩的藝術(shù)遮罩
16.8還有更多不錯(cuò)的選擇描邊動(dòng)畫
16.9既高清又容量小的秘密渲染
16.10那些不安分的參數(shù)數(shù)值變化
16.11看看有什么藏著掖著的覆蓋
16.12簡單的融合動(dòng)畫克隆
16.13實(shí)實(shí)虛虛、主次分明蒙層
16.14操作中的反饋視差
16.15連續(xù)感和位置感緯度
16.16開機(jī)動(dòng)畫怎樣看起來更酷移動(dòng)和縮放
第17章天氣類App動(dòng)效實(shí)戰(zhàn)
17.1AE軟件強(qiáng)大的繪制功能界面繪制
17.2AE軟件中的圖形組合技巧布爾運(yùn)算
17.3使用表達(dá)式實(shí)現(xiàn)循環(huán)播放loopout表達(dá)式
17.4有節(jié)奏地?fù)u頭晃腦wiggle表達(dá)式
17.5設(shè)計(jì)動(dòng)畫的片頭出場(chǎng)動(dòng)畫
17.6設(shè)置柔和曲線整體調(diào)整
第18章音樂播放器App動(dòng)效實(shí)戰(zhàn)
18.1結(jié)合外部素材圖片基本設(shè)置
18.23D切換動(dòng)畫基本3D
18.3添加時(shí)間變化特效編號(hào)
18.4軌道蒙版遮罩組合技巧效果整合
第19章健身行車類App動(dòng)效實(shí)戰(zhàn)
19.1命名是好的工作習(xí)慣基礎(chǔ)界面繪制
19.2結(jié)合AI完成高難度設(shè)計(jì)表盤繪制
19.3分析制作的思路原理講解
19.4來點(diǎn)有彈性的感覺基本形動(dòng)畫
19.5就是要變變變數(shù)值變化
19.6雙重嵌套的奧秘軌道蒙版
19.7超酷的線條動(dòng)畫插件3DStroke
19.8動(dòng)感線條的設(shè)計(jì)細(xì)節(jié)光線效果
第20章注冊(cè)界面動(dòng)效
20.1規(guī)范設(shè)計(jì)標(biāo)準(zhǔn)界面制作
20.2豐富設(shè)計(jì)場(chǎng)景界面設(shè)計(jì)
20.3模擬手指觸控效果觸感動(dòng)畫
20.4再復(fù)雜也難不住我信息交互
20.5調(diào)整畫面的緩動(dòng)文字緩動(dòng)
第21章計(jì)時(shí)類App動(dòng)效設(shè)計(jì)
21.1對(duì)齊與分布技巧滾屏效果
21.2一黑一白制作景深球面化效果
21.3形狀層動(dòng)畫效果開關(guān)按鈕
21.4不放過每一個(gè)瑕疵整體效果
第22章支付類App動(dòng)效設(shè)計(jì)
22.1繪制輪廓信用卡icon
22.2開始便已結(jié)束加載效果動(dòng)畫
22.3圖形變化效果遮罩與轉(zhuǎn)場(chǎng)
22.4精致的小按鈕動(dòng)畫按鈕確定
22.5無縫對(duì)接效果信息輸入框
22.6不透明度隨機(jī)變化光標(biāo)動(dòng)畫
22.7巧妙使用遮罩打字機(jī)動(dòng)畫
22.8鍵入文字提示效果鍵盤效果
第6篇高手秘籍
第23章UI設(shè)計(jì)師求職秘籍
23.1了解公司
23.2面試技巧
23.3簡歷制作
23.4項(xiàng)目資料準(zhǔn)備
第24章UI設(shè)計(jì)的外包單報(bào)價(jià)秘籍
24.1UI設(shè)計(jì)師的接單渠道
24.2UI設(shè)計(jì)師的外包報(bào)價(jià)