|
-- 會員 / 註冊 --
|
|
|
|
Sketch 移動UI與交互設計(視頻講解版) ( 簡體 字) |
作者:夏志麗 | 類別:1. -> 程式設計 -> UI/UX |
譯者: |
出版社:人民郵電出版社 | 3dWoo書號: 49812 詢問書籍請說出此書號!【缺書】 NT售價: 400 元 |
出版日:8/1/2018 |
頁數:252 |
光碟數:0 |
|
站長推薦: |
印刷:全彩印刷 | 語系: ( 簡體 版 ) |
|
加入購物車 │加到我的最愛 (請先登入會員) |
ISBN:9787115485342 |
作者序 | 譯者序 | 前言 | 內容簡介 | 目錄 | 序 |
(簡體書上所述之下載連結耗時費功, 恕不適用在台灣, 若讀者需要請自行嘗試, 恕不保證) |
作者序: |
譯者序: |
前言: |
內容簡介:本書通過大量的案例制作,詳細地向用戶介紹了Sketch在設計網頁界面時的使用方法。分別針對Sketch繪制線框原型、設計圖標、Android界面設計、iOS界面設計、PC端網站UI和UI的輸出與交互進行了講解。通過學習讀者應該熟悉移動UI設計和PC端UI設計的規范和設計要點。同時掌握網頁界面的輸出以及交互動效的添加方法。 |
目錄:第1章 網頁UI設計入門 1.1 UI設計發展史 2 1.1.1 早期UI設計的風格 3 1.1.2 中期UI設計的興起 3 1.1.3 后期UI設計的發展 5 知識點講解——iOS系統 6 知識點講解——Android系統 6 知識點講解——Windows 系統 7 知識點講解——擬物化風格設計 8 知識點講解——扁平化風格設計 8 1.2 網頁UI設計的制作流程 9 1.2.1 產品調研階段 10 1.2.2 UI視覺設計 10 1.2.3 產品技術開發 11 1.2.4 BUG測試 12 1.2.5 產品上線 12 1.2.6 產品迭代 13 1.3 UI設計的注意事項 13 1.3.1 圖稿一致性原則 13 知識點講解——字體 13 知識點講解——表單錄入 14 知識點講解——鼠標手勢 14 1.3.2 圖稿準確性原則 15 1.3.3 布局合理化原則 16 1.3.4 操作合理性原則 17 1.3.5 系統響應時間原則 18 1.4 配色對于UI設計的影響 18 1.4.1 網頁配色基本概念 18 知識點講解——網頁主色 18 知識點講解——網頁背景色 19 知識點講解——網頁輔色 19 知識點講解——網頁點綴色 20 1.4.2 網頁配色基本方法 20 知識點講解——根據產品內容確定網頁主色 20 知識點講解——根據網頁主色確定配色方案 21 1.4.3 網頁色彩搭配技巧 22 知識點講解——同色系 23 知識點講解——鄰近色 23 知識點講解——對比色 25 知識點講解——互補色 25 1.5 本章小結 26 第2章 初識Sketch 2.1 繪制iOS 照片分享界面 28 2.1.1 Sketch的安裝與啟動 28 操作案例——安裝與啟動Sketch 28 2.1.2 了解Sketch界面 30 知識點講解——Sketch的主界面 31 知識點講解——菜單欄 31 知識點講解——工具欄 34 操作案例——自定義工具欄 34 2.1.3 設置Sketch的快捷鍵 35 知識點講解——Sketch的快捷鍵 35 操作案例——自定義快捷鍵 37 2.1.4 添加圖片、形狀 39 知識點講解——Sketch插入面板 39 知識點講解——插入圖片 40 知識點講解——插入形狀 41 2.1.5 添加文本 42 知識點講解——插入文本 43 2.2 繪制手機登錄頁 45 2.2.1 新建和保存Sketch文件 45 知識點講解——文件的新建和保存 45 操作案例——設置Sketch 的標尺 47 2.2.2 使用Sketch 畫板 48 知識點講解——畫板預設 48 知識點講解——畫板檢查器 50 2.2.3 使用Sketch 模板 51 知識點講解—— “iOS 用戶界面設計”模板 52 2.3 本章小結 56 第3 章 繪制線框原型 3.1 繪制手機信息界面線框圖 58 3.1.1 線框原型的基本概念 58 知識點講解——線框原型概念 60 知識點講解——線框原型視覺特性 61 3.1.2 繪制線框原型的注意事項 61 知識點講解——巧用明暗對比 63 知識點講解——不使用截圖和顏色 64 知識點講解——標記第一屏高度 64 知識點講解——合理的布局和間距 65 3.2 繪制注冊頁面線框圖 65 3.2.1 圖層面板 66 知識點講解——圖層面板簡述 67 操作案例——添加和編輯圖層 68 知識點講解——選擇圖層 69 操作案例——移動圖層 70 3.2.2 圖層類型 71 知識點講解——圖層類型詳解 73 操作案例——變換大小 75 3.2.3 圖層的調整 75 操作案例——新建、重命名、復制和刪除頁面 78 知識點講解——復制、剪切和粘貼圖層 79 知識點講解——圖層組的檢查器 80 3.3 繪制完整的線框原型圖 83 3.3.1 計步App 線框圖的繪制01 84 3.3.2 計步App 線框圖的繪制02 87 3.4 本章小結 91 第4 章 使用Sketch 繪制圖標 4.1 繪制iOS 11 提醒事項圖標 93 4.1.1 矢量工具 93 知識點講解——矢量圖形(形狀) 95 知識點講解——點模式 95 知識點講解——編輯矢量圖形 96 操操作案例——矢量工具繪制箭頭圖標 97 4.1.2 路徑的使用 98 知識點講解——路徑 100 4.2 繪制Android 照相機圖標 101 4.2.1 使用“形狀”繪制圖標 102 操作案例——使用布爾運算繪制照相機圖標 106 知識點講解——布爾運算 107 4.2.2 使用“蒙板”繪制圖標 108 知識點講解——蒙板命令 109 操作案例——使用透明度蒙板制作簡易圖標 110 4.2.3 添加陰影效果為圖標添加質感 112 知識點講解——圖標基本屬性 113 4.3 繪制極簡化的Android圖標 116 4.3.1 Android 圖標設計準則 116 知識點講解——圖標設計準則 118 4.3.2 圖標設計的三大原則 120 知識點講解——三大原則 122 4.3.3 極簡化設計 123 知識點講解——極簡化設計風格 126 操作案例——繪制記事本圖標 127 4.4 本章小結 128 第5章 Android UI 設計 5.1 繪制Android 音樂播放器界面 130 5.1.1 組件的編輯及使用 130 知識點講解——創建組件 133 知識點講解——更換文本 133 知識點講解——管理組件 134 操作案例——使用組件工具繪制導航欄 135 5.1.2 應用軟件UI 設計 136 知識點講解——什么是應用軟件UI設計 137 知識點講解——應用軟件UI設計規范 138 知識點講解——軟件啟動UI設計 139 5.1.3 移動App UI 設計 140 知識點講解——什么是App 142 知識點講解——移動UI的設計趨勢 143 知識點講解——移動UI和平面UI的區別 145 5.1.4 Android 系統UI設計 146 知識點講解——Android系統文字規范設計 148 操作案例——繪制返回或菜單按鈕 149 知識點講解——Android 系統UI 設計特色 150 5.2 繪制Android 信息界面 151 5.2.1 “文本”命令 152 知識點講解——添加文本 154 知識點講解——文本框 154 5.2.2 “文本”檢查器 155 知識點講解——文本的編輯 157 知識點講解——共享樣式 159 操作案例——使用共享樣式 繪制界面 160 5.2.3 “文本”選項 161 知識點講解——文本路徑 163 知識點講解——文本轉換輪廓 164 操作案例——轉化為輪廓繪制 界面元素 164 知識點講解——導出文字 165 知識點講解——應用樣式 166 知識點講解——混合模式 168 5.3 本章小結 169 第6 章 iOS UI 設計 6.1 繪制iPhone X App 界面 171 6.1.1 iOS 系統UI 用戶元素 171 知識點講解——頂部導航欄 173 知識點講解——標簽欄和搜索欄 173 操作案例——繪制iPhone X啟動界面 174 知識點講解——表格視圖 176 6.1.2 iOS 系統UI 設計要求 177 知識點講解——確保程序可行 178 知識點講解——確保App 可以在 iPhone 和iPad 中通用 178 知識點講解——基于Web 網頁 重新設計 179 6.1.3 iOS 系統UI 設計原則 179 知識點講解——美觀性 182 知識點講解——一致性 183 知識點講解——控制可行性 184 知識點講解——及時性 184 知識點講解——暗喻性 184 知識點講解——自主性 185 6.1.4 iPhone X 的App UI 設計 185 知識點講解——編輯位圖 188 知識點講解——iPhone X 的屏幕尺寸 190 知識點講解——iPhone X 的布局 190 6.2 繪制iPhone 8 App 界面 191 6.2.1 iOS App UI 設計模板 192 知識點講解——iPhone 8 的組件 193 操作案例——繪制iPhone 系統視頻播放界面 194 知識點講解——iPhone X 的組件 195 6.2.2 iOS UI 設計規范 195 知識點講解——界面尺寸 198 知識點講解——圖標尺寸 198 知識點講解——內部設計 199 6.2.3 移動App 設計過程中的要點 199 知識點講解——App UI設計流程 202 操作案例——繪制系統發生錯誤界面 203 知識點講解——App UI配色原則 204 6.3 本章小結 206 第7 章 PC 端UI 設計 7.1 繪制網站登錄界面 208 7.1.1 PC 端和移動端UI 設計的區別 208 知識點講解——網頁設計PC 端和 移動端的區別 211 7.1.2 鉛筆工具和剪刀工具 213 知識點講解——鉛筆工具 215 知識點講解——剪刀工具 216 操作案例——設計制作設置按鈕? 216 知識點講解——旋轉復制 217 設置按鈕? 218 知識點講解——變形工具 219 7.2 繪制醫學網站首頁 219 7.2.1 PC 端UI 設計原則 220 知識點講解——以用戶為中心 223 知識點講解——視覺美觀 224 知識點講解——主題明確 224 知識點講解——內容與形式統一 26 知識點講解——有機整體 227 操作案例——繪制“休閑空間”啟動頁? 227 7.2.2 PC 端UI 設計要點 229 知識點講解——設計與技術相結合 231 知識點講解——視覺導向性 232 7.2.3 PC 端UI 設計風格 233 知識點講解——大眾化設計風格 234 知識點講解——個性化設計風格 234 操作案例——繪制“休閑空間”啟動頁? 235 7.3 本章小結 236 第8 章 UI 的輸出與交互設計 8.1 UI 圖像的輸出 238 8.1.1 圖標的輸出 238 知識點講解——適配設備 238 知識點講解——導出圖層 240 知識點講解——導出和切片 241 8.1.2 界面的輸出 241 知識點講解——切片工具 242 操作案例——為切片重命名 245 8.2 UI 設計的交互 245 知識點講解——了解移動設備的手勢 245 知識點講解——移動交互動效設計的注意事項 248 知識點講解——使用Xcode 模擬交互效果 249 8.3 Sketch 插件的安裝與使用 250 知識點講解——實用的插件 251 8.4 本章小結 252 |
序: |
|