在信息技術(shù)飛速發(fā)展和體驗(yàn)經(jīng)濟(jì)興起的大潮下,數(shù)字媒體作為人類創(chuàng)新與科技相融合的新興產(chǎn)物,在信息產(chǎn)業(yè)的發(fā)展過程中發(fā)揮著重要的作用,成為產(chǎn)業(yè)發(fā)展的重要驅(qū)動(dòng)力之一,滿足了服務(wù)于信息傳遞、娛樂和市場推廣等多個(gè)領(lǐng)域的現(xiàn)代社會(huì)增長需求。隨著基于安卓(Android)系統(tǒng)的移動(dòng)智能設(shè)備的普及,人們的生活方式發(fā)生了飛速的變化,移動(dòng)設(shè)備屏幕變得更大、功能更加齊全,這對移動(dòng)UI(user interface)設(shè)計(jì)的要求也就越來越高,致使UI設(shè)計(jì)產(chǎn)業(yè)被快速推動(dòng),并得到了持續(xù)性發(fā)展。
在新技術(shù)、新媒體不斷涌現(xiàn)的今天,數(shù)字媒體教學(xué)如果仍采用傳統(tǒng)的教學(xué)方法,教材仍采用亦步亦趨的介紹性文字,顯然已經(jīng)不能跟上時(shí)代的步伐,純粹學(xué)術(shù)性的教學(xué)方法已不利于當(dāng)前學(xué)習(xí)者盡快掌握知識技能和實(shí)戰(zhàn)技巧。因此,作者與企業(yè)合作,試圖編寫一本校企雙元合作開發(fā)、符合國家教材建設(shè)管理辦法的育訓(xùn)并舉的新形態(tài)教材,以側(cè)重搭建理論框架和案例分析的傳統(tǒng)紙質(zhì)教材為主,配合側(cè)重于案例教學(xué)視頻、案例文檔、素材等數(shù)字教學(xué)資源。本書整體知識模塊編寫堅(jiān)持必需夠用原則,基于崗位流程設(shè)定的知識模塊和項(xiàng)目實(shí)踐,符合新媒體四步教學(xué)法,遵循學(xué)習(xí)者的認(rèn)知邏輯,從簡單到復(fù)雜,從基礎(chǔ)到專業(yè),從理論到實(shí)踐。
全書結(jié)構(gòu)清晰、內(nèi)容由簡到難、案例精彩、步驟詳細(xì),使學(xué)習(xí)者學(xué)習(xí)起來更為輕松、方便。為了便于讀者學(xué)習(xí),本書還贈(zèng)送了學(xué)習(xí)資源包。學(xué)習(xí)資源包收錄了書中所有內(nèi)容的教案、PPT,可登錄清華大學(xué)出版社官方網(wǎng)站下載獲取,項(xiàng)目任務(wù)工單和教學(xué)視頻可通過掃描書中的二維碼獲取,方便讀者隨時(shí)對照和查閱。
本書有以下特色。
1.秉持培根鑄魂、啟智增慧的建設(shè)宗旨
推動(dòng)黨的二十大精神進(jìn)教材、進(jìn)課堂、進(jìn)頭腦,是培育時(shí)代新人的育人要求,也是深化課程思政教學(xué)改革創(chuàng)新的實(shí)踐要求。本書作為育人育才的重要依托,始終圍繞黨的二十大精神,秉持培根鑄魂、啟智增慧的建設(shè)宗旨,構(gòu)建教材思政內(nèi)容的整體框架,聚焦技術(shù)技能傳授與道德培育的同向同行。
2.堅(jiān)持標(biāo)準(zhǔn)引領(lǐng),保障教材內(nèi)容質(zhì)量
本書內(nèi)容開發(fā)依據(jù)專業(yè)教學(xué)標(biāo)準(zhǔn),對接行業(yè)崗位技能標(biāo)準(zhǔn),兼顧產(chǎn)業(yè)的發(fā)展趨勢與革新需求,建立內(nèi)容的動(dòng)態(tài)更新機(jī)制。跟蹤產(chǎn)業(yè)前沿技術(shù)、工藝以及規(guī)范,提升內(nèi)容與產(chǎn)業(yè)發(fā)展的契合度,并有效地推進(jìn)教材層面的課證融通,適應(yīng)人才培養(yǎng)模式創(chuàng)新和優(yōu)化課程體系的需要。
3.校企雙元合作開發(fā)
編者以典型工作任務(wù)分析作為本書編寫的邏輯起點(diǎn),廣泛吸納行業(yè)企業(yè)人員參與編寫;借助多方主體的比較優(yōu)勢進(jìn)行編寫,對接新技術(shù)、新工藝、新規(guī)范、新理念等,充分反映產(chǎn)業(yè)發(fā)展最新動(dòng)態(tài);注重以真實(shí)的生產(chǎn)項(xiàng)目,典型工作任務(wù)、案例等為載體組織內(nèi)容框架;建立雙元參與、貼近崗位、動(dòng)態(tài)更新的教材開發(fā)機(jī)制。
4.貫徹以學(xué)習(xí)者為中心 的開發(fā)理念
本書立足UI設(shè)計(jì)領(lǐng)域的發(fā)展現(xiàn)狀,主要面向高職類在校學(xué)生,同時(shí)也關(guān)注了退伍軍人、UI設(shè)計(jì)愛好者等不同學(xué)習(xí)群體的實(shí)際需求,內(nèi)容編寫層級結(jié)構(gòu)淺顯易懂、明確清晰,貼近學(xué)習(xí)者的學(xué)習(xí)認(rèn)知。內(nèi)容設(shè)計(jì)考慮典型工作任務(wù)分析的科學(xué)性和信息化教學(xué)呈現(xiàn)形式的創(chuàng)新性,準(zhǔn)確把握職業(yè)教育面向就業(yè)、實(shí)踐導(dǎo)向的職業(yè)性特征,將教師教學(xué)的教材轉(zhuǎn)變?yōu)閷W(xué)生學(xué)習(xí)的學(xué)材。
5.打造育訓(xùn)并舉的新形態(tài)數(shù)字立體化教材
聚焦發(fā)展型、復(fù)合型、創(chuàng)新型人才培養(yǎng)模式,以傳統(tǒng)紙質(zhì)教材為載體,側(cè)重搭建理論框架和案例分析,配合數(shù)字資源包,學(xué)習(xí)者可以通過獲取資源包找到對應(yīng)的教學(xué)視頻、案例文檔、素材等數(shù)字資源,形成可聽、可視、可練、可互動(dòng)的數(shù)字化教材。
6 .堅(jiān)持必需夠用原則
全面展示設(shè)計(jì)過程、設(shè)計(jì)要點(diǎn)及設(shè)計(jì)技巧,保證足夠的實(shí)踐教學(xué)時(shí)間;實(shí)訓(xùn)案例具有典型性,具備可遷移性和拓展性,使學(xué)習(xí)者能夠舉一反三;突出實(shí)踐能力的培養(yǎng),并具備行業(yè)評價(jià)保障機(jī)制,精心設(shè)計(jì)學(xué)習(xí)評估評價(jià)過程,實(shí)現(xiàn)教學(xué)目標(biāo)的可操作性和可估量性;設(shè)計(jì)行業(yè)小貼士,體現(xiàn)職業(yè)教育的類型特征。
我們期望通過本書的教學(xué)實(shí)踐,可以增強(qiáng)讀者的公民意識和社會(huì)責(zé)任意識;拓寬讀者在UI設(shè)計(jì)領(lǐng)域知識的廣度與深度;提高讀者的理性思考和創(chuàng)造性思維能力。
本書由張美枝、劉曉清擔(dān)任主編,武迪、魏虹、王雅娟參與了編寫。張美枝編寫第 1章;武迪編寫第2章;魏虹編寫第3章;劉曉清編寫第4章;王雅娟編寫第5章;企業(yè)教師隗妍負(fù)責(zé)項(xiàng)目全流程跟進(jìn)與指導(dǎo)。在編寫的過程中,編寫團(tuán)隊(duì)參考了大量文獻(xiàn)資料,也收錄了內(nèi)蒙古唯漫兄弟文化傳媒有限公司提供的具有典型意義的作品案例青游大學(xué)生國內(nèi)游App開發(fā),其中包括10個(gè)工作任務(wù)的全流程教學(xué)實(shí)踐。在此也向相關(guān)文獻(xiàn)的作者和企業(yè)中給予技術(shù)支持的各位老師表示最誠摯的感謝。在這里,要特別感謝企業(yè)的張賢老師在本書編寫的過程中給予的建議和指導(dǎo),使本書更加貼近教學(xué)和工作崗位。
由于編者水平有限,若有疏漏和不足之處,敬請廣大讀者批評、指正。
編者2024年2月
第1章移動(dòng)UI概論
11UI設(shè)計(jì)基礎(chǔ)知識
111UI設(shè)計(jì)概念
112UI設(shè)計(jì)類型
12移動(dòng)UI設(shè)計(jì)崗位分布
121三個(gè)概念的區(qū)別
122UED設(shè)計(jì)師
123ID設(shè)計(jì)師
124GUI設(shè)計(jì)師
13移動(dòng)UI設(shè)計(jì)流程
14移動(dòng)UI尺寸規(guī)范
141英寸、像素、分辨率
142DPI與PPI
143邏輯尺寸與物理尺寸
144常見的圖片格式
第2章產(chǎn)品體驗(yàn)設(shè)計(jì)
21產(chǎn)品用戶體驗(yàn)
22認(rèn)識思維導(dǎo)圖
221思維導(dǎo)圖構(gòu)成的要素
222認(rèn)識XMind
23競品分析
24用戶需求分析
25產(chǎn)品信息架構(gòu)
251產(chǎn)品信息架構(gòu)因素
252產(chǎn)品信息架構(gòu)的設(shè)計(jì)原則
實(shí)訓(xùn)項(xiàng)目1青游App產(chǎn)品信息架構(gòu)制作
第3章產(chǎn)品交互設(shè)計(jì)
31產(chǎn)品設(shè)計(jì)原則
32產(chǎn)品思維策劃
33產(chǎn)品流程圖
331流程圖分類
332流程圖的三種結(jié)構(gòu)
實(shí)訓(xùn)項(xiàng)目2青游App登錄流程圖繪制
34產(chǎn)品交互原型設(shè)計(jì)
341App產(chǎn)品交互原型設(shè)計(jì)
35交互原型軟件Axure RP
實(shí)訓(xùn)項(xiàng)目3青游App登錄頁原型圖制作
36交互事件
實(shí)訓(xùn)項(xiàng)目4青游App登錄頁面跳轉(zhuǎn)動(dòng)效制作
第4章產(chǎn)品界面設(shè)計(jì)
41高保真輸出常用軟件
411圖形圖像處理軟件Adobe Photoshop
412矢量繪圖軟件Adobe Illustrator
413矢量繪圖軟件Adobe XD
414Figma
415MasterGo
42設(shè)計(jì)中的平面構(gòu)成
421點(diǎn)、線、面
422圖像元素
423多媒體元素
43設(shè)計(jì)中的色彩構(gòu)成
431UI設(shè)計(jì)中的色彩構(gòu)成
432UI設(shè)計(jì)中的配色技巧
433UI設(shè)計(jì)中的色彩情感
實(shí)訓(xùn)項(xiàng)目5青游App情緒板制作
44圖標(biāo)設(shè)計(jì)及風(fēng)格
441圖標(biāo)設(shè)計(jì)分類
442圖標(biāo)設(shè)計(jì)原則
443圖標(biāo)設(shè)計(jì)方法
實(shí)訓(xùn)項(xiàng)目6青游App產(chǎn)品圖標(biāo)設(shè)計(jì)與制作
45引導(dǎo)頁
451引導(dǎo)頁的風(fēng)格與文案
452引導(dǎo)頁的設(shè)計(jì)方法
實(shí)訓(xùn)項(xiàng)目7青游App引導(dǎo)頁設(shè)計(jì)與制作
46用戶界面的形式美
461形式美在用戶界面中的重要性
462形式美法則在用戶界面中的運(yùn)用
47首頁
471首頁表現(xiàn)形式
472如何做好一個(gè)首頁
473綜合型首頁的結(jié)構(gòu)
48組件庫
481組件庫的價(jià)值
482原子設(shè)計(jì)理論
483如何搭建組件庫
實(shí)訓(xùn)項(xiàng)目8青游App首頁設(shè)計(jì)與制作
49Banner視覺表現(xiàn)形式
491風(fēng)格表現(xiàn)
492圖形及文字排版設(shè)計(jì)
493色彩表現(xiàn)
實(shí)訓(xùn)項(xiàng)目9青游App Banner設(shè)計(jì)
第5章產(chǎn)品交付設(shè)計(jì)
51界面標(biāo)注
511界面標(biāo)注的常用軟件
52產(chǎn)品切圖
521切圖的要點(diǎn)
522切圖的命名規(guī)則
實(shí)訓(xùn)項(xiàng)目10青游App首頁界面標(biāo)注與切圖
參考文獻(xiàn)
12224467891212131314202123232425293131323337383941424344505152535860687070707172727373767677798182889596103103104108110112114121121121126126128129140141142142143147147149151152156157157158158158160164