-
>
東洋鏡:京華舊影
-
>
東洋鏡:嵩山少林寺舊影
-
>
東洋鏡:晚清雜觀
-
>
關(guān)中木雕
-
>
國博日歷2024年禮盒版
-
>
中國書法一本通
-
>
中國美術(shù)8000年
Photoshop+PxCook+Cutterman網(wǎng)頁UI設(shè)計教程 版權(quán)信息
- ISBN:9787121414329
- 條形碼:9787121414329 ; 978-7-121-41432-9
- 裝幀:一般膠版紙
- 冊數(shù):暫無
- 重量:暫無
- 所屬分類:>>
Photoshop+PxCook+Cutterman網(wǎng)頁UI設(shè)計教程 本書特色
適讀人群 :ui設(shè)計從業(yè)人員,學(xué)生為了增加讀者的學(xué)習(xí)渠道,增強讀者的學(xué)習(xí)興趣,本書配有配套資源包。在配套資源包中提供了本書所有實例的相關(guān)素材和源文件,以及書中所有實例的教學(xué)視頻,讀者可以跟隨本書提供的案例做出相應(yīng)的效果,并能夠快速應(yīng)用到實際工作中。
Photoshop+PxCook+Cutterman網(wǎng)頁UI設(shè)計教程 內(nèi)容簡介
本書主要講解了iOS系統(tǒng)和Android系統(tǒng)兩種移動設(shè)備系統(tǒng)界面的結(jié)構(gòu)及設(shè)計規(guī)范,全面解析了移動端App界面的設(shè)計流程及技巧。本書還介紹了如何使用Adobe XD、Photoshop、PxCook和Cutterman等主流軟件進行UI設(shè)計制作。 本書共6章。章主要講解移動UI設(shè)計基礎(chǔ);第2章主要講解iOS系統(tǒng)界面設(shè)計;第3章主要講解Android系統(tǒng)界面設(shè)計;第4章主要講解移動UI圖標(biāo)設(shè)計;第5章主要講解iOS系統(tǒng)界面應(yīng)用設(shè)計;第6章主要講解Android系統(tǒng)界面應(yīng)用設(shè)計。 本書將提供全部案例的素材、源文件和教學(xué)視頻,讀者可以結(jié)合書、練習(xí)文件和教學(xué)視頻,提升移動端App界面設(shè)計的學(xué)習(xí)效率。
Photoshop+PxCook+Cutterman網(wǎng)頁UI設(shè)計教程 目錄
第1章 網(wǎng)頁UI設(shè)計初體驗
1.1 初識網(wǎng)頁UI 1
1.2 網(wǎng)頁UI的分類 2
1.3 網(wǎng)頁UI設(shè)計的工作流程 5
1.3.1 網(wǎng)頁產(chǎn)品調(diào)研 5
1.3.2 網(wǎng)頁原型設(shè)計 6
1.3.3 設(shè)計網(wǎng)頁UI 7
1.3.4 網(wǎng)頁UI 標(biāo)注 8
1.3.5 網(wǎng)頁UI 切圖輸出 8
1.4 深刻理解網(wǎng)頁UI設(shè)計原則 8
1.4.1 視覺美觀 8
1.4.2 主題明確 9
1.4.3 內(nèi)容與形式相統(tǒng)一 10
1.4.4 整體性 11
1.4.5 快速加載 11
1.4.6 為用戶考慮 12
1.5 網(wǎng)頁UI的設(shè)計風(fēng)格 13
1.5.1 擬物化風(fēng)格 13
1.5.2 扁平化風(fēng)格 13
1.5.3 極簡化風(fēng)格 14
1.5.4 3D 風(fēng)格 14
1.5.5 插畫風(fēng)格 15
1.5.6 低多邊形風(fēng)格 15
1.5.7 無邊框風(fēng)格 15
1.5.8 縱向分割風(fēng)格 16
1.5.9 超級頭版風(fēng)格 17
1.6 設(shè)計網(wǎng)頁UI的常用工具 17
1.6.1 Axure RP 9 17
1.6.2 Photoshop 和Illustrator 18
1.6.3 Sketch 和Adobe XD 21
1.6.4 PxCook 和Cutterman 23
1.7 本章小結(jié) 24
第2章 合理的網(wǎng)頁版式與布局
2.1 了解網(wǎng)頁布局 25
2.1.1 網(wǎng)頁布局的目的 25
2.1.2 網(wǎng)頁布局的操作流程 26
2.2 網(wǎng)頁布局的基本方法 27
2.2.1 網(wǎng)頁的布局設(shè)計 27
2.2.2 網(wǎng)頁布局的原則 28
2.3 網(wǎng)頁布局的常見類型 29
2.3.1 國字型 30
2.3.2 拐角型 30
2.3.3 標(biāo)題正文型 31
2.3.4 左右框架型 31
2.3.5 上下框架型 31
2.3.6 封面型 32
2.3.7 變化型 33
2.4 根據(jù)內(nèi)容位置決定網(wǎng)頁布局方式 33
2.4.1 滿屏式網(wǎng)頁布局 33
2.4.2 一欄式網(wǎng)頁布局 34
實戰(zhàn)練習(xí)01——設(shè)計并制作白酒網(wǎng)頁35
2.4.3 兩欄式網(wǎng)頁布局 40
實戰(zhàn)練習(xí)02——布局啤酒網(wǎng)站 42
2.4.4 三欄式網(wǎng)頁布局 45
2.4.5 水平和垂直居中的網(wǎng)頁布局 47
2.5 頁面分割方向的布局方式 48
2.5.1 縱向分割 48
2.5.2 橫向分割 49
實戰(zhàn)練習(xí)03——布局家居網(wǎng)站 49
2.5.3 縱向與橫向復(fù)合型 52
2.5.4 運用固定區(qū)域的設(shè)計 53
2.6 網(wǎng)頁布局的特性 53
2.7 PC端與移動端網(wǎng)頁布局的區(qū)別 55
2.8 本章小結(jié) 56
第3章 奠定基礎(chǔ)的網(wǎng)頁構(gòu)成元素
3.1 網(wǎng)頁中的線條 57
3.1.1 點、線、面的關(guān)系 57
3.1.2 網(wǎng)頁中應(yīng)用的線條風(fēng)格 58
3.1.3 線條在網(wǎng)頁UI 中的作用 62
3.2 網(wǎng)頁中的標(biāo)志 66
3.2.1 網(wǎng)頁標(biāo)志的尺寸 66
3.2.2 網(wǎng)頁標(biāo)志的特點 66
3.2.3 網(wǎng)頁標(biāo)志的設(shè)計規(guī)范 67
實戰(zhàn)練習(xí)01——設(shè)計并制作網(wǎng)頁標(biāo)志69
3.2.4 網(wǎng)頁標(biāo)志的表現(xiàn)形式 71
3.3 網(wǎng)頁中的圖標(biāo)和按鈕 73
3.3.1 網(wǎng)頁圖標(biāo)的概念 73
3.3.2 網(wǎng)頁圖標(biāo)的設(shè)計原則 73
3.3.3 網(wǎng)頁圖標(biāo)的應(yīng)用 75
實戰(zhàn)練習(xí)02——設(shè)計并制作簡易圖標(biāo)76
3.3.4 網(wǎng)頁按鈕的概念 80
3.3.5 網(wǎng)頁按鈕的功能 80
3.3.6 設(shè)計出色的網(wǎng)頁按鈕 81
實戰(zhàn)練習(xí)03——設(shè)計并制作簡單的網(wǎng)頁元素 83
3.4 網(wǎng)頁中的導(dǎo)航 88
3.4.1 布局網(wǎng)頁導(dǎo)航 88
3.4.2 網(wǎng)頁導(dǎo)航的設(shè)計技巧 91
實戰(zhàn)練習(xí)04——設(shè)計并制作家居網(wǎng)頁的主體廣告和導(dǎo)航 92
3.5 網(wǎng)頁中的文字 96
3.5.1 網(wǎng)頁中的文字設(shè)置 96
3.5.2 網(wǎng)頁文字的設(shè)計原則 100
3.5.3 網(wǎng)頁文字的排版規(guī)則 100
3.6 網(wǎng)頁中的圖片 103
3.6.1 網(wǎng)頁中的圖片設(shè)置 103
3.6.2 網(wǎng)頁圖片的應(yīng)用 104
3.7 網(wǎng)頁中的富媒體106
3.8 本章小結(jié) 106
第4章 美觀的網(wǎng)頁配色
4.1 配色的基礎(chǔ)107
4.1.1 色彩的概念 107
4.1.2 色彩的三要素 107
4.1.3 顏色模式 110
4.1.4 十六進制顏色碼 111
4.2 網(wǎng)頁配色的基本要素 112
4.2.1 網(wǎng)頁的主題色 112
實戰(zhàn)練習(xí)01——設(shè)計并制作家具網(wǎng)站的登錄頁面 113
4.2.2 網(wǎng)頁的背景色 115
4.2.3 網(wǎng)頁的輔助色 116
4.2.4 網(wǎng)頁的文本色 117
4.2.5 網(wǎng)頁的強調(diào)色 117
4.3 網(wǎng)頁元素的色彩搭配 118
4.3.1 網(wǎng)頁標(biāo)志與廣告 118
4.3.2 網(wǎng)頁導(dǎo)航 118
實戰(zhàn)練習(xí)02——設(shè)計并制作圖片資源網(wǎng)頁 118
4.3.3 背景色與文字 120
4.3.4 鏈接文字 121
4.4 根據(jù)色調(diào)進行網(wǎng)頁配色122
4.5 利用色彩對比進行網(wǎng)頁配色 123
4.5.1 色彩的冷暖對比 123
4.5.2 色彩的大小對比 124
4.5.3 色彩的色相對比 124
4.6 網(wǎng)頁中的配色技巧 128
4.6.1 突出網(wǎng)頁主題 128
實戰(zhàn)練習(xí)03——設(shè)計并制作咖啡網(wǎng)頁 131
4.6.2 融合整體配色 132
4.7 本章小結(jié) 134
第5章 iOS系統(tǒng)UI設(shè)計
5.1 iOS系統(tǒng)簡介135
5.2 iOS系統(tǒng)的元素設(shè)計 136
5.2.1 尺寸單位 136
5.2.2 尺寸大小 137
5.2.3 組件尺寸 138
5.2.4 圖標(biāo) 138
5.3 iOS系統(tǒng)的邊距和間距設(shè)計140
5.3.1 全局邊距 140
實戰(zhàn)練習(xí)01——設(shè)計并制作運動App 的主頁 141
5.3.2 卡片間距 143
5.3.3 內(nèi)容間距 144
5.4 iOS系統(tǒng)的文字設(shè)計 146
5.4.1 字體 146
5.4.2 字號與字重 146
實戰(zhàn)練習(xí)02——設(shè)計并制作旅游App 的“我的”界面 147
5.5 iOS系統(tǒng)的圖片設(shè)計 151
5.5.1 圖片的比例 151
5.5.2 圖片的格式 152
5.6 iOS系統(tǒng)的網(wǎng)頁布局 153
5.6.1 列表式布局 153
5.6.2 陳列館式布局 153
5.6.3 宮格式布局 154
5.6.4 卡片式布局 154
5.7 iOS系統(tǒng)UI的設(shè)計原則 155
5.7.1 親密性 155
5.7.2 對齊、對比和重復(fù) 156
5.7.3 直截了當(dāng) 158
5.7.4 提供邀請 160
5.8 本章小結(jié) 162
第6章 Android系統(tǒng)UI設(shè)計
6.1 Android系統(tǒng)簡介 163
6.2 Android系統(tǒng)的元素設(shè)計 163
6.2.1 設(shè)計單位 164
6.2.2 界面尺寸 165
6.2.3 組件尺寸 165
實戰(zhàn)練習(xí)01——設(shè)計并制作App 的登錄界面166
6.3 Android系統(tǒng)的文字設(shè)計 168
6.3.1 字體和字重 168
6.3.2 字號 169
6.4 Android系統(tǒng)的圖標(biāo)設(shè)計 170
6.4.1 啟動圖標(biāo) 170
6.4.2 標(biāo)簽欄/ 系統(tǒng)通知圖標(biāo)170
6.4.3 上下文圖標(biāo) 171
6.4.4 圖標(biāo)尺寸 171
實戰(zhàn)練習(xí)02——設(shè)計并制作App 界面中的上下文圖標(biāo) 172
6.5 Android系統(tǒng)UI的設(shè)計原則 174
6.5.1 一步到位 174
6.5.2 即時反應(yīng) 177
6.5.3 簡化交互 179
實戰(zhàn)練習(xí)03——設(shè)計并制作Android 系統(tǒng)App“我的”界面181
6.6 本章小結(jié) 184
第7章 適配輸出網(wǎng)頁UI設(shè)計
7.1 PC端網(wǎng)頁的適配輸出185
7.1.1 PC 端的適配方法 185
7.1.2 適配時需要注意的點 185
7.2 iOS系統(tǒng)界面的適配輸出 186
7.2.1 界面標(biāo)注 186
7.2.2 標(biāo)注工具——PxCook188
實戰(zhàn)練習(xí)01——標(biāo)注iOS 系統(tǒng)App 界面191
7.2.3 適配輸出 193
7.3 Android系統(tǒng)界面的適配輸出195
7.3.1 界面標(biāo)注 195
7.3.2 適配輸出 196
7.3.3 .9 切圖法 198
7.3.4 輸出工具——Cutterman 插件201
實戰(zhàn)練習(xí)02——輸出Android 系統(tǒng)的App 界面 201
7.4 本章小結(jié) 203
第8章 綜合案例
8.1 設(shè)計PC端的家居網(wǎng)頁204
8.1.1 家居網(wǎng)頁案例分析 204
8.1.2 家居網(wǎng)頁色彩分析 205
8.1.3 家居網(wǎng)頁制作步驟 206
8.2 設(shè)計iOS系統(tǒng)的旅游App界面 209
8.2.1 旅游App 界面案例分析209
8.2.2 旅游App 界面色彩分析210
8.2.3 旅游App 界面制作步驟211
8.3 設(shè)計Android系統(tǒng)的家居App界面215
8.3.1 家居App 界面案例分析215
8.3.2 家居App 界面色彩分析217
8.3.3 家居App 界面制作步驟218
8.4 本章小結(jié) 222
Photoshop+PxCook+Cutterman網(wǎng)頁UI設(shè)計教程 作者簡介
李曉斌,多年視頻剪輯與特效制作工作背景與設(shè)計經(jīng)驗,精通視頻講解與特效相關(guān)軟件,熟練掌握After Effect軟件的各項功能與操作技巧,能夠完成視頻特效的添加與優(yōu)化。優(yōu)秀的團隊合作精神,對工作認(rèn)真負(fù)責(zé),積極主動,思維嚴(yán)謹(jǐn),具有較高的技術(shù)水平和豐富的工作經(jīng)驗。曾出版多本相關(guān)教材,參與多所院校的視頻剪輯的培訓(xùn)工作。
- >
史學(xué)評論
- >
自卑與超越
- >
巴金-再思錄
- >
小考拉的故事-套裝共3冊
- >
中國人在烏蘇里邊疆區(qū):歷史與人類學(xué)概述
- >
回憶愛瑪儂
- >
上帝之肋:男人的真實旅程
- >
山海經(jīng)
-
平面設(shè)計中的網(wǎng)格系統(tǒng)(平面設(shè)計字體排印和空間設(shè)計的視覺傳達(dá)設(shè)計手冊經(jīng)典版)(精)/設(shè)計新經(jīng)典
(瑞士)約瑟夫·米勒-布羅克曼¥93.2¥148