最新章節

• 后記
• 15.4 突破瓶頸期
• 15.3 大量練習
• 15.2 全鏈路設計師
• 15.1 時刻了解行業設計風格的趨勢和變化
• 第15章 UI設計進階之路

• 后記 更新時間：2021-04-16 16:14:36
• 15.4 突破瓶頸期
• 15.3 大量練習
• 15.2 全鏈路設計師
• 15.1 時刻了解行業設計風格的趨勢和變化
• 第15章 UI設計進階之路
• 14.2 Principle Mirror的使用方法
• 14.1 Sketch Mirror的使用方法
• 第14章 Mirror預覽
• 13.4.2 電臺界面拖動動畫設計
• 13.4.1 聯動動畫——Drag（拖動）動畫制作
• 13.4 聯動動畫——Drag（拖動）
• 13.3.2 音樂列表動畫設計
• 13.3.1 聯動動畫——Scroll（滾動）
• 13.3 首頁banner翻頁動畫設計制作
• 13.2 Principle Drivers——Page（翻頁）動畫
• 13.1 了解Principle Drivers
• 第13章 Principle Drivers
• 12.4.4 作業：通過Principle Animation制作界面動效
• 12.4.3 發現音樂App列表頁動效設計
• 12.4.2 發現音樂App的動效設計
• 12.4.1 發現音樂App的動效結構分析
• 12.4 發現音樂App的動效制作
• 12.3 Principle中的動畫速度曲線
• 12.2 Principle補間動畫中的關鍵幀
• 12.1 Principle補間動畫的圖層命名
• 第12章 Principle Animation
• 11.5 導出視頻文件和GIF文件
• 11.4.2 導入文件該注意的事項
• 11.4.1 Sketch文件的整理
• 11.4 Sketch文件的導入
• 11.3.6 預覽窗口
• 11.3.5 畫布
• 11.3.4 圖層
• 11.3.3 檢查器
• 11.3.2 工具欄
• 11.3.1 菜單欄
• 11.3 了解Principle主界面
• 11.2.3 Principle的激活
• 11.2.2 Principle的安裝
• 11.2.1 Principle的下載
• 11.2 如何獲取Principle
• 11.1.2 為什么要選擇Principle（Sketch的好搭檔）
• 11.1.1 為什么要學習動效制作
• 11.1 初識Principle
• 第11章 UI設計動效入門
• 10.3 文件整理
• 10.2 如何使用庫與更新庫
• 10.1 如何在Sketch中添加庫
• 第10章 養成設計好習慣
• 9.2 產品設計稿標注
• 9.1.3 了解切圖的命名
• 9.1.2 了解切圖結構
• 9.1.1 切圖的存儲方式
• 9.1 產品的切圖
• 第9章 產品切圖與標注
• 8.5 作業：繪制小頭像
• 8.4 利用Sketch設計產品內的小頭像
• 8.3.3 元素設計
• 8.3.2 尋找特點
• 8.3.1 了解需求
• 8.3 頭像設計思路分析
• 8.2 主流頭像設計風格分析
• 8.1 頭像的位置
• 第8章 頭像設計
• 7.3 作業：完成產品二級界面繪制
• 7.2.4 搜索歌手系列界面設計
• 7.2.3 搜索系列界面設計
• 7.2.2 “電臺-界面”設計
• 7.2.1 “音樂列表-界面”設計
• 7.2 利用Sketch及插件繪制產品二級界面
• 7.1 回顧二級界面交互設計稿
• 第7章 發現音樂App二級界面設計
• 6.5 作業：設計產品主界面
• 6.4.4 “播放-界面”設計
• 6.4.3 “朋友-界面”設計
• 6.4.2 “喜歡-界面”設計
• 6.4.1 首頁設計
• 6.4 利用Sketch繪制產品主界面
• 6.3 Sketch中的Mask（蒙版）功能
• 6.2.10 解決缺少字體的問題
• 6.2.9 將文本轉換為路徑
• 6.2.8 路徑上的文本
• 6.2.7 在圖層中應用文本樣式
• 6.2.6 創建文本樣式
• 6.2.5 文本樣式的復制與粘貼
• 6.2.4 Text Options（文本選項）
• 6.2.3 文本Alignment（對齊）功能
• 6.2.2 文本檢查器
• 6.2.1 創建文本
• 6.2 Sketch文本處理功能介紹
• 6.1 競品分析（音樂App界面設計風格）
• 第6章 發現音樂App主界面設計
• 5.7 作業：繪制應用圖標
• 5.6.3 繪制圖標的擬物狀態
• 5.6.2 繪制圖標的輕擬物狀態
• 5.6.1 繪制圖標的扁平狀態
• 5.6 利用Sketch繪制應用圖標
• 5.5.6 復制與粘貼樣式
• 5.5.5 刪除未使用的樣式
• 5.5.4 Blurs（模糊）
• 5.5.3 Shadows（陰影）和Inner Shadows（內陰影）
• 5.5.2 Borders（描邊）
• 5.5.1 Fills（填充）
• 5.5 Sketch的STYLE（樣式）功能
• 5.4 為應用圖標選擇顏色
• 5.3 為應用圖標選擇元素
• 5.2 應用圖標的傳導含義
• 5.1 當下同類App圖標設計風格分析
• 第5章 應用圖標設計
• 4.8 作業：繪制產品內的功能圖標
• 4.7.8 繪制“點贊icon”
• 4.7.7 繪制“留言icon”
• 4.7.6 繪制“下載icon”
• 4.7.5 繪制“循環播放icon”
• 4.7.4 繪制““icon/返回””
• 4.7.3 繪制“音樂列表icon”
• 4.7.2 繪制“添加icon”
• 4.7.1 繪制“側邊欄icon”
• 4.7 利用Sketch繪制功能圖標
• 4.6 Sketch的布爾運算工具
• 4.5.3 計算各基本形尺寸
• 4.5.2 計算視覺平衡縮進值
• 4.5.1 為什么要遵守視覺平衡
• 4.5 功能圖標的視覺平衡
• 4.4 功能圖標的尺寸規范
• 4.3 功能圖標的點擊范圍及顯示范圍
• 4.2 功能圖標的設計思路及技巧
• 4.1 了解功能圖標
• 第4章 功能圖標設計
• 3.6 作業：繪制產品原型圖
• 3.5.2 通過原型功能進行產品原型初體驗
• 3.5.1 Sketch的Link原型功能介紹
• 3.5 交互原型圖動效初體驗
• 3.4.10 繪制“電臺界面”交互原型圖
• 3.4.9 繪制“音樂列表”界面交互原型圖
• 3.4.8 繪制“播放界面”交互原型圖
• 3.4.7 繪制“朋友”界面交互原型圖
• 3.4.6 繪制“喜歡”界面交互原型圖
• 3.4.5 繪制首頁交互稿
• 3.4.4 選擇交互稿色系及明度
• 3.4.3 標記非設計區域
• 3.4.2 創建畫板
• 3.4.1 創建文檔
• 3.4 利用Sketch繪制產品交互原型圖
• 3.3.6 元件的創建
• 3.3.5 對齊功能
• 3.3.4 測量功能
• 3.3.3 Radius（圓角半徑）工具
• 3.3.2 Group（編組）工具
• 3.3.1 Insert（添加）工具
• 3.3 在Sketch中繪制交互原型圖所需要的工具
• 3.2.2 交互原型圖的展示方式
• 3.2.1 為什么要做交互原型圖
• 3.2 設計產品交互原型圖
• 3.1.3 產品功能解讀
• 3.1.2 了解用戶群體
• 3.1.1 了解產品需求文檔
• 3.1 發現音樂App產品需求文檔解讀
• 第3章 發現音樂App交互原型圖設計
• 2.4.7 導出
• 2.4.6 檢查器
• 2.4.5 畫布
• 2.4.4 圖層
• 2.4.3 頁面
• 2.4.2 工具欄
• 2.4.1 菜單欄
• 2.4 了解Sketch主界面
• 2.3 初見Sketch
• 2.2.3 激活Sketch
• 2.2.2 安裝Sketch
• 2.2.1 下載Sketch
• 2.2 如何獲取Sketch
• 2.1.4 Sketch未來的發展空間
• 2.1.3 Sketch的團隊價值
• 2.1.2 Sketch在UI設計中的優勢
• 2.1.1 Sketch是什么
• 2.1 初識Sketch
• 第2章 Sketch設計入門
• 1.3 設計師常用軟件
• 1.2.6 輔助研發
• 1.2.5 切圖與標注
• 1.2.4 動效設計
• 1.2.3 界面設計
• 1.2.2 交互設計
• 1.2.1 頭腦風暴
• 1.2 UI設計師的工作內容
• 1.1.3 什么是好的UI設計
• 1.1.2 UI設計存在的理由
• 1.1.1 認識UI設計
• 1.1 什么是UI
• 第1章 初識UI設計
• 內容簡介
• 版權信息
• 封面

