新印象——中文版Sketch圖標與UI界面設計實例教程
陳曉歷
- 出版商: 人民郵電
- 出版日期: 2020-07-01
- 定價: $354
- 售價: 8.5 折 $301
- 語言: 簡體中文
- 裝訂: 平裝
- ISBN: 7115522227
- ISBN-13: 9787115522221
-
相關分類:
SketchUp、交互設計 Interaction-design
立即出貨 (庫存 < 4)
買這商品的人也買了...
-
$520$442 -
$520$411 -
$500精通 Android UI 設計
-
$301App 後台開發運維和架構實踐
-
$356APP UI 設計手冊
-
$620$558 -
$505單片機 C語言程序設計實訓 100例 — 基於 Arduino + Proteus 模擬
-
$474$450 -
$556Adobe XD CC 2019 經典教程 (彩色版)
-
$414$393 -
$301打造流暢的 Android App
-
$414$393
相關主題
商品描述
這是一本講解Sketch圖標與UI界面設計的實例教程。
全書根據日常生活中移動App界面的常見功能,分類講解UI圖標與界面設計的技巧與方法。
全書共6章,以案例的形式分別講解了圖標設計、引導頁設計、主頁設計、
圖表頁設計、個人中心頁設計及登錄頁設計。
針對圖標的設計,分為線性圖標、扁平圖標和擬物圖標的繪製;針對界面的設計,
分為插畫類型的引導頁、不同功能的主頁、色感強烈的圖表頁、
不同形式的個人中心頁及不同風格的登錄頁的製作。
本書實戰案例均配有拓展練習,同時提供了案例設計源文件及一套獨立視頻課程,
目的是幫助UI設計學習者了解和掌握UI設計的規範、配色思路及具體的設計方法,
同時使有一定UI設計經驗的人得到提升。
本書適合UI設計初學者、有一定設計經驗的UI設計師和交互設計師閱讀。
作者簡介
陳曉歷(Kiki)
曾參與《爸爸去哪兒》《宮爆老奶奶》手游UI項目設計,
以及《火影疾風壇》網頁遊戲項目設計。曾負責“星巴克”小程序設計項目。
搜狗簽約皮膚設計師,作品多次被UI中國首頁推薦。
目錄大綱
目錄:
第1章圖標設計017
1.1實戰:繪製一套日記App的線性圖標018
1.1.1繪製“私信”圖標018
1.1.2繪製“定位”圖標020
1.1.3繪製“相機”圖標020
1.1.4繪製“分享”圖標022
1.1.5繪製“對話”圖標023
1.1.6繪製“心”圖標024
1.1.7繪製“個人”圖標026
1.1.8繪製“支付”圖標026
1.1.9繪製“鬧鐘”圖標027
1.1.10繪製“Wi-Fi”圖標028
1.1.11繪製“點贊”圖標029
1.1.12繪製“圖片”圖標031
1.1.13繪製“購物車”圖標032
1.1.14繪製“刪除”圖標033
1.1.15繪製“設置”圖標035
1.1.16繪製“手機”圖標036
1.1.17繪製“放大鏡”圖標037
1.1.18繪製“天氣”圖標038
1.1.19繪製“鎖”圖標039
1.1.20繪製“包”圖標040
拓展練習:繪製一套線性圖標041
1.2實戰:繪製一套社交App的扁平圖標042
1.2.1繪製“相機”圖標042
1.2. 2繪製“旋轉”圖標045
1.2.3繪製“圓形”圖標047
1.2.4繪製“聊天”圖標048
1.2.5繪製“閃電”圖標049
1.2.6繪製“多色氣泡”圖標050
拓展練習:繪製一個扁平化圖標052
1.3實戰:繪製一套工具類型的擬物圖標053
1.3.1繪製“鐘錶盤”圖標054
1.3.2繪製“按鈕”圖標058
1.3.3繪製“漸變色開關”圖標062
1.3. 4繪製“相機”圖標067
拓展練習:繪製一個擬物圖標078
第2章引導頁設計079
2.1實戰:“心溝通”引導頁的製作080
2.1.1繪製背景080
2.1.2繪製圖形裝飾背景080
2.1 .3繪製心形圖案081
2.1.4添加文字082
2.1.5繪製翻頁元素082
2.1.6製作立體效果083
拓展練習:繪製一個以實物圖為背景的引導頁083
2.2實戰:“愛護鯨魚”引導頁的製作084
2.2.1繪製背景084
2.2.2繪製鯨魚087
2.2.3繪製橋頭089
2.2.4繪製小女孩091
2.2.5添加倒影092
2.2.6添加文字和斜線093
2.2.7製作立體效果093
拓展練習:繪製一個“鯨魚”主題的引導頁093
2.3實戰:“海上日出”引導頁的製作094
2.3 .1繪製波浪094
2.3.2繪製太陽098
2.3.3繪製浪花099
2.3.4添加文字100
2.3.5製作立體效果100
拓展練習:繪製一個與案例同類型的引導頁100
2.4實戰: “萌胖減重”引導頁的製作101
2.4.1繪製海浪101
2.4.2繪製救生圈103
2.4.3繪製卡通人物104
2.4.4添加小黃鴨106
2.4.5添加文本107
2.4.6製作立體效果108
拓展練習:繪製一個“中秋賞月”主題的引導頁108
第3章主頁設計109
3.1實戰:相機主頁的製作110
3.1.1繪製背景110
3.1.2繪製操作欄圖標111
3.1.3製作立體效果112
拓展練習:繪製一個黑色效果的相機主頁112
3.2實戰:酷炫音樂播放器主頁的製作113
3.2.1繪製背景113
3.2.2編輯圖片113
3.2.3繪製狀態欄和操作欄的圖標114
3.2.4繪製播放器115
3.2.5製作立體效果117
拓展練習:繪製一個紫色炫酷類型的播放器主頁117
3.3實戰:音樂播放器主頁的製作118
3.3.1繪製背景118
3.3.2編輯圖片118
3.3.3繪製頂部操作欄119
3.3.4繪製播放器120
3.3.5製作立體效果121
拓展練習:繪製一個極簡風格的播放器主頁121
3.4實戰:微故事主頁的製作122
3.4.1繪製背景122
3.4.2繪製標題122
3.4.3繪製卡片123
3.4.4製作立體效果124
拓展練習:繪製一個卡片類型的電影App主頁124
3.5實戰:推薦文章主頁的製作125
3.5.1繪製背景125
3.5.2繪製頁邊125
3.5.3繪製狀態欄126
3.5.4繪製底部操作欄126
3.5 .5添加正文126
3.5.6製作立體效果128
拓展練習:繪製一個圖文混排的好文章分享App主頁128
3.6實戰:直播App主頁的製作129
3.6.1繪製背景129
3.6.2繪製操作欄圖標129
3.6.3製作立體效果132
拓展練習:繪製一個漸變效果的視頻剪輯App主頁132
第4章圖表頁設計133
4.1實戰:簡約水波圖表頁的製作134
4.1.1繪製背景134
4.1.2繪製頂部水紋134
4.1.3繪製定界框並放入圖標136
4.1.4繪製圓圈部分圖標136
4.1.5添加文本138
4.1.6繪製底部列表139
4.1.7完善細節140
4.1.8製作立體效果141
拓展練習:繪製一個漸變發光效果的數據圖表頁141
4.2實戰:漸變互動指數圖表頁的製作142
4.2.1繪製背景142
4.2.2繪製定界框143
4.2.3添加文本143
4.2.4繪製指數圖部分144
4.2.5製作立體效果145
拓展練習:繪製一個藍紫色的圖表頁145
4.3實戰:漸變活力評分圖表頁的製作146
4.3.1繪製背景146
4.3.2繪製操作欄148
4.3.3繪製圓環部分148
4.3.4繪製卡片部分149
4.3.5製作立體效果153
拓展練習:繪製一個極簡風格的圖表頁153
4.4實戰:漸變業績圖表頁的製作154
4.4.1繪製背景154
4.4.2繪製狀態欄154
4.4.3繪製卡片部分155
4.4.4繪製列表156
4.4.5製作立體效果158
拓展練習:繪製一個卡片樣式的圖表頁158
第5章個人中心頁設計159
5.1實戰:居中形式的個人中心頁製作160
5.1.1繪製背景160
5.1.2繪製定界框160
5.1.3繪製用戶信息161
5.1.4添加圖標162
5.1.5添加數據信息162
5.1.6添加底部圖片163
5.1.7製作立體效果164
拓展練習:繪製一個居中形式的個人中心頁164
5.2實戰:側邊形式的個人中心頁製作165
5.2.1繪製背景165
5.2.2繪製定界框165
5.2.3添加用戶頭像166
5.2.4添加文本166
5.2.5製作立體效果167
拓展練習:繪製一個側邊欄樣式的個人中心頁167
5.3實戰:斜邊形式的個人中心頁製作168
5.3.1繪製背景168
5.3.2繪製定界框169
5.3.3繪製圖標170
5.3.4添加用戶信息170
5.3.5繪製列表171
5.3.6添加按鈕172
5.3.7製作立體效果173
拓展練習:繪製一個左對齊形式的個人中心頁173
5.4實戰:中心展示類的個人中心頁製作174
5.4.1製作用戶信息174
5.4.2製作列表信息175
5.4.3繪製“提示”按鈕175
5.4.4繪製“關閉”按鈕176
5.4.5製作立體效果176
拓展練習:繪製一個中心展示形式的個人中心頁176
第6章登錄頁設計177
6.1實戰:時尚不規則卡片登錄頁的製作178
6.1. 1繪製背景178
6.1.2繪製卡片179
6.1.3繪製定界框179
6.1.4添加登錄信息180
6.1.5添加細節180
6.1.6製作立體效果181
拓展練習:繪製一個極簡登錄頁181
6.2實戰:極簡風格登錄頁的製作182
6.2.1繪製背景182
6.2.2添加導航欄信息182
6.2.3繪製頭像183
6.2.4繪製“相機”圖標183
6.2.5繪製列表184
6.2.6繪製按鈕184
6.2.7製作立體效果185
拓展練習:繪製一個極簡風格的卡片登錄頁185
6.3實戰:透氣建築風格登錄頁的製作186
6.3.1繪製背景186
6.3.2繪製定界框188
6.3.3添加裝飾色塊188
6.3.4添加登錄信息188
6.3.5添加按鈕188
6.3.6製作立體效果189
拓展練習:繪製一個建築風格的登錄頁189
6.4實戰:漸變小彈框登錄頁的製作190
6.4.1繪製背景190
6.4.2繪製卡片190
6.4. 3添加文本191
6.4.4製作立體效果192
拓展練習:繪製一個卡片類型的登錄頁192