|
關(guān)于我們
 書單推薦 新書推薦 |
移動UI設計項目化實戰(zhàn)教程 
定 價：69 元
9 7 4 8 4 7 0 1 2 2 9 1 8 讀者對象:本書適合作為應用型本科院校、高職高專院校界面設計、平面設計等相關(guān)專業(yè)學生使用，也可以供相關(guān)技術(shù)人員參考。 
本書采用項目導向、任務驅(qū)動的模式進行編寫，突破了傳統(tǒng)的教學模式，在充分汲取本課程教學改革的成果及作者多年教學與實踐經(jīng)驗的基礎上，以案例教學和項目制作流程為課程導向，以移動UI設計的具體應用為學習目標，系統(tǒng)地介紹了移動UI設計的基本知識和設計技巧。 本書內(nèi)容由淺入深、通俗易懂、實例豐富、圖文并茂、直觀生動、可操作性強，較好地做到了理論與實踐的統(tǒng)一、內(nèi)容與形式的一致。本書內(nèi)容包括7個項目，分別為App界面設計概述、色彩在移動設備UI中的應用、移動UI中的常用元素設計、UI元素的組合應用、電商購物類App界面設計、《垃圾分類小能手》游戲界面設計、《病毒消消樂》游戲界面設計。在每個項目中以典型工作任務或?qū)嶋H產(chǎn)品開發(fā)為載體，介紹并應用移動UI設計的知識點，使學生掌握所需的基本理論和技能。 本書可以作為本科院校、高職高專院校中移動UI設計相關(guān)課程的教材，也可以作為廣大UI設計人員的參考用書。
趙峰，副教授，職業(yè)資格二級（技師），中國職業(yè)技術(shù)教育學會教學工作委員會會員。畢業(yè)于北京交通大學計算機科學與技術(shù)專業(yè)，現(xiàn)為廣東創(chuàng)新科技職業(yè)學院動漫制作技術(shù)專業(yè)帶頭人，在高校從教二十余年。參與或主持廳局級、學會級教育教學改革科研課題三項，在各級各類期刊發(fā)表教育教學改革論文15篇。研究成果在職教學會、高教學會評比中獲得一等獎8項、二等獎3項、三等獎5項。指導學生參加各級各類技能大賽，多次獲得優(yōu)秀指導教師稱號。參與編寫多部教材，申報實用新型專利1項。
項目1 App UI 設計概述 ...................................................................................................... 1
1.1 UI 設計的基本概念及分類 ................................................................................................. 1 1.1.1 UI 設計的基本概念 ......................................................................................................................... 1 1.1.2 UI 設計的分類 ................................................................................................................................. 1 1.2 App UI 設計的要素及布局方式 ......................................................................................... 4 1.2.1 App UI 設計的要素 ......................................................................................................................... 4 1.2.2 App UI 設計的布局方式 ............................................................................................................... 13 1.3 App UI 設計的流程 ........................................................................................................... 15 1.4 App UI 設計的原則 ........................................................................................................... 16 1.5 App UI 設計的尺寸標準 ................................................................................................... 17 1.5.1 設計尺寸標準和規(guī)范 .................................................................................................................... 17 1.5.2 平臺 ................................................................................................................................................ 17 1.5.3 單位尺寸 ........................................................................................................................................ 17 1.5.4 iOS 平臺的尺寸標準 ..................................................................................................................... 18 1.5.5 Android 平臺的尺寸標準 .............................................................................................................. 20 1.5.6 HarmonyOS 平臺的尺寸標準 ....................................................................................................... 20 1.6 常用的UI 設計工具 .......................................................................................................... 22 1.6.1 Adobe Photoshop ............................................................................................................................ 22 1.6.2 Adobe Illustrator ............................................................................................................................. 24 1.6.3 數(shù)位板 ............................................................................................................................................ 24 1.6.4 數(shù)碼相機 ........................................................................................................................................ 25 1.7 智能手機操作系統(tǒng)介紹 .................................................................................................... 26 1.7.1 HarmonyOS .................................................................................................................................... 26 1.7.2 iOS .................................................................................................................................................. 29 1.7.3 Android ........................................................................................................................................... 31 習 題 ......................................................................................................................................... 33 項目2 色彩在移動設備UI 中的應用.................................................................................. 34 2.1 色彩的基本知識 ................................................................................................................ 34 2.2 色彩的組成 ........................................................................................................................ 35 2.3 色彩的對比 ........................................................................................................................ 36 2.4 色彩的調(diào)和 ........................................................................................................................ 39 2.5 色調(diào)的變化 ........................................................................................................................ 42 2.6 移動端UI 色彩搭配的原則 .............................................................................................. 42 2.6.1 UI 三色搭配原則 ........................................................................................................................... 42 2.6.2 色彩搭配的注意事項 .................................................................................................................... 43 2.6.3 UI 設計的配色技巧 ....................................................................................................................... 43 習 題 ......................................................................................................................................... 44 項目3 移動UI 中的常用元素設計 ..................................................................................... 45 3.1 圖標概述 ............................................................................................................................ 45 3.1.1 圖標設計流程 ................................................................................................................................ 46 3.1.2 圖標設計原則 ................................................................................................................................ 46 3.2 任務1 創(chuàng)意線性圖標的設計 ........................................................................................... 49 3.2.1 任務描述 ........................................................................................................................................ 49 3.2.2 思路剖析 ........................................................................................................................................ 50 3.2.3 任務實現(xiàn) ........................................................................................................................................ 50 3.3 任務2 扁平化風格圖標的設計 ....................................................................................... 51 3.3.1 任務描述 ........................................................................................................................................ 52 3.3.2 思路剖析 ........................................................................................................................................ 52 3.3.3 任務實現(xiàn) ........................................................................................................................................ 52 3.4 任務3 MBE 風格圖標的設計 .......................................................................................... 53 3.4.1 任務描述 ........................................................................................................................................ 54 3.4.2 思路剖析 ........................................................................................................................................ 54 3.4.3 任務實現(xiàn) ........................................................................................................................................ 55 3.5 任務4 線性漸變圖標設計 ............................................................................................... 58 3.5.1 任務描述 ........................................................................................................................................ 58 3.5.2 思路剖析 ........................................................................................................................................ 58 3.5.3 任務實現(xiàn) ........................................................................................................................................ 59 習 題 ......................................................................................................................................... 66 項目4 UI 元素的組合應用 ................................................................................................. 68 4.1 任務1 首頁設計 ............................................................................................................... 68 4.1.1 任務描述 ........................................................................................................................................ 68 4.1.2 思路剖析 ........................................................................................................................................ 68 4.1.3 任務實現(xiàn) ........................................................................................................................................ 69 4.2 任務2 商品分類頁面設計 ............................................................................................... 73 4.2.1 任務描述 ........................................................................................................................................ 73 4.2.2 思路剖析 ........................................................................................................................................ 73 4.2.3 任務實現(xiàn) ........................................................................................................................................ 74 4.3 任務3 詳情頁設計 ............................................................................................................ 82 4.3.1 任務描述 ........................................................................................................................................ 82 4.3.2 思路剖析 ........................................................................................................................................ 82 4.3.3 任務實現(xiàn) ........................................................................................................................................ 82 4.4 任務4 個人中心頁面設計 ............................................................................................... 87 4.4.1 任務描述 ........................................................................................................................................ 87 4.4.2 思路剖析 ........................................................................................................................................ 88 4.4.3 任務實現(xiàn) ........................................................................................................................................ 88 習 題 ......................................................................................................................................... 97 項目5 電商購物類App UI 設計 ........................................................................................ 99 5.1 產(chǎn)品定位 ............................................................................................................................ 99 5.2 產(chǎn)品優(yōu)勢 ............................................................................................................................ 99 5.3 繪制草圖 .......................................................................................................................... 100 5.3.1 繪制《美食美刻》App 的草圖 ................................................................................................... 100 5.3.2 Axure RP ...................................................................................................................................... 100 5.4 繪制原型圖 ...................................................................................................................... 104 5.4.1 原型圖的作用 .............................................................................................................................. 105 5.4.2 原型圖的種類 .............................................................................................................................. 105 5.4.3 使用線框圖制作《美食美刻》App 的原型圖 ........................................................................... 105 5.5 設計風格、顏色定位及字體設置 .................................................................................. 108 5.5.1 設計風格 ...................................................................................................................................... 108 5.5.2 顏色定位 ...................................................................................................................................... 108 5.5.3 文字設置 ...................................................................................................................................... 108 5.6 啟動圖標 .......................................................................................................................... 109 5.6.1 啟動圖標的詳細分析 .................................................................................................................. 109 5.6.2 啟動圖標的參數(shù) .......................................................................................................................... 109 5.6.3 啟動圖標的制作過程 .................................................................................................................. 110 5.7 加載頁 .............................................................................................................................. 113 5.7.1 頁面詳細分析 .............................................................................................................................. 113 5.7.2 頁面參數(shù) ...................................................................................................................................... 114 5.7.3 頁面制作過程 .............................................................................................................................. 114 5.8 引導頁 .............................................................................................................................. 116 5.8.1 頁面詳細分析 .............................................................................................................................. 116 5.8.2 頁面參數(shù) ...................................................................................................................................... 116 5.8.3 頁面制作過程 .............................................................................................................................. 117 5.9 首頁 .................................................................................................................................. 118 5.9.1 頁面詳細分析 .............................................................................................................................. 118 5.9.2 頁面參數(shù) ...................................................................................................................................... 118 5.9.3 頁面制作過程 .............................................................................................................................. 119 5.10 “商城”頁 ........................................................................................................................ 128 5.10.1 頁面詳細分析 ............................................................................................................................ 129 5.10.2 頁面參數(shù) .................................................................................................................................... 129 5.10.3 頁面制作過程 ............................................................................................................................ 130 5.11 “美食分享”頁 ................................................................................................................. 147 5.11.1 頁面詳細分析 ............................................................................................................................ 147 5.11.2 頁面參數(shù) .................................................................................................................................... 148 5.11.3 頁面制作過程 ............................................................................................................................ 149 5.12 “訂單”頁 ........................................................................................................................... 173 5.12.1 頁面詳細分析 ............................................................................................................................ 173 5.12.2 頁面參數(shù) .................................................................................................................................... 174 5.12.3 頁面制作過程 ............................................................................................................................ 174 5.13 “我的”頁 ........................................................................................................................... 175 5.13.1 頁面詳細分析 ............................................................................................................................ 175 5.13.2 頁面參數(shù) .................................................................................................................................... 176 5.13.3 頁面制作過程 ............................................................................................................................ 177 5.14 案例小結(jié) ........................................................................................................................ 178 習 題 ....................................................................................................................................... 178 項目6 《垃圾分類小能手》游戲UI 設計 ........................................................................ 181 6.1 游戲定位 .......................................................................................................................... 181 6.2 繪制草圖 .......................................................................................................................... 181 6.2.1 啟動圖標草圖 .............................................................................................................................. 181 6.2.2 加載頁草圖 .................................................................................................................................. 182 6.2.3 注冊引導頁草圖 .......................................................................................................................... 182 6.2.4 首頁草圖 ...................................................................................................................................... 182 6.2.5 幫助頁面草圖 .............................................................................................................................. 183 6.2.6 游戲頁面草圖 .............................................................................................................................. 183 6.2.7 通關(guān)頁面草圖 .............................................................................................................................. 184 6.3 啟動圖標 .......................................................................................................................... 185 6.4 加載頁 .............................................................................................................................. 188 6.5 注冊引導頁 ...................................................................................................................... 190 6.6 首頁 .................................................................................................................................. 194 6.7 幫助頁面 .......................................................................................................................... 197 6.8 游戲頁面 .......................................................................................................................... 200 6.9 通關(guān)頁面 .......................................................................................................................... 203 6.10 案例小結(jié) ........................................................................................................................ 206 習 題 ....................................................................................................................................... 206 項目7 《病毒消消樂》游戲UI 設計 ................................................................................ 207 7.1 產(chǎn)品定位 .......................................................................................................................... 207 7.2 產(chǎn)品優(yōu)勢 .......................................................................................................................... 207 7.3 繪制草圖 .......................................................................................................................... 208 7.4 風格定位、色彩定位 ...................................................................................................... 209 7.4.1 風格定位 ...................................................................................................................................... 209 7.4.2 色彩定位 ...................................................................................................................................... 209 7.5 啟動圖標 .......................................................................................................................... 211 7.5.1 背景部分 ...................................................................................................................................... 212 7.5.2 點綴部分 ...................................................................................................................................... 213 7.5.3 主體部分 ...................................................................................................................................... 214 7.6 引導頁 .............................................................................................................................. 216 7.6.1 賽道 .............................................................................................................................................. 217 7.6.2 框架 .............................................................................................................................................. 219 7.6.3 引導圖標 ...................................................................................................................................... 222 7.6.4 其他小圖標 .................................................................................................................................. 224 7.7 主頁 .................................................................................................................................. 225 7.7.1 主頁點綴 ...................................................................................................................................... 226 7.7.2 主頁小圖標 .................................................................................................................................. 227 7.8 加載頁 .............................................................................................................................. 229 7.8.1 加載圖標 ...................................................................................................................................... 230 7.8.2 針管圖標 ...................................................................................................................................... 232 7.9 子頁面1 設計 .................................................................................................................. 233 7.9.1 歌曲介紹欄 .................................................................................................................................. 234 7.9.2 頂部小圖標 .................................................................................................................................. 236 7.10 子頁面2 設計 ................................................................................................................ 237 7.10.1 主體文案 .................................................................................................................................... 238 7.11 子頁面3 設計 ................................................................................................................ 241 7.11.1 內(nèi)部符號圖標 ............................................................................................................................ 242 7.12 案例小結(jié) ........................................................................................................................ 244 習 題 ....................................................................................................................................... 244
你還可能感興趣
我要評論
|