• 封面
• 版權信息
• 內容簡介
• 第1章 初識UI設計
• 1.1 什么是UI
• 1.1.1 認識UI設計
• 1.1.2 UI設計存在的理由
• 1.1.3 什么是好的UI設計
• 1.2 UI設計師的工作內容
• 1.2.1 頭腦風暴
• 1.2.2 交互設計
• 1.2.3 界面設計
• 1.2.4 動效設計
• 1.2.5 切圖與標注
• 1.2.6 輔助研發
• 1.3 設計師常用軟件
• 第2章 Sketch設計入門
• 2.1 初識Sketch
• 2.1.1 Sketch是什么
• 2.1.2 Sketch在UI設計中的優勢
• 2.1.3 Sketch的團隊價值
• 2.1.4 Sketch未來的發展空間
• 2.2 如何獲取Sketch
• 2.2.1 下載Sketch
• 2.2.2 安裝Sketch
• 2.2.3 激活Sketch
• 2.3 初見Sketch
• 2.4 了解Sketch主界面
• 2.4.1 菜單欄
• 2.4.2 工具欄
• 2.4.3 頁面
• 2.4.4 圖層
• 2.4.5 畫布
• 2.4.6 檢查器
• 2.4.7 導出
• 第3章 發現音樂App交互原型圖設計
• 3.1 發現音樂App產品需求文檔解讀
• 3.1.1 了解產品需求文檔
• 3.1.2 了解用戶群體
• 3.1.3 產品功能解讀
• 3.2 設計產品交互原型圖
• 3.2.1 為什么要做交互原型圖
• 3.2.2 交互原型圖的展示方式
• 3.3 在Sketch中繪制交互原型圖所需要的工具
• 3.3.1 Insert（添加）工具
• 3.3.2 Group（編組）工具
• 3.3.3 Radius（圓角半徑）工具
• 3.3.4 測量功能
• 3.3.5 對齊功能
• 3.3.6 元件的創建
• 3.4 利用Sketch繪制產品交互原型圖
• 3.4.1 創建文檔
• 3.4.2 創建畫板
• 3.4.3 標記非設計區域
• 3.4.4 選擇交互稿色系及明度
• 3.4.5 繪制首頁交互稿
• 3.4.6 繪制“喜歡”界面交互原型圖
• 3.4.7 繪制“朋友”界面交互原型圖
• 3.4.8 繪制“播放界面”交互原型圖
• 3.4.9 繪制“音樂列表”界面交互原型圖
• 3.4.10 繪制“電臺界面”交互原型圖
• 3.5 交互原型圖動效初體驗
• 3.5.1 Sketch的Link原型功能介紹
• 3.5.2 通過原型功能進行產品原型初體驗
• 3.6 作業：繪制產品原型圖
• 第4章 功能圖標設計
• 4.1 了解功能圖標
• 4.2 功能圖標的設計思路及技巧
• 4.3 功能圖標的點擊范圍及顯示范圍
• 4.4 功能圖標的尺寸規范
• 4.5 功能圖標的視覺平衡
• 4.5.1 為什么要遵守視覺平衡
• 4.5.2 計算視覺平衡縮進值
• 4.5.3 計算各基本形尺寸
• 4.6 Sketch的布爾運算工具
• 4.7 利用Sketch繪制功能圖標
• 4.7.1 繪制“側邊欄icon”
• 4.7.2 繪制“添加icon”
• 4.7.3 繪制“音樂列表icon”
• 4.7.4 繪制““icon/返回””
• 4.7.5 繪制“循環播放icon”
• 4.7.6 繪制“下載icon”
• 4.7.7 繪制“留言icon”
• 4.7.8 繪制“點贊icon”
• 4.8 作業：繪制產品內的功能圖標
• 第5章 應用圖標設計
• 5.1 當下同類App圖標設計風格分析
• 5.2 應用圖標的傳導含義
• 5.3 為應用圖標選擇元素
• 5.4 為應用圖標選擇顏色
• 5.5 Sketch的STYLE（樣式）功能
• 5.5.1 Fills（填充）
• 5.5.2 Borders（描邊）
• 5.5.3 Shadows（陰影）和Inner Shadows（內陰影）
• 5.5.4 Blurs（模糊）
• 5.5.5 刪除未使用的樣式
• 5.5.6 復制與粘貼樣式
• 5.6 利用Sketch繪制應用圖標
• 5.6.1 繪制圖標的扁平狀態
• 5.6.2 繪制圖標的輕擬物狀態
• 5.6.3 繪制圖標的擬物狀態
• 5.7 作業：繪制應用圖標
• 第6章 發現音樂App主界面設計
• 6.1 競品分析（音樂App界面設計風格）
• 6.2 Sketch文本處理功能介紹
• 6.2.1 創建文本
• 6.2.2 文本檢查器
• 6.2.3 文本Alignment（對齊）功能
• 6.2.4 Text Options（文本選項）
• 6.2.5 文本樣式的復制與粘貼
• 6.2.6 創建文本樣式
• 6.2.7 在圖層中應用文本樣式
• 6.2.8 路徑上的文本
• 6.2.9 將文本轉換為路徑
• 6.2.10 解決缺少字體的問題
• 6.3 Sketch中的Mask（蒙版）功能
• 6.4 利用Sketch繪制產品主界面
• 6.4.1 首頁設計
• 6.4.2 “喜歡-界面”設計
• 6.4.3 “朋友-界面”設計
• 6.4.4 “播放-界面”設計
• 6.5 作業：設計產品主界面
• 第7章 發現音樂App二級界面設計
• 7.1 回顧二級界面交互設計稿
• 7.2 利用Sketch及插件繪制產品二級界面
• 7.2.1 “音樂列表-界面”設計
• 7.2.2 “電臺-界面”設計
• 7.2.3 搜索系列界面設計
• 7.2.4 搜索歌手系列界面設計
• 7.3 作業：完成產品二級界面繪制
• 第8章 頭像設計
• 8.1 頭像的位置
• 8.2 主流頭像設計風格分析
• 8.3 頭像設計思路分析
• 8.3.1 了解需求
• 8.3.2 尋找特點
• 8.3.3 元素設計
• 8.4 利用Sketch設計產品內的小頭像
• 8.5 作業：繪制小頭像
• 第9章 產品切圖與標注
• 9.1 產品的切圖
• 9.1.1 切圖的存儲方式
• 9.1.2 了解切圖結構
• 9.1.3 了解切圖的命名
• 9.2 產品設計稿標注
• 第10章 養成設計好習慣
• 10.1 如何在Sketch中添加庫
• 10.2 如何使用庫與更新庫
• 10.3 文件整理
• 第11章 UI設計動效入門
• 11.1 初識Principle
• 11.1.1 為什么要學習動效制作
• 11.1.2 為什么要選擇Principle（Sketch的好搭檔）
• 11.2 如何獲取Principle
• 11.2.1 Principle的下載
• 11.2.2 Principle的安裝
• 11.2.3 Principle的激活
• 11.3 了解Principle主界面
• 11.3.1 菜單欄
• 11.3.2 工具欄
• 11.3.3 檢查器
• 11.3.4 圖層
• 11.3.5 畫布
• 11.3.6 預覽窗口
• 11.4 Sketch文件的導入
• 11.4.1 Sketch文件的整理
• 11.4.2 導入文件該注意的事項
• 11.5 導出視頻文件和GIF文件
• 第12章 Principle Animation
• 12.1 Principle補間動畫的圖層命名
• 12.2 Principle補間動畫中的關鍵幀
• 12.3 Principle中的動畫速度曲線
• 12.4 發現音樂App的動效制作
• 12.4.1 發現音樂App的動效結構分析
• 12.4.2 發現音樂App的動效設計
• 12.4.3 發現音樂App列表頁動效設計
• 12.4.4 作業：通過Principle Animation制作界面動效
• 第13章 Principle Drivers
• 13.1 了解Principle Drivers
• 13.2 Principle Drivers——Page（翻頁）動畫
• 13.3 首頁banner翻頁動畫設計制作
• 13.3.1 聯動動畫——Scroll（滾動）
• 13.3.2 音樂列表動畫設計
• 13.4 聯動動畫——Drag（拖動）
• 13.4.1 聯動動畫——Drag（拖動）動畫制作
• 13.4.2 電臺界面拖動動畫設計
• 第14章 Mirror預覽
• 14.1 Sketch Mirror的使用方法
• 14.2 Principle Mirror的使用方法
• 第15章 UI設計進階之路
• 15.1 時刻了解行業設計風格的趨勢和變化
• 15.2 全鏈路設計師
• 15.3 大量練習
• 15.4 突破瓶頸期
• 后記 更新時間：2021-04-16 16:14:36