Photoshop智能手機APP界面設計實戰

Part 1 UI設計概念

Chapter 1 智能手機APP界面設計概述
1.1 APP界面的應用基礎
1.1.1 智能手機與APP客戶端
1.1.2 智能手機的操作系統有哪些
1.1.3 智能手機APP布局說明
1.1.4 APP界面的分類
1.2 手機UI設計的基本概念
1.2.1 什麼是UI設計
1.2.2 UI設計的重要性
1.2.3 平面UI與手機UI的不同
1.2.4 UI設計軟件——Photoshop
1.3 UI設計流程及視覺設計
1.3.1 UI設計流程
1.3.2 視覺設計
1.4 關於圖標的設計
1.4.1 圖標尺寸大小
1.4.2 圖標格式建議

Chapter 2 APP界面設計的色彩理論和原則
2.1 顏色與光線
2.1.1 可見光
2.1.2 光譜色
2.2 顏色的屬性
2.2.1 色彩的分類
2.2.2 色相
2.2.3 明度
2.2.4 飽和度
2.2.5 色調
2.3 色彩的混合
2.3.1 加色混合
2.3.2 減色混合
2.3.3 視覺混合
2.3.4 色域
2.3.5 色彩管理
2.4 APP界面設計中材質繪制的色彩理論
2.4.1 視覺中心
2.4.2 關於光能的傳遞
2.4.3 陰影的體現
2.4.4 冷暖的對比和烘托
2.4.5 線條的暗示性
2.5 APP界面的設計原則
2.5.1 捕捉對象的特征
2.5.2 讓圖標簡單、通用，從而適應一系列項目
2.5.3 使用一致的光源
2.5.4 創建矢量格式的圖標
2.5.5 注意文化差異
2.5.6 使用別樣的色彩組合
2.5.7 圖標的尺寸大小
2.5.8 仔細規划你的設計
2.5.9 設計一個犀利的小圖標

Chapter 3 Photoshop制作圖標常用的編輯操作
3.1 PhotoshopCS6的工作界面
3.1.1 了解工作界面的工作組建
3.1.2 了解工具箱
3.1.3 了解選項欄
3.1.4 了解狀態欄
3.1.5 了解面板
3.2 圖標設計技巧和原則
3.3 跟大師設計一組圖標
3.3.1 准備工作
3.3.2 構思、草圖
3.3.3 輔助背景制作
3.3.4 基本形、放大
3.3.5 創作過程
3.3.6 常用方法——變形
3.3.7 進階方法——改進
3.3.8 成品
問答：形狀工具和選區的區別？

PART2 實戰案例

Chapter 4 簡單圖標UI設計
4.1 制作桃心圖標
技術鏈接：路徑的運算方法
4.2 制作可回收資源圖標
技術鏈接:鋼筆工具的使用
4.3 制作短信圖標
技術鏈接：基本圖形工具
4.4 制作照相機圖標
技術鏈接：基本圖形工具
4.5 制作鬧鍾圖標
技術鏈接：認識錨點
問答：如何快速上手制作圖標？

Chapter 5 復雜圖標UI設計
5.1 攝像頭圖標制作
技術鏈接:新建文檔
5.2 Drive圖標制作
技術鏈接：對圖層的基本理解
5.3 tumblr圖標制作
技術鏈接:設置圖層不透明度
5.4 天氣圖標制作
技術鏈接:了解「圖層」面板
5.5 工具箱圖標制作
技術鏈接;顯示與隱藏圖層
問答：怎樣完成一個圖標設計？

Chapter 6 圖形UI設計
6.1 條碼圖形
技術鏈接：添加「圖層樣式」的方法
6.2 聖誕圖形
技術鏈接：「圖層樣式」對話框
6.3 工具圖形
技術鏈接：圖層樣式、漸變疊加
6.4 E-mail圖形
技術鏈接：圖層樣式——斜面和浮雕
問答：怎樣解決鋸齒問題？

Chapter 7 按鈕UI設計
7.1 內發光按鈕
技術鏈接——標尺和參考線
7.2 簡單的水晶方按鈕
技術鏈接：圖層樣式-投影
7.3 電源風格按鈕
技術鏈接：圖層樣式-內陰影/光澤
7.4 糖果按鈕
技術鏈接：圖層樣式-圖案疊加
7.5 音樂播放器按鈕
技術鏈接：圖層樣式——外發光/內發光
問答：按鈕設計的技巧方法？

Chapter 8 進度條、日歷、開關UI設計
8.1 Loading加載進度條
技術鏈接：圖層蒙版的使用
8.2 日歷界面
技術鏈接：變換與變形圖像
8.3 開關設置界面
技術鏈接：文字的編輯技巧
問答：如何合理地設計進度條？

Chapter 9 輸入框UI設計
9.1 對話框
技術鏈接：復制、粘貼和清除樣式
9.2 登錄窗口
技術鏈接：顯示和隱藏效果
9.3 搜索界面
技術鏈接：修改效果
問答：怎麼更好的應用圖層樣式？

Chapter 10 導航和通知列表UI設計
10.1 通知列表
技術鏈接：智能濾鏡
10.2 導航列表
技術鏈接：創建剪貼蒙版
問答：界面設計的核心有哪些？