微課學(xué)Adobe XD移動(dòng)UI設(shè)計(jì)
定 價(jià)：79.8 元
叢書名：清華電腦學(xué)堂
- 作者：高鵬
- 出版時(shí)間：2024/12/1
- ISBN：9787302697749
- 出 版 社：清華大學(xué)出版社
- 中圖法分類：TN929.53
- 頁(yè)碼：
- 紙張：膠版紙
- 版次：
- 開本：16開
《微課學(xué)AdobeXD移動(dòng)UI設(shè)計(jì)》以項(xiàng)目引入的方式講解，針對(duì)iOS系統(tǒng)和Android系統(tǒng)兩種移動(dòng)設(shè)備界面的結(jié)構(gòu)及設(shè)計(jì)規(guī)范進(jìn)行學(xué)習(xí)�！段⒄n學(xué)AdobeXD移動(dòng)UI設(shè)計(jì)》采用案例帶動(dòng)知識(shí)點(diǎn)的教學(xué)方式，將枯燥的知識(shí)點(diǎn)融入到豐富有趣的案例制作中，全面解析移動(dòng)端APP界面設(shè)計(jì)的流程及設(shè)計(jì)技巧。書中案例使用AdobeXD主流UI設(shè)計(jì)軟件制作。《微課學(xué)AdobeXD移動(dòng)UI設(shè)計(jì)》將提供全部案例的素材、源文件和教學(xué)視頻，讀者可以結(jié)合書、練習(xí)文件和教學(xué)視頻，提升移動(dòng)端APPUI界面設(shè)計(jì)的學(xué)習(xí)效率。
本書特色《微課學(xué)AdobeXD移動(dòng)UI設(shè)計(jì)》以豐富應(yīng)用案例為骨架，從iOS、Android到HarmonyOS系統(tǒng)的UI文件創(chuàng)建，從圖標(biāo)設(shè)計(jì)、頁(yè)面原型到交互動(dòng)效制作，手把手帶你掌握從需求分析到最終輸出的完整流程；輔以拓展案例，兼顧技能培養(yǎng)；每章配備選擇、判斷、創(chuàng)新題，助力鞏固知識(shí)、激發(fā)設(shè)計(jì)思維�！段⒄n學(xué)AdobeXD移動(dòng)UI設(shè)計(jì)》贈(zèng)送源文件、素材、教學(xué)視頻和PPT課件,讀者可以結(jié)合書、練習(xí)文件和教學(xué)視頻，提升移動(dòng)端APPUI界面設(shè)計(jì)的學(xué)習(xí)效率。讀者對(duì)象《微課學(xué)AdobeXD移動(dòng)UI設(shè)計(jì)》適合UI設(shè)計(jì)愛好者、App界面設(shè)計(jì)、移動(dòng)UI設(shè)計(jì)從業(yè)者閱讀，也適合作為各院校相關(guān)設(shè)計(jì)專業(yè)的參考教材。
前言
在科技不斷發(fā)展的今天，手機(jī)與大眾生活的聯(lián)系日益密切，其功能也越來(lái)越強(qiáng)大，而手機(jī)的軟件系統(tǒng)因其美觀實(shí)用、操作便捷為用戶所青睞，已成為用戶直接操作的主體，因此用戶界面設(shè)計(jì)的規(guī)范性就顯得尤為重要。
本書主要依據(jù)不同移動(dòng)系統(tǒng)的構(gòu)成元素，由淺入深地講解使用Adobe XD設(shè)計(jì)制作App產(chǎn)品UI的方法和技巧。本書結(jié)合第三方制作的實(shí)例進(jìn)行講解，詳細(xì)地介紹了制作步驟和軟件的應(yīng)用技巧，使讀者能輕松地學(xué)習(xí)并掌握。
本書章節(jié)及內(nèi)容安排
本書從實(shí)用的角度出發(fā)，全面、系統(tǒng)地講解了Adobe XD的各項(xiàng)功能和使用方法，書中內(nèi)容基本上涵蓋了Adobe XD的全部工具和重要功能，并運(yùn)用多個(gè)精彩實(shí)例貫穿于整個(gè)講解過(guò)程，操作一目了然，語(yǔ)言通俗易懂，適合讀者自學(xué)。
本書共分為7章，各章的主要內(nèi)容如下：
第1章，講解Adobe XD的基礎(chǔ)知識(shí)，包括移動(dòng)端UI設(shè)計(jì)基礎(chǔ)、移動(dòng)UI設(shè)計(jì)流程、移動(dòng)UI設(shè)計(jì)常用工具、關(guān)于Adobe XD、下載和安裝Adobe XD、Adobe XD的工作界面和Adobe XD的幫助資源等內(nèi)容。
第2章，講解Adobe XD的基本操作，包括使用主頁(yè)、新建文件、創(chuàng)建和管理畫板、打開文件、導(dǎo)入文件、存儲(chǔ)文件、獲取UI套件、撤銷與恢復(fù)操作，以及輔助工具等內(nèi)容。
第3章，講解Adobe XD創(chuàng)建與編輯對(duì)象的方法，包括創(chuàng)建對(duì)象、編輯對(duì)象、布爾運(yùn)算和為對(duì)象設(shè)置樣式等內(nèi)容。
第4章，主要講解Adobe XD設(shè)計(jì)制作產(chǎn)品原型的方法，包括創(chuàng)建文本、管理文本、形狀蒙版、重復(fù)網(wǎng)格、設(shè)置滾動(dòng)和設(shè)置版面等內(nèi)容。
第5章，講解使用Adobe XD設(shè)計(jì)制作產(chǎn)品UI的方法，包括創(chuàng)建庫(kù)資源、應(yīng)用庫(kù)資源、管理和編輯庫(kù)資源、使用圖層、效果和混合模式，以及使用3D變換進(jìn)行透視設(shè)計(jì)等內(nèi)容。
第6章，講解使用Adobe XD設(shè)置制作頁(yè)面交互的方法，包括添加交互、自動(dòng)制作動(dòng)畫、使用其他方式構(gòu)建交互、創(chuàng)建定時(shí)過(guò)渡、添加疊加、創(chuàng)建錨點(diǎn)鏈接和預(yù)覽UI設(shè)計(jì)等內(nèi)容。
第7章，講解輸出和標(biāo)注UI設(shè)計(jì)的方法，包括使用Adobe XD輸出設(shè)計(jì)資源、輸出iOS系統(tǒng)的UI設(shè)計(jì)、輸出Android系統(tǒng)的UI設(shè)計(jì)和標(biāo)注移動(dòng)App UI設(shè)計(jì)等內(nèi)容。
本書的知識(shí)結(jié)構(gòu)清晰、內(nèi)容有針對(duì)性、案例精美實(shí)用，隨書附贈(zèng)了書中所有案例的教學(xué)視頻、源文件和PPT課件，用于補(bǔ)充書中部分細(xì)節(jié)內(nèi)容，方便讀者學(xué)習(xí)和參考。讀者掃描下方二維碼，即可下載獲取。
由于編者水平和經(jīng)驗(yàn)有限，書中難免有不足之處，敬請(qǐng)讀者批評(píng)指正。
編者
高鵬從事相關(guān)設(shè)計(jì)工作多年，能夠獨(dú)立完成各類UI界面的設(shè)計(jì)與制作，同時(shí)熟悉廣告設(shè)計(jì)流程與印刷流程，對(duì)于色彩搭配有獨(dú)特的設(shè)計(jì)理念，具有較強(qiáng)的文檔及報(bào)告的編寫能力，熟練使用Axure，Photoshop；C4D；Illustrator；VISIO等相關(guān)軟件。熟悉短視頻開發(fā)與制作流程，并能熟練掌握各種短視頻拍攝與制作軟件。
目錄
第1章 了解Adobe XD
1.1 移動(dòng)端UI設(shè)計(jì)基礎(chǔ)
1.1.1?了解移動(dòng)UI設(shè)計(jì)
1.1.2?移動(dòng)端UI設(shè)計(jì)平臺(tái)
1.1.3?移動(dòng)端與PC端UI設(shè)計(jì)的區(qū)別
1.2 移動(dòng)UI設(shè)計(jì)流程
1.2.1?需求分析
1.2.2?交互設(shè)計(jì)
1.2.3?視覺界面設(shè)計(jì)
1.3 移動(dòng)UI設(shè)計(jì)常用工具
1.3.1?XMind和Axure RP
1.3.2?Photoshop和Sketch
1.3.3?Adobe XD和Figma
1.3.4?PxCook和Assistor PS
1.4 關(guān)于Adobe XD
1.4.1?Adobe XD簡(jiǎn)介
1.4.2?Adobe XD的特點(diǎn)
1.5 下載和安裝Adobe XD
1.5.1?下載Adobe XD
1.5.2?使用Creative Cloud Cleaner Tool
1.6 Adobe XD的工作界面
1.6.1?菜單欄
1.6.2?工具箱
1.6.3?模式欄
1.6.4?“屬性”面板
1.6.5?工作區(qū)域
1.7 Adobe XD的幫助資源
1.8 總結(jié)拓展
1.9 課后測(cè)試
第2章 Adobe XD的基本操作
2.1 使用主頁(yè)
2.2 新建文件
2.3 創(chuàng)建和管理畫板
2.3.1?創(chuàng)建新畫板
2.3.2?應(yīng)用案例——?jiǎng)?chuàng)建iOS系統(tǒng)App文件
2.3.3?使用現(xiàn)有畫板
2.3.4?管理畫板
2.3.5?應(yīng)用案例——?jiǎng)?chuàng)建Android系統(tǒng)App文件
2.4 打開文件
2.4.1?“打開”命令
2.4.2?從您的計(jì)算機(jī)中打開
2.4.3?最近打開文件
2.5 導(dǎo)入文件
2.5.1?“導(dǎo)入”命令
2.5.2?應(yīng)用案例——拖曳導(dǎo)入圖片素材
2.6 存儲(chǔ)文件
2.6.1?“保存”與“另存為”命令
2.6.2?存儲(chǔ)為本地文檔
2.6.3?重命名
2.6.4?應(yīng)用案例——保存HarmonyOS系統(tǒng)UI文件
2.7 獲取UI套件
2.8 撤銷與恢復(fù)操作
2.8.1?撤銷與重做
2.8.2?恢復(fù)文件
2.9 輔助工具
2.9.1?應(yīng)用案例——為iOS系統(tǒng)UI設(shè)計(jì)創(chuàng)建參考線
2.9.2?管理參考線
2.9.3?使用智能參考線
2.9.4?應(yīng)用網(wǎng)格定位對(duì)象
2.9.5?管理網(wǎng)格
2.10 總結(jié)拓展
2.11 課后測(cè)試
第3章 Adobe XD創(chuàng)建與編輯對(duì)象
3.1 創(chuàng)建對(duì)象
3.1.1?使用“矩形”工具
3.1.2?使用“橢圓”工具
3.1.3?使用“直線”工具
3.1.4?使用“多邊形”工具
3.1.5?使用“鋼筆”工具
3.1.6?應(yīng)用案例——設(shè)計(jì)制作標(biāo)簽欄圖標(biāo)
3.2 編輯對(duì)象
3.2.1?選擇和刪除對(duì)象
3.2.2?拷貝和粘貼對(duì)象
3.2.3?對(duì)齊和分布對(duì)象
3.2.4?排列對(duì)象
3.2.5?應(yīng)用案例——設(shè)計(jì)制作扁平風(fēng)格裝飾圖標(biāo)
3.2.6?調(diào)整和旋轉(zhuǎn)對(duì)象
3.2.7?編組和鎖定對(duì)象
3.2.8?應(yīng)用案例——繪制iOS系統(tǒng)的狀態(tài)欄圖標(biāo)
3.3 布爾運(yùn)算
3.3.1?添加
3.3.2?減去
3.3.3?交叉
3.3.4?排除重疊
3.3.5?應(yīng)用案例——繪制iOS系統(tǒng)Wi-Fi電池圖標(biāo)
3.4 為對(duì)象設(shè)置樣式
3.4.1?設(shè)置填充
3.4.2?設(shè)置邊界
3.4.3?設(shè)置內(nèi)陰影
3.4.4?設(shè)置投影
3.4.5?應(yīng)用案例——設(shè)計(jì)制作視頻App啟動(dòng)圖標(biāo)
3.5 總結(jié)拓展
3.6 課后測(cè)試
第4章 Adobe XD設(shè)計(jì)制作產(chǎn)品原型
4.1 創(chuàng)建文本
4.1.1?輸入文本
4.1.2?導(dǎo)入文本
4.2 管理文本
4.2.1?設(shè)置文本格式
4.2.2?設(shè)置文本變換
4.2.3?設(shè)置段落的寬高
4.2.4?應(yīng)用案例——設(shè)計(jì)制作購(gòu)物App原型上新部分
4.2.5?拼寫檢查
4.3 形狀蒙版
4.4 重復(fù)網(wǎng)格
4.4.1?創(chuàng)建重復(fù)網(wǎng)格
4.4.2?編輯重復(fù)網(wǎng)格
4.4.3?應(yīng)用案例——更新重復(fù)網(wǎng)格中的文本和圖片
4.5 設(shè)置滾動(dòng)
4.5.1?創(chuàng)建垂直滾動(dòng)
4.5.2?創(chuàng)建滾動(dòng)組
4.5.3?應(yīng)用案例——設(shè)計(jì)制作購(gòu)物App原型推薦部分
4.6 設(shè)置版面
4.6.1?使用響應(yīng)式調(diào)整大小
4.6.2?手動(dòng)編輯約束
4.6.3?應(yīng)用案例——調(diào)整頁(yè)面適配平板設(shè)備
4.7 總結(jié)拓展
4.8 課后測(cè)試
第5章 Adobe XD設(shè)計(jì)制作產(chǎn)品UI
5.1 創(chuàng)建庫(kù)資源
5.1.1?添加顏色資源
5.1.2?添加字符樣式資源
5.1.3?添加組件資源
5.1.4?應(yīng)用案例——?jiǎng)?chuàng)建iOS系統(tǒng)UI設(shè)計(jì)系統(tǒng)
5.1.5?添加視頻資源
5.2 應(yīng)用庫(kù)資源
5.2.1?應(yīng)用顏色資源
5.2.2?應(yīng)用組件資源
5.2.3?應(yīng)用案例——為App界面中的組件添加狀態(tài)
5.3 管理和編輯庫(kù)資源
5.3.1?管理庫(kù)資源
5.3.2?編輯庫(kù)資源
5.4 使用圖層
5.4.1?“圖層”面板
5.4.2?搜索圖層
5.4.3?管理圖層
5.4.4?應(yīng)用案例——設(shè)計(jì)制作茶道App市集頁(yè)面 UI
5.5 效果和混合模式
5.5.1?使用效果
5.5.2?應(yīng)用案例——為UI中的圖片添加內(nèi)陰影效果
5.5.3?使用混合效果
5.5.4?應(yīng)用案例——為App界面背景添加花紋
5.6 使用3D變換進(jìn)行透視設(shè)計(jì)
5.6.1?啟用3D變換
5.6.2?旋轉(zhuǎn)物體
5.6.3?應(yīng)用深度
5.7 總結(jié)拓展
5.8 課后測(cè)試
第6章 Adobe XD設(shè)計(jì)制作頁(yè)面交互
6.1 添加交互
6.1.1?設(shè)置主頁(yè)
6.1.2?建立鏈接
6.1.3?設(shè)置交互效果
6.1.4?鏈接上一個(gè)畫板
6.1.5?取消鏈接
6.1.6?應(yīng)用案例——設(shè)計(jì)制作App頁(yè)面交互動(dòng)畫
6.2 自動(dòng)制作動(dòng)畫
6.2.1?創(chuàng)建交互式動(dòng)畫
6.2.2?應(yīng)用案例——設(shè)計(jì)制作App頁(yè)面輪播交互效果
6.3 使用其他方式構(gòu)建交互
6.3.1?使用按鍵和游戲手柄創(chuàng)建交互
6.3.2?使用語(yǔ)音命令和語(yǔ)音播放創(chuàng)建交互
6.4 創(chuàng)建定時(shí)過(guò)渡
6.4.1?使用“時(shí)間”觸發(fā)條件創(chuàng)建交互
6.4.2?應(yīng)用案例——設(shè)計(jì)制作App加載進(jìn)度條動(dòng)效
6.5 添加疊加
6.5.1?使用“疊加”操作類型創(chuàng)建交互
6.5.2?應(yīng)用案例——設(shè)計(jì)制作App搜索界面的交互動(dòng)效
6.6 創(chuàng)建錨點(diǎn)鏈接
6.7 預(yù)覽UI設(shè)計(jì)
6.7.1?預(yù)覽交互動(dòng)效
6.7.2?預(yù)覽“語(yǔ)音”命令下的交互動(dòng)效
6.8 總結(jié)拓展
6.9 課后測(cè)試
第7章 輸出和標(biāo)注UI設(shè)計(jì)
7.1 使用Adobe XD輸出設(shè)計(jì)資源
7.1.1?導(dǎo)出切片資源
7.1.2?不同格式的切片資源
7.2 輸出iOS系統(tǒng)的UI設(shè)計(jì)
7.2.1?iOS系統(tǒng)向下和向上適配
7.2.2?適配切片命名規(guī)范
7.2.3?應(yīng)用案例——完成iOS系統(tǒng)UI界面的切片輸出
7.3 輸出Android系統(tǒng)的UI設(shè)計(jì)
7.3.1?Android系統(tǒng)中的“點(diǎn)9”切圖
7.3.2?適配輸出中的一稿兩用
7.3.3?應(yīng)用案例——完成Android系統(tǒng)UI界面的切片輸出
7.4 標(biāo)注移動(dòng)App UI設(shè)計(jì)
7.4.1?App界面標(biāo)注內(nèi)容
7.4.2?標(biāo)注的聲明文檔
7.4.3?UI設(shè)計(jì)的標(biāo)注規(guī)范
7.4.4?常用的標(biāo)注工具
7.5 總結(jié)拓展
7.6 課后測(cè)試
書單推薦
