Photoshop+AE UI動效設計從新手到高手

《Photoshop+AE UI動效設計從新手到高手》是2023年8月1日清華大學出版社出版的圖書，作者：高昌苗。

基本介紹

• 中文名：Photoshop+AE UI動效設計從新手到高手
• 作者：高昌苗
• 出版時間：2023年8月1日
• 出版社：清華大學出版社
• ISBN：9787302632269
• 定價：99 元
• 印次：1-1
• 印刷日期：2023.07.25

內容簡介

《Photoshop+AE UI動效設計從新手到高手》是一本以動畫製作理論、軟體使用基礎和UI實戰案例相結合，介紹如何使用Photoshop和After Effects軟體製作UI動效的實操案例圖書。全書共分9章內容：第1～5章介紹了使用Photoshop製作手機圖示、按鈕、界面等多類UI實戰案例；第6～9章介紹了使用After Effects軟體實現UI動效的技術。《Photoshop+AE UI動效設計從新手到高手》案例精選自作者參與的商業案例，內容極具實用性，另外隨書附贈了書中案例的素材、源檔案、高清視頻教程和PPT課件。

《Photoshop+AE UI動效設計從新手到高手》適合零基礎UI設計人員學習，即使之前並未接觸過Photoshop和After Effects軟體，通過《Photoshop+AE UI動效設計從新手到高手》的學習也可以輕鬆地掌握這兩款軟體的基本操作，實現酷炫的UI動效製作。

圖書目錄

目錄

第1章　UI動效設計概念

1.1?什麼是UI設計

1.2?UI設計的重要性

1.3?平面UI與手機UI的不同

1.4?動態圖形與UI動效

1.4.1?什麼是動態圖形

1.4.2?動態圖形的歷史

1.4.3?動態圖形的原理

1.4.4?什麼是UI動效

1.5?製作UI動效的軟體

1.5.1?Photoshop軟體

1.5.2?After Effects軟體

1.6?UI動效在產品設計中的重要性

1.6.1?UI動效善於展示軟體的特色

1.6.2?UI動效利於軟體的推廣

1.6.3?UI動效降低使用成本

1.7?UI動效的運動規律

1.7.1?UI動效概念

1.7.2?動效的持續時長和速度

1.7.3?動效的緩動

1.7.4?界面動效的編排

1.8?製作第一個UI動效

1.8.1?設計一個UI小圖示

1.8.2?圖示的UI動效製作

1.8.3?導出UI動畫

第2章　Photoshop編輯操作

2.1?Photoshop的工作界面

2.1.1?了解工作界面的工作組建

2.1.2?了解工具箱

2.1.3?了解選項欄

2.1.4?了解狀態欄

2.1.5?了解面板

2.2?圖示設計技巧和原則

2.3?跟大師設計一組圖示

2.3.1?準備工作

2.3.2?構思、草圖

2.3.3?輔助背景的製作

2.3.4?基本形、放大

2.3.5?創作過程

2.3.6?常用方法——變形

2.3.7?進階方法——改進

2.3.8?成品

2.3.9?形狀工具和選區的區別

2.4?對圖層的基本理解

2.5?路徑的運算方法

2.6?製作可回收資源圖示

2.7?製作簡訊圖示

2.8?製作照相機圖示

2.9?鋼筆工具的使用

2.10?認識錨點

第3章　UI圖示設計

3.1?Tumblr圖示的製作

3.1.1?製作基本形狀

3.1.2?繪製高光和陰影

3.1.3?表現圖示質感和立體感

3.2?工具箱圖示

3.2.1?製作基本形狀

3.2.2?製作工具箱的正面

3.2.3?製作工具箱的四邊

3.2.4?製作工具箱的四角

3.2.5?製作工具箱的鎖

3.2.6?製作工具箱的提手

3.2.7?製作工具箱的支角

3.3?條形碼圖形

3.3.1?製作條形碼的外形

3.3.2?添加陰影

3.3.3?繪製條形碼

3.3.4?繪製掃描條

3.4?工具圖形

