本書針對(duì)目前最主流的移動(dòng)應(yīng)用三大平臺(tái)(iOS、Android 和Windows Phone)的特點(diǎn)以及時(shí)下最普及的兩大類移動(dòng)產(chǎn)品的規(guī)格和需求,為大家系統(tǒng)地闡述了設(shè)計(jì)移動(dòng)應(yīng)用的方法、步驟以及其中的諸多細(xì)節(jié)。 本書適合移動(dòng)設(shè)計(jì)人員、開發(fā)人員和產(chǎn)品經(jīng)理閱讀。
作者簡(jiǎn)介: 趙大羽 11年設(shè)計(jì)經(jīng)驗(yàn)、8年培訓(xùn)行業(yè)經(jīng)驗(yàn)。精通iOS、Android和Windows Phone 7的UI界面設(shè)計(jì)以及用戶體驗(yàn)設(shè)計(jì),參與多款大型網(wǎng)絡(luò)游戲的Android和iOS客戶端UI設(shè)計(jì)及用戶體驗(yàn)設(shè)計(jì);國(guó)家農(nóng)產(chǎn)品追溯系統(tǒng)iPad客戶端UI設(shè)計(jì);在App Store發(fā)布的多款游戲和應(yīng)用軟件中擔(dān)任策劃及UI設(shè)計(jì);為多款A(yù)ndroid應(yīng)用進(jìn)行用戶體驗(yàn)及UI設(shè)計(jì),擅長(zhǎng)移動(dòng)平臺(tái)的應(yīng)用和游戲類項(xiàng)目的視覺策劃及界面設(shè)計(jì),并精通網(wǎng)頁(yè)設(shè)計(jì)。 美術(shù)及設(shè)計(jì)基礎(chǔ)深厚,精通3Dmax、Photoshop、Illustrator和Flash等設(shè)計(jì)軟件;擁有長(zhǎng)期的設(shè)計(jì)經(jīng)驗(yàn)及閱歷;造型能力強(qiáng),色彩把握能力突出。在廣告、CI、裝幀、動(dòng)畫及插圖藝術(shù)方面都有大量項(xiàng)目經(jīng)驗(yàn)并擁有一定的造詣。 為摩托羅拉、上海通用別克、寶潔公司、西門子、美國(guó)利樂公司等大型企業(yè)做過視覺設(shè)計(jì),并在大型廣告企業(yè)擔(dān)任過設(shè)計(jì)主管。 關(guān)東升 國(guó)內(nèi)知名iOS技術(shù)作家,iOS技術(shù)顧問,高級(jí)培訓(xùn)講師,移動(dòng)開發(fā)專家。精通iOS、Android和Windows Phone及HTML5等移動(dòng)開發(fā)技術(shù)。曾先后主持開發(fā)大型網(wǎng)絡(luò)游戲神農(nóng)訣的iOS和Android客戶端開發(fā),國(guó)家農(nóng)產(chǎn)品追溯系統(tǒng)的iPad客戶端開發(fā),酒店預(yù)訂系統(tǒng)的iPhone客戶端開發(fā),金融系統(tǒng)微博的iOS、Windows Phone 7、Android客戶端開發(fā)。在App Store上發(fā)布多款游戲和應(yīng)用軟件,擅長(zhǎng)移動(dòng)平臺(tái)的應(yīng)用和游戲類項(xiàng)目開發(fā)。近期為中國(guó)移動(dòng)研究院、云南移動(dòng)、東軟、方正科技、大唐電信、中石油、深圳康拓普、上海財(cái)富168、天津港務(wù)局等企事業(yè)單位授課。 著有《iOS網(wǎng)絡(luò)編程與云端應(yīng)用最佳實(shí)踐》、《iPhone與iPad開發(fā)實(shí)戰(zhàn)——iOS經(jīng)典應(yīng)用剖析》、《Android開發(fā)案例驅(qū)動(dòng)教程》、《Android網(wǎng)絡(luò)游戲開發(fā)實(shí)戰(zhàn)》、《移動(dòng)平臺(tái)用戶體驗(yàn)設(shè)計(jì)》以及《JSP網(wǎng)絡(luò)程序設(shè)計(jì)》等圖書。
目錄: 目 錄 第 1 章 做好準(zhǔn)備了嗎——了解移動(dòng)平臺(tái)和移動(dòng)應(yīng)用 1 1.1 成為用戶體驗(yàn)設(shè)計(jì)師 1 1.1.1 UI、ID、UE和GUI,這些都是什么 2 1.1.2 了解成功的用戶體驗(yàn)設(shè)計(jì)案例 3 1.2 移動(dòng)設(shè)備的三大主流平臺(tái) 7 1.2.1 iOS 平臺(tái) 7 1.2.2 Android 平臺(tái) 10 1.2.3 Windows Phone 平臺(tái) 12 1.3 用戶體驗(yàn)設(shè)計(jì)的基本流程 13 1.3.1 創(chuàng)意和原型草圖階段 14 1.3.2 原型的中保真階段 16 1.3.3 高保真原型及設(shè)計(jì)的完成階段 17 第 2 章 一切從服務(wù)用戶開始——市場(chǎng)定位和產(chǎn)品目標(biāo) 19 2.1 是移動(dòng)產(chǎn)品,不是電腦軟件 19 2.1.1 不為外表華麗 20 2.1.2 不為功能強(qiáng)大 21 2.1.3 別讓它“大而全” 23 2.2 做有價(jià)值的應(yīng)用 26 2.2.1 它只是成千上萬個(gè)應(yīng)用中的一個(gè) 26 2.2.2 是前無古人還是出類拔萃 29 2.2.3 如何才能獨(dú)樹一幟 30 2.3 了解應(yīng)用的使用者 32 2.3.1 用戶細(xì)分 32 2.3.2 用戶研究 34 2.3.3 用戶測(cè)試 36 第 3 章 討論與初步設(shè)計(jì)——完成原型的草圖設(shè)計(jì) 37 3.1 會(huì)玩“頭腦風(fēng)暴”嗎 37 3.1.1 一項(xiàng)既有益又有趣的游戲 38 3.1.2 有明確的目標(biāo) 39 3.1.3 有合理的分工 41 3.1.4 安排好合理的環(huán)境和議程 45 3.1.5 暢所欲言和遵守規(guī)則 49 3.1.6 挑選出最有前途的想法 50 3.2 把想法和思路畫成草圖 51 3.2.1 手繪的原型草圖 51 3.2.2 潦草但要認(rèn)真 53 3.2.3 原型工具和原型設(shè)計(jì)軟件 57 3.3 檢驗(yàn)和分享你的思考結(jié)果 60 3.3.1 有連貫,有情節(jié),畫出應(yīng)用的故事板 61 3.3.2 利用原型草圖進(jìn)行可用性測(cè)試 62 3.3.3 幾種其他類型的草圖 63 第 4 章 移動(dòng)應(yīng)用的交互特點(diǎn) 67 4.1 了解移動(dòng)設(shè)備 67 4.1.1 移動(dòng)設(shè)備的種類 68 4.1.2 移動(dòng)設(shè)備的規(guī)格和像素尺寸 69 4.1.3 移動(dòng)設(shè)備的使用方法 70 4.2 移動(dòng)設(shè)備的人體工程學(xué)特點(diǎn) 74 4.2.1 了解你的拇指 74 4.2.2 單手操作還是雙手操作 77 4.2.3 善待你的指尖 80 4.3 移動(dòng)設(shè)備的視覺體驗(yàn) 84 4.3.1 視覺的運(yùn)行軌跡 85 4.3.2 優(yōu)化視覺結(jié)構(gòu) 86 4.3.3 圖片與文字的視覺關(guān)系 90 4.4 屏幕的旋轉(zhuǎn) 92 第 5 章 應(yīng)用程序?qū)Ш健 ?95 5.1 iOS 應(yīng)用的導(dǎo)航模式 95 5.1.1 平鋪導(dǎo)航 96 5.1.2 iOS 的標(biāo)簽導(dǎo)航 99 5.1.3 iOS 的樹形結(jié)構(gòu)導(dǎo)航 101 5.1.4 模態(tài)視圖 104 5.1.5 iOS 的組合導(dǎo)航 105 5.2 Android 應(yīng)用導(dǎo)航模式 106 5.2.1 Android 的標(biāo)簽導(dǎo)航 107 5.2.2 Android 的樹形結(jié)構(gòu)導(dǎo)航 109 5.2.3 手機(jī)與平板電腦導(dǎo)航的不同 110 5.2.4 Android 的組合導(dǎo)航 111 5.3 Windows Phone 應(yīng)用導(dǎo)航模式 112 5.3.1 Windows Phone 的標(biāo)簽導(dǎo)航 112 5.3.2 面板區(qū)域應(yīng)用程序中心導(dǎo)航 114 5.3.3 主面板菜單應(yīng)用程序中心導(dǎo)航 114 第 6 章 標(biāo)準(zhǔn)控件與設(shè)計(jì)規(guī)范 116 6.1 文本輸入輸出 116 6.1.1 文本輸出控件 116 6.1.2 文本輸入控件 118 6.2 按鈕 119 6.2.1 iOS 平臺(tái)按鈕 119 6.2.2 Android 平臺(tái)按鈕 120 6.2.3 Windows Phone 平臺(tái)按鈕 121 6.3 各種“欄” 122 6.3.1 狀態(tài)欄 122 6.3.2 iOS 中的工具欄、導(dǎo)航欄和標(biāo)簽欄 123 6.3.3 Android 中的菜單欄和操作欄 125 6.3.4 Windows Phone 中的菜單欄 128 6.3.5 搜索欄 129 6.4 滑塊控件 133 6.4.1 iOS 平臺(tái)滑塊控件 133 6.4.2 Android 平臺(tái)滑塊控件 134 6.4.3 Windows Phone 平臺(tái)滑塊控件 135 6.5 選擇控件 136 6.5.1 二選一 136 6.5.2 單選控件 137 6.5.3 多選控件 138 6.5.4 拾取器 138 6.6 對(duì)話框 143 6.6.1 iOS 平臺(tái)中的對(duì)話框 143 6.6.2 Android 平臺(tái)中的對(duì)話框 145 6.6.3 Windows Phone 平臺(tái)中的對(duì)話框 147 6.7 活動(dòng)指示器和進(jìn)度條 148 6.7.1 iOS 平臺(tái)中的活動(dòng)指示器和進(jìn)度條 148 6.7.2 Android 平臺(tái)的活動(dòng)指示器和進(jìn)度條 150 6.7.3 Windows Phone 平臺(tái)中的活動(dòng)指示器和進(jìn)度條 150 6.8 列表和網(wǎng)格 152 6.8.1 iOS 平臺(tái)列表和網(wǎng)格 152 6.8.2 Android 平臺(tái)列表和網(wǎng)格 154 6.8.3 Windows Phone 平臺(tái)中的列表和網(wǎng)格 155 6.9 原型的可用性測(cè)試 157 第 7 章 視覺體驗(yàn)的個(gè)性化 159 7.1 做有個(gè)性的應(yīng)用 159 7.1.1 從細(xì)節(jié)替換入手 160 7.1.2 添加裝飾、紋理和特效 162 7.1.3 純個(gè)性化的用戶體驗(yàn)設(shè)計(jì) 164 7.2 圖形元素與構(gòu)成理念 165 7.2.1 圖形元素是界面視覺印象的根本 166 7.2.2 頁(yè)面布局與構(gòu)成理念 169 7.2.3 處理好圖形元素和頁(yè)面布局間的關(guān)系 175 7.2.4 同一款應(yīng)用在不同的平臺(tái)和設(shè)備上 177 7.3 應(yīng)用界面的色彩因素 179 7.3.1 了解色彩的規(guī)律 179 7.3.2 善于把握色調(diào) 181 7.3.3 豐富的色彩,嚴(yán)謹(jǐn)?shù)拇钆洹 ?83 7.3.4 色彩的傾向性 187 7.4 嚴(yán)謹(jǐn)?shù)匕盐瘴淖帧 ?88 7.4.1 選擇合適的字體 189 7.4.2 推敲文字的四個(gè)要素 191 7.4.3 處理好字群的位置關(guān)系 193 7.5 界面風(fēng)格和特效 194 7.5.1 擬物化風(fēng)格 194 7.5.2 扁平化設(shè)計(jì) 195 7.5.3 手繪體風(fēng)格 196 第 8 章 做好應(yīng)用的圖標(biāo)設(shè)計(jì) 199 8.1 圖標(biāo)設(shè)計(jì)的原則 199 8.1.1 圖標(biāo)設(shè)計(jì)的“識(shí)別性”原則 201 8.1.2 圖標(biāo)設(shè)計(jì)的“一致性”原則 201 8.1.3 圖標(biāo)設(shè)計(jì)的“兼容性”原則 203 8.2 啟動(dòng)圖標(biāo) 206 8.2.1 建立完美的第一印象 206 8.2.2 三大平臺(tái)啟動(dòng)圖標(biāo)設(shè)計(jì)規(guī)范 210 8.2.3 幾個(gè)簡(jiǎn)單的啟動(dòng)圖標(biāo)設(shè)計(jì)思路 214 8.3 工具欄圖標(biāo) 217 8.3.1 是符號(hào),不是圖案 217 8.3.2 三大平臺(tái)工具欄圖標(biāo)的規(guī)范和含義 218 8.3.3 幾個(gè)有效的簡(jiǎn)化圖像的方法 219 8.4 啟動(dòng)畫面和引導(dǎo)幫助 221 8.4.1 啟動(dòng)畫面 221 8.4.2 引導(dǎo)幫助 223 第 9 章 用戶體驗(yàn)設(shè)計(jì)項(xiàng)目實(shí)戰(zhàn)——“價(jià)格線” 226 9.1 項(xiàng)目概述及工作計(jì)劃 226 9.1.1 項(xiàng)目描述 226 9.1.2 工作計(jì)劃和流程 227 9.2 項(xiàng)目的準(zhǔn)備階段 228 9.2.1 市場(chǎng)定位及產(chǎn)品分析 228 9.2.2 項(xiàng)目的用戶需求分析 229 9.3 項(xiàng)目的創(chuàng)作及草圖階段 230 9.4 項(xiàng)目的中保真原型及可用性測(cè)試 232 9.4.1 項(xiàng)目的中保真原型 232 9.4.2 原型的可用性測(cè)試及調(diào)整 233 9.5 完善界面的個(gè)性化設(shè)計(jì) 235 9.5.1 確定風(fēng)格并收集素材 235 9.5.2 隱喻元素的添加及個(gè)性化調(diào)整 236 9.6 應(yīng)用圖標(biāo)和啟動(dòng)畫面設(shè)計(jì) 237 9.6.1 應(yīng)用圖標(biāo)的創(chuàng)意和設(shè)計(jì) 237 9.6.2 應(yīng)用的啟動(dòng)畫面設(shè)計(jì) 239
|