中圖網小程序
一鍵登錄
更方便
本類五星書更多>
-
>
全國計算機等級考試最新真考題庫模擬考場及詳解·二級MSOffice高級應用
-
>
決戰行測5000題(言語理解與表達)
-
>
軟件性能測試.分析與調優實踐之路
-
>
第一行代碼Android
-
>
JAVA持續交付
-
>
EXCEL最強教科書(完全版)(全彩印刷)
-
>
深度學習
Photoshop+Illustrator+After Effects UI動效設計3合1 版權信息
- ISBN：9787115557735
- 條形碼：9787115557735 ; 978-7-115-55773-5
- 裝幀：一般膠版紙
- 冊數：暫無
- 重量：暫無
- 所屬分類：>
Photoshop+Illustrator+After Effects UI動效設計3合1 本書特色
PS、AI、AE軟件進行UI動效制作的教程； 案例涉及網頁端、手機端、Watch端等熱門經典案例； 學習UI動效設計，這一本就夠了，先用Illustrator制作UI中的矢量圖形元素，再使用Photoshop規劃界面布局和界面的制作，*后使用After Effects制作UI動效，詳細介紹了動效UI制作的完整流程與技巧。
Photoshop+Illustrator+After Effects UI動效設計3合1 內容簡介
本書是一本運用Photoshop、Illustrator和AfterEffects進行UI動效制作的教程。全書共8章，分為基礎部分和案例部分。基礎部分講解了UI動效設計的常用工具、色彩知識及常見組件，Photoshop的功能、基本操作及利用該軟件制作UI界面和元素的方法，Illustrator的功能、基本操作及利用該軟件繪制矢量圖標的方法，AfterEffects的功能、基本操作及利用該軟件將靜態的UI界面制作為動態效果的方法，網頁界面、手機界面和智能手表界面的UI設計規范；案例部分以網頁端、手機端及智能手表UI為例，介紹了網頁界面UI動效、手機界面UI動效及智能手表界面UI動效的設計與制作流程。
本書提供配套資源文件，包含本書實戰、練習和習題的素材文件、效果文件和操作演示視頻，供讀者在學習的過程中隨時調用。同時提供教師專享資源，包含配套PPT教學課件及教學大綱，供教師使用。
本書適合想要從事和已經從事UI設計行業相關工作的讀者閱讀，也適合UI設計、動效設計初學者學習，同時也適合UI培訓機構、相關專業學生使用。
Photoshop+Illustrator+After Effects UI動效設計3合1 目錄
目錄
第1章 初識UI動效設計
1．1 什么是UI動效設計 011
1．1．1 先說UI 011
1．1．2 再說“動效” 011
1．1．3 UI動效的應用領域 012
1．1．4 UI動效喜迎5G時代 013
1．2 UI設計師常用的軟件 013
1．2．1 Photoshop\ Illustrator 013
1．2．2 After Effects 014
1．2．3 1．2．4 其他 014
1．3 UI色彩設計 015
1．3．1 認識色彩 015
1．3．2 色彩基本知識 015
1．3．3 配色方式 016
1．4 UI常見組件 017
1．4．1 圖標 017
1．4．2 按鈕 017
1．4．3 導航 018
1．4．4 欄 018
第2章 UI入門之Photoshop
2．1 軟件的基本操作 020
2．1．1 新建文件 020
2．1．2 打開文件 020
2．1．3 置入文件 020
2．1．4 輔助工具 021
【練習 2-1】 使用標尺 021
【練習 2-2】 使用參考線 022
2．1．5 圖像變換與變形 022
【練習 2-3】 旋轉與縮放 023
【練習 2-4】 傾斜與扭曲 024
2．2 Photoshop工具組 024
2．2．1 選區工具組 024
【練習 2-5】 使用矩形選框工具創建矩形選區 025
【練習 2-6】 使用單列選框工具創建選區 026
2．2．2 形狀工具組 026
【練習 2-7】 使用多邊形工具繪制星形圖標 027
2．2．3 繪圖工具組 029
【練習 2-8】 使用畫筆工具繪制玩偶圖標 029
【練習 2-9】 使用漸變工具繪制按鈕 030
【練習 2-10】 用油漆桶工具為圖標填色 031
2．2．4 文字工具組 032
2．3 色調調整與濾鏡 032
2．3．1 色調調整 032
2．3．2 濾鏡 033
2．4 蒙版 034
2．4．1 矢量蒙版 034
【練習 2-11】 創建矢量蒙版 034
2．4．2 剪貼蒙版 035
【練習 2-12】 創建剪貼蒙版 035
2．4．3 圖層蒙版 036
【練習 2-13】 創建圖層蒙版 036
2．5 圖層混合模式與圖層樣式 037
2．5．1 圖層透明效果 037
2．5．2 圖層混合模式 037
2．5．3 圖層樣式 038
2．6 實戰：繪制太陽天氣圖標 040
2．7習題：制作手機App登錄界面 043
2．8習題：制作小程序游戲開始菜單界面 044
第3章 UI入門之Illustrator
3．1 文檔的基本操作 046
3．1．1 新建文檔 046
3．1．2 打開文檔 046
3．1．3 置入文檔 046
3．2 基本繪圖工具 047
3．2．1 簡單繪圖工具 047
延伸講解：直線段的調整 047
【練習 3-1】 繪制無線網絡圖標 048
3．2．2 幾何繪圖工具 048
【練習 3-2】 繪制保險箱圖標 048
【練習 3-3】 繪制分類圖標 049
【練習 3-4】 繪制笑臉表情 050
3．2．3 徒手繪圖工具 052
【練習 3-5】 繪制點贊圖標 052
3．2．4 鋼筆工具繪圖 053
【練習 3-6】 繪制氣象圖標 054
3．3 填色與文字 055
3．3．1 單色填充 055
3．3．2 漸變填充 056
3．3．3 漸變網格 056
【練習 3-7】 繪制漸變愛心圖標 056
3．3．4 文字工具 057
【練習 3-8】 完善保護傘圖標 057
3．4 編輯圖形對象 058
3．4．1 路徑編輯 058
3．4．2 變換對象 059
【練習 3-9】 繪制電量圖標 061
3．5 不透明度和混合模式 062
3．5．1 “透明度”面板 062
3．5．2 混合模式 063
3．6 實戰：制作登錄界面 063
3．7 習題：繪制火龍果圖標 066
3．8 習題：制作購物車界面 067
第4章 UI動效之After Effects
4．1 After Effects的基本操作 069
4．1．1 新建項目 069
4．1．2 新建合成 069
4．1．3 導入素材 069
4．2 圖層的基本操作 070
4．2．1 新建圖層 070
4．2．2 編輯圖層 070
4．2．3 圖層疊加模式 071
延伸講解：添加圖層樣式 071
【練習 4-1】 制作彈窗界面 071
4．2．4 常用圖層類型 072
4．3 層基礎動畫屬性 073
4．3．1 層列表 073
4．3．2 錨點 074
【練習 4-2】 改變圖標錨點位置 075
4．3．3 位置 075
【練習 4-3】 制作移動動畫 075
4．3．4 縮放 076
4．3．5 旋轉 077
【練習 4-4】 制作圖標旋轉動畫 077
4．3．6 不透明度 078
【練習 4-5】 制作啟動界面淡入動畫 078
4．4 蒙版與遮罩 079
4．4．1 創建蒙版的工具 079
延伸講解：形狀與蒙版的切換 080
4．4．2 蒙版屬性的修改 080
【練習 4-6】 制作文字掃光效果 081
4．5 關鍵幀和表達式 082
4．5．1 添加關鍵幀 082
4．5．2 查看關鍵幀 083
延伸講解：調整時間導航器和工作區 083
4．5．3 編輯關鍵幀 083
【練習 4-7】 制作圖標大小變化的動畫 084
4．5．4 關鍵幀輔助 085
延伸講解：對素材進行變速操作 086
4．5．5 圖表編輯器 086
【練習 4-8】 制作圖標緩動效果 086
4．5．6 基本表達式 087
延伸講解：設置關聯圖層 088
【練習 4-9】 齒輪轉動效果 088
4．6 實戰：制作表情按鈕動效 089
4．7 習題：制作加載動效 093
4．8 習題：彈出按鈕動畫 094
第5章 UI的設計規范
5．1 網頁界面設計 096
5．1．1 了解網頁界面 096
5．1．2 網頁界面的設計原則 096
5．1．3 網頁界面的構成元素 098
5．2 iOS手機界面設計 099
5．2．1 iOS操作系統概述 099
5．2．2 iOS手機界面主要設計元素 099
5．2．3 iOS手機界面設計規范 101
5．3 Android手機界面設計 103
5．3．1 Android操作系統概述 103
5．3．2 Android手機界面設計元素 103
5．3．3 Android設計特色 104
5．4 智能手表界面設計 106
5．4．1 iOS智能手表設計特點 106
5．4．2 Android智能手表設計特點 108
第6章 網頁端的UI動效設計
6．1 網頁切換動效 110
6．1．1 設計分析 110
6．1．2 實戰：Illustrator繪制指針和按鈕 111
6．1．3 實戰：Photoshop設計網頁切換界面 112
延伸講解：柵格化圖層 113
6．1．4 實戰：After Effects制作網頁切換動效 114
6．2 網頁滑動效果 126
6．2．1 設計分析 126
6．2．2 實戰：Illustrator繪制幾何圖形元素 126
延伸講解：調整圓角矩形半徑并指定大小 128
6．2．3 實戰：Photoshop設計網頁滑動界面 129
6．2．4 實戰：After Effects制作網頁滑動效果 132
6．3 網絡錯誤動效 139
6．3．1 設計分析 139
6．3．2 實戰：Illustrator繪制場景元素 140
6．3．3 實戰：Photoshop設計網絡錯誤界面 142
6．3．4 實戰：After Effects制作網絡錯誤動效 145
6．4 習題：網頁404動效 151
第7章 手機端的UI動效設計
7．1App登錄動效 153
7．1．1 設計分析 153
7．1．2實戰：Illustrator繪制App圖標 154
延伸講解：調整錨點 154
7．1．3 實戰：Photoshop設計App登錄界面 155
7．1．4 實戰：After Effects制作App登錄動效 159
7．2 主菜單上滑動效 167
7．2．1 設計分析 167
7．2．2 實戰：Illustrator繪制主菜單圖標 168
延伸講解：使用“添加錨點工具”制作斷點 169
7．2．3 實戰：Photoshop設計主菜單界面 172
延伸講解：將內容轉換為光柵圖像 173
7．2．4實戰：After Effects制作主菜單上滑動效 175
延伸講解：調整時間刻度的顯示 176
延伸講解：蒙版的運用 177
7．3 來電彈窗動效 181
7．3．1 設計分析 181
7．3．2 實戰：Illustrator繪制來電圖標 182
7．3．3 實戰：Photoshop設計來電彈窗 184
7．3．4 實戰：After Effects制作來電彈窗動效 186
7．4 習題：優惠券動效 194
第8章 智能手表的UI動效設計
8．1 iOS智能手表動效 196
8．1．1 設計分析 196
8．1．2 實戰：Illustrator繪制iOS智能手表圖標 197
8．1．3實戰：Photoshop設計iOS智能手表界面 198
8．1．4 實戰：After Effects制作 iOS智能手表動效 201
8．2 Android智能手表動效 208
8．2．1 設計分析 208
8．2．2 實戰： Illustrator繪制Android智能手表圖標 209
8．2．3 實戰：Photoshop設計Android智能手表界面 211
8．2．4 實戰：After Effects制作Android智能手表動效 213
8．3 習題：計時動效 216
附錄A Photoshop 2020常用快捷鍵 217
附錄B llustrator 2020常用快捷鍵 220
附錄C After Effects 2020常用快捷鍵 222
第1章 初識UI動效設計
1．1 什么是UI動效設計 011
1．1．1 先說UI 011
1．1．2 再說“動效” 011
1．1．3 UI動效的應用領域 012
1．1．4 UI動效喜迎5G時代 013
1．2 UI設計師常用的軟件 013
1．2．1 Photoshop\ Illustrator 013
1．2．2 After Effects 014
1．2．3 1．2．4 其他 014
1．3 UI色彩設計 015
1．3．1 認識色彩 015
1．3．2 色彩基本知識 015
1．3．3 配色方式 016
1．4 UI常見組件 017
1．4．1 圖標 017
1．4．2 按鈕 017
1．4．3 導航 018
1．4．4 欄 018
第2章 UI入門之Photoshop
2．1 軟件的基本操作 020
2．1．1 新建文件 020
2．1．2 打開文件 020
2．1．3 置入文件 020
2．1．4 輔助工具 021
【練習 2-1】 使用標尺 021
【練習 2-2】 使用參考線 022
2．1．5 圖像變換與變形 022
【練習 2-3】 旋轉與縮放 023
【練習 2-4】 傾斜與扭曲 024
2．2 Photoshop工具組 024
2．2．1 選區工具組 024
【練習 2-5】 使用矩形選框工具創建矩形選區 025
【練習 2-6】 使用單列選框工具創建選區 026
2．2．2 形狀工具組 026
【練習 2-7】 使用多邊形工具繪制星形圖標 027
2．2．3 繪圖工具組 029
【練習 2-8】 使用畫筆工具繪制玩偶圖標 029
【練習 2-9】 使用漸變工具繪制按鈕 030
【練習 2-10】 用油漆桶工具為圖標填色 031
2．2．4 文字工具組 032
2．3 色調調整與濾鏡 032
2．3．1 色調調整 032
2．3．2 濾鏡 033
2．4 蒙版 034
2．4．1 矢量蒙版 034
【練習 2-11】 創建矢量蒙版 034
2．4．2 剪貼蒙版 035
【練習 2-12】 創建剪貼蒙版 035
2．4．3 圖層蒙版 036
【練習 2-13】 創建圖層蒙版 036
2．5 圖層混合模式與圖層樣式 037
2．5．1 圖層透明效果 037
2．5．2 圖層混合模式 037
2．5．3 圖層樣式 038
2．6 實戰：繪制太陽天氣圖標 040
2．7習題：制作手機App登錄界面 043
2．8習題：制作小程序游戲開始菜單界面 044
第3章 UI入門之Illustrator
3．1 文檔的基本操作 046
3．1．1 新建文檔 046
3．1．2 打開文檔 046
3．1．3 置入文檔 046
3．2 基本繪圖工具 047
3．2．1 簡單繪圖工具 047
延伸講解：直線段的調整 047
【練習 3-1】 繪制無線網絡圖標 048
3．2．2 幾何繪圖工具 048
【練習 3-2】 繪制保險箱圖標 048
【練習 3-3】 繪制分類圖標 049
【練習 3-4】 繪制笑臉表情 050
3．2．3 徒手繪圖工具 052
【練習 3-5】 繪制點贊圖標 052
3．2．4 鋼筆工具繪圖 053
【練習 3-6】 繪制氣象圖標 054
3．3 填色與文字 055
3．3．1 單色填充 055
3．3．2 漸變填充 056
3．3．3 漸變網格 056
【練習 3-7】 繪制漸變愛心圖標 056
3．3．4 文字工具 057
【練習 3-8】 完善保護傘圖標 057
3．4 編輯圖形對象 058
3．4．1 路徑編輯 058
3．4．2 變換對象 059
【練習 3-9】 繪制電量圖標 061
3．5 不透明度和混合模式 062
3．5．1 “透明度”面板 062
3．5．2 混合模式 063
3．6 實戰：制作登錄界面 063
3．7 習題：繪制火龍果圖標 066
3．8 習題：制作購物車界面 067
第4章 UI動效之After Effects
4．1 After Effects的基本操作 069
4．1．1 新建項目 069
4．1．2 新建合成 069
4．1．3 導入素材 069
4．2 圖層的基本操作 070
4．2．1 新建圖層 070
4．2．2 編輯圖層 070
4．2．3 圖層疊加模式 071
延伸講解：添加圖層樣式 071
【練習 4-1】 制作彈窗界面 071
4．2．4 常用圖層類型 072
4．3 層基礎動畫屬性 073
4．3．1 層列表 073
4．3．2 錨點 074
【練習 4-2】 改變圖標錨點位置 075
4．3．3 位置 075
【練習 4-3】 制作移動動畫 075
4．3．4 縮放 076
4．3．5 旋轉 077
【練習 4-4】 制作圖標旋轉動畫 077
4．3．6 不透明度 078
【練習 4-5】 制作啟動界面淡入動畫 078
4．4 蒙版與遮罩 079
4．4．1 創建蒙版的工具 079
延伸講解：形狀與蒙版的切換 080
4．4．2 蒙版屬性的修改 080
【練習 4-6】 制作文字掃光效果 081
4．5 關鍵幀和表達式 082
4．5．1 添加關鍵幀 082
4．5．2 查看關鍵幀 083
延伸講解：調整時間導航器和工作區 083
4．5．3 編輯關鍵幀 083
【練習 4-7】 制作圖標大小變化的動畫 084
4．5．4 關鍵幀輔助 085
延伸講解：對素材進行變速操作 086
4．5．5 圖表編輯器 086
【練習 4-8】 制作圖標緩動效果 086
4．5．6 基本表達式 087
延伸講解：設置關聯圖層 088
【練習 4-9】 齒輪轉動效果 088
4．6 實戰：制作表情按鈕動效 089
4．7 習題：制作加載動效 093
4．8 習題：彈出按鈕動畫 094
第5章 UI的設計規范
5．1 網頁界面設計 096
5．1．1 了解網頁界面 096
5．1．2 網頁界面的設計原則 096
5．1．3 網頁界面的構成元素 098
5．2 iOS手機界面設計 099
5．2．1 iOS操作系統概述 099
5．2．2 iOS手機界面主要設計元素 099
5．2．3 iOS手機界面設計規范 101
5．3 Android手機界面設計 103
5．3．1 Android操作系統概述 103
5．3．2 Android手機界面設計元素 103
5．3．3 Android設計特色 104
5．4 智能手表界面設計 106
5．4．1 iOS智能手表設計特點 106
5．4．2 Android智能手表設計特點 108
第6章 網頁端的UI動效設計
6．1 網頁切換動效 110
6．1．1 設計分析 110
6．1．2 實戰：Illustrator繪制指針和按鈕 111
6．1．3 實戰：Photoshop設計網頁切換界面 112
延伸講解：柵格化圖層 113
6．1．4 實戰：After Effects制作網頁切換動效 114
6．2 網頁滑動效果 126
6．2．1 設計分析 126
6．2．2 實戰：Illustrator繪制幾何圖形元素 126
延伸講解：調整圓角矩形半徑并指定大小 128
6．2．3 實戰：Photoshop設計網頁滑動界面 129
6．2．4 實戰：After Effects制作網頁滑動效果 132
6．3 網絡錯誤動效 139
6．3．1 設計分析 139
6．3．2 實戰：Illustrator繪制場景元素 140
6．3．3 實戰：Photoshop設計網絡錯誤界面 142
6．3．4 實戰：After Effects制作網絡錯誤動效 145
6．4 習題：網頁404動效 151
第7章 手機端的UI動效設計
7．1App登錄動效 153
7．1．1 設計分析 153
7．1．2實戰：Illustrator繪制App圖標 154
延伸講解：調整錨點 154
7．1．3 實戰：Photoshop設計App登錄界面 155
7．1．4 實戰：After Effects制作App登錄動效 159
7．2 主菜單上滑動效 167
7．2．1 設計分析 167
7．2．2 實戰：Illustrator繪制主菜單圖標 168
延伸講解：使用“添加錨點工具”制作斷點 169
7．2．3 實戰：Photoshop設計主菜單界面 172
延伸講解：將內容轉換為光柵圖像 173
7．2．4實戰：After Effects制作主菜單上滑動效 175
延伸講解：調整時間刻度的顯示 176
延伸講解：蒙版的運用 177
7．3 來電彈窗動效 181
7．3．1 設計分析 181
7．3．2 實戰：Illustrator繪制來電圖標 182
7．3．3 實戰：Photoshop設計來電彈窗 184
7．3．4 實戰：After Effects制作來電彈窗動效 186
7．4 習題：優惠券動效 194
第8章 智能手表的UI動效設計
8．1 iOS智能手表動效 196
8．1．1 設計分析 196
8．1．2 實戰：Illustrator繪制iOS智能手表圖標 197
8．1．3實戰：Photoshop設計iOS智能手表界面 198
8．1．4 實戰：After Effects制作 iOS智能手表動效 201
8．2 Android智能手表動效 208
8．2．1 設計分析 208
8．2．2 實戰： Illustrator繪制Android智能手表圖標 209
8．2．3 實戰：Photoshop設計Android智能手表界面 211
8．2．4 實戰：After Effects制作Android智能手表動效 213
8．3 習題：計時動效 216
附錄A Photoshop 2020常用快捷鍵 217
附錄B llustrator 2020常用快捷鍵 220
附錄C After Effects 2020常用快捷鍵 222
展開全部
Photoshop+Illustrator+After Effects UI動效設計3合1 作者簡介
孫麗娜，畢業于北京印刷學院設計藝術學專業，藝術學碩士，目前主要從事數字媒體藝術領域的研究和教學。現任北京郵電大學世紀學院藝術與傳媒學院數字媒體藝術專業專職教師。其主要教授課程《網頁設計技術》《網頁交互動畫》《網絡項目設計實踐》等。曾編著圖書《網頁設計技術》，且參寫、參編著作、教材多部。曾獲選北京高校“優質本科課程”和“優質本科教材課件”優質本科課件。
書友推薦
- >
二體千字文
- >
經典常談
- >
莉莉和章魚
- >
推拿
- >
伊索寓言-世界文學名著典藏-全譯本
- >
中國人在烏蘇里邊疆區:歷史與人類學概述
- >
名家帶你讀魯迅:朝花夕拾
- >
朝聞道
本類暢銷