3.4.1?製作工具錘的手柄

3.4.2?製作手柄的外觀

3.4.3?製作錘的底部與頂部

3.4.4?製作錘鉤

3.4.5?製作錘頭

3.4.6?製作扳手工具

第4章　Photoshop按鈕製作

4.1?簡單的水晶方按鈕

4.1.1?製作按鈕的外形

4.1.2?添加陰影和高光

4.2?音樂播放器按鈕

4.2.1?製作背景

4.2.2?製作播放器的外形

4.2.3?製作按鈕底部的背景

4.2.4?製作向前播放按鈕

4.2.5?繪製高光

4.2.6?製作向後播放按鈕

4.2.7?製作暫停按鈕

4.2.8?製作電源亮光

4.2.9?製作播放按鈕

4.3?日曆界面

4.3.1?製作日曆的背景

4.3.2?製作日曆界面

4.3.3?製作日期顯示框

4.3.4?輸入日期

4.3.5?製作翻閱按鈕

第5章　Photoshop輸入框和列表設計

5.1?搜尋界面輸入框

5.1.1?製作搜尋界面的背景

5.1.2?製作標題欄

5.1.3?製作按鈕

5.1.4?製作搜尋欄

5.1.5?製作選單欄

5.2?通知列表

5.2.1?製作通知列表的背景

5.2.2?添加高光

5.2.3?製作列表的內部

5.2.4?製作列表通知欄

5.2.5?製作圖示

第6章　After Effects動畫製作

6.1?了解AE

6.2?AE的工作界面

6.3?導入素材

6.3.1?導入單個素材

6.3.2?一次導入多個素材

6.3.3?導入資料夾

6.3.4?替換素材

6.4?創建合成

6.4.1?建立一個合成

6.4.2?用其他方式建立合成

6.5?時間線操作

6.5.1?時間線視窗和合成

6.5.2?時間的定位

6.6?AE的圖層操作

6.6.1?建立文字圖層

6.6.2?創建純色層

6.7?導出動畫

6.8?AE的關鍵幀操作

6.8.1?在時間線視窗中查看屬性

6.8.2?設定關鍵幀

6.8.3?移動關鍵幀

6.8.4?複製和貼上關鍵幀

6.8.5?修改關鍵幀

6.9?捆綁父子關係

6.10?製作透明度動畫

6.11?製作路徑動畫

6.12?動畫控制的插值運算

6.13?用AI製作路徑動畫

6.13.1?雙十二海報（在AI中分層）

6.13.2?在AE中製作矢量路徑動畫

6.14?製作信封UI動效動畫

6.14.1?製作信封和愛心

6.14.2?製作信封打開動畫

第7章　高級UI動效製作

7.1?理解表達式

7.1.1?表達式的添加

7.1.2?建立自己的第一個表達式

7.2?解讀表達式

7.2.1?錯誤提示

7.2.2?數組和表達式

7.2.3?程式變數和語句

7.3?常用的一些程式變數

7.3.1?Time（時間）表達式

7.3.2?Wiggle（擺動）表達式

7.3.3?將表達式動畫轉換成關鍵幀

7.3.4?用聲音來控制動畫

7.4?在AE中實現UI動效緩動

7.4.1?手機的UI動效製作

7.4.2?UI動效緩動曲線的調整

7.5?UI動效高級實踐

7.5.1?鬧鈴抖動UI動效的製作

7.5.2?圓形旋轉進度條UI動效的製作

第8章　UI字幕特效製作

8.1?創建文字圖層

8.1.1?創建一個文字圖層

8.1.2?用文字工具添加文字圖層

8.1.3?文字的豎排和橫排

8.2?創建文字動畫

8.2.1?車身文字動畫

8.2.2?文字特性動畫

8.2.3?選擇器的高級設定

8.2.4?文字動畫預設

第9章　動態圖形轉場動畫

9.1?認識轉場

9.2?快速模糊轉場

9.3?刷牆過渡轉場

9.4?條形轉場

9.5?卡片擦除轉場