匠人手冊(cè)：霸屏H5實(shí)戰(zhàn)解密

定　價(jià)：￥89.90

作　者：	網(wǎng)易傳媒設(shè)計(jì)中心著
出版社：	清華大學(xué)出版社
叢編項(xiàng)：
標(biāo)　簽：	暫缺

購(gòu)買(mǎi)這本書(shū)可以去

ISBN：	9787302502982	出版時(shí)間：	2018-07-01	包裝：	平裝
開(kāi)本：	16	頁(yè)數(shù)：	226	字?jǐn)?shù)：

內(nèi)容簡(jiǎn)介

　　這是一本關(guān)于H5設(shè)計(jì)方法和設(shè)計(jì)流程的書(shū)，作者為近年來(lái)佳作頻出的網(wǎng)易傳媒設(shè)計(jì)中心，其代表作品有《娛樂(lè)圈畫(huà)傳》《里約小人大冒險(xiǎn)》《我是一只快樂(lè)的羊駝》《滑向童年》等。《H5匠人手冊(cè)：霸屏H5實(shí)戰(zhàn)解密》通過(guò)交互、視覺(jué)和動(dòng)效三部分內(nèi)容，從產(chǎn)品策劃、用戶(hù)心理、交互手段、視覺(jué)渲染、動(dòng)效運(yùn)用、移動(dòng)界面設(shè)計(jì)常識(shí)等方面進(jìn)行系統(tǒng)論述，通過(guò)理論講解和案例分析，詳細(xì)介紹了提升 H5 設(shè)計(jì)質(zhì)量的方法和一些實(shí)用性強(qiáng)的手段，幫助讀者建立起一個(gè)更加完整的 H5 設(shè)計(jì)思維體系。本書(shū)適合從事 H5 相關(guān)工作的交互設(shè)計(jì)師、視覺(jué)設(shè)計(jì)師、動(dòng)效設(shè)計(jì)師閱讀，也可供致力于 H5 設(shè)計(jì)的初學(xué)者和愛(ài)好者參考。

作者簡(jiǎn)介

　　網(wǎng)易傳媒設(shè)計(jì)中心擁有交互用研團(tuán)隊(duì)、視覺(jué)設(shè)計(jì)團(tuán)隊(duì)近30余人，各團(tuán)隊(duì)除了專(zhuān)注自身領(lǐng)域，又時(shí)時(shí)融合在一起，以科學(xué)的設(shè)計(jì)方法和流程打造高精尖產(chǎn)品。我們以“不斷提升網(wǎng)易產(chǎn)品用戶(hù)體驗(yàn)，帶給用戶(hù)好的使用感受”為目標(biāo)而努力。目前設(shè)計(jì)中心服務(wù)的范圍涵蓋網(wǎng)易門(mén)戶(hù)旗下所有內(nèi)容部門(mén)，包括新聞、財(cái)經(jīng)、體育、娛樂(lè)、科技、直播、原創(chuàng)等多條業(yè)務(wù)線(xiàn)，并從H5迅猛發(fā)展以來(lái)，打造出了多款頁(yè)面瀏覽量上千萬(wàn)的H5產(chǎn)品，刷爆朋友圈，例如《娛樂(lè)圈畫(huà)傳》《里約小人大冒險(xiǎn)》《我是一只快樂(lè)的羊駝》《滑向童年》等。

圖書(shū)目錄

第 1 章鋪墊
1.1 H5 的前身今世
1.1.1　H5 是什么
1.1.2　H5 的階段性發(fā)展
1.1.3　我們?yōu)槭裁醋?H5
1.2 怎樣的 H5 才是好的 H5
1.2.1　情感共鳴直擊內(nèi)心
1.2.2　構(gòu)思新奇有想象力
1.2.3　交互炫酷有表現(xiàn)力
1.2.4　技術(shù)創(chuàng)新新鮮有趣
1.2.5　加入鼓勵(lì) 動(dòng)力十足
1.2.6　反客為主促進(jìn)回流
第 2 章 H5 交互流程剖析
2.1 一個(gè) H5 策劃的開(kāi)始，源于好的溝通
2.1.1 邀請(qǐng)參與者開(kāi)會(huì)
2.1.2 明確項(xiàng)目背景
2.1.3 策劃常見(jiàn)問(wèn)題
2.2 策劃評(píng)估 1：動(dòng)機(jī)——是否能在短時(shí)間內(nèi)吸引用戶(hù)注意力并完成閱讀
2.2.1 利用心流理論控制節(jié)奏
2.2.2　利用 Hook 理論引導(dǎo)用戶(hù)
2.3 策劃評(píng)估 2：框架——展現(xiàn)形式是否符合策劃主題
2.3.1　展示型
2.3.2 引導(dǎo)型
2.3.3 操作型
2.4 策劃評(píng)估 3：任務(wù)——是否提煉出核心任務(wù)
2.5 策劃評(píng)估 4：交互——交互方式與策劃是否匹配
2.6 策劃評(píng)估 5：原則——是否符合移動(dòng)端的交互原則
2.6.1 簡(jiǎn)化層級(jí)，結(jié)構(gòu)扁平化
2.6.2 降低閱讀門(mén)檻，減少認(rèn)知成本
2.6.3 H5 要注意分享屬性
2.6.4 一定要注意額外規(guī)范
2.7 產(chǎn)出 1：界面落實(shí)
2.7.1　快
2.7.2　細(xì)
2.8 產(chǎn)出 2：完善細(xì)節(jié)
2.8.1　關(guān)于分享控件與回流入口
2.8.2　文案配合專(zhuān)題
2.8.3　適當(dāng)?shù)奶崾?
2.8.4　H5 的返回設(shè)置
2.8.5　H5 的分段設(shè)置
2.8.6　增加彩蛋
2.9 產(chǎn)出 3：溝通跟進(jìn)，繞坑而行
2.9.1　加載與控制文件大小
2.9.2　避免手勢(shì)沖突
2.9.3　輸入框
2.9.4　播放器
2.9.5　手機(jī)適配（iPhone X）
2.9.6　其他設(shè)備端打開(kāi) H5
2.9.7　微信誘導(dǎo)分享
2.10 產(chǎn)出 4：測(cè)試上線(xiàn)與數(shù)據(jù)監(jiān)測(cè)
2.11 常用交互手段
2.11.1　結(jié)合手勢(shì)激發(fā) H5 亮點(diǎn)
2.11.2　利用好硬件給 H5 添彩
2.11.3　新科技引領(lǐng)新體驗(yàn)
第 3 章 H5 視覺(jué)套路
3.1 制作一個(gè) H5，視覺(jué)設(shè)計(jì)師要做什么
3.2 創(chuàng)意的視覺(jué)表現(xiàn)
3.2.1　要有目的的創(chuàng)意
3.2.2　創(chuàng)意形式千千萬(wàn)
3.2.3　沒(méi)有靈感？沒(méi)關(guān)系
3.3 執(zhí)行——手頭功夫很重要
3.3.1　要展示的信息量大怎么辦
3.3.2　怎么搞定 H5 小游戲
3.4 萬(wàn)能的插畫(huà)
3.4.1　做到表里如一
3.4.2　形式很重要
3.4.3　制造氛圍
3.4.4　案例賞析 1
3.4.5　案例賞析 2
第 4 章 H5 動(dòng)效解密
4.1 何為動(dòng)效
4.1.1　動(dòng)畫(huà)與動(dòng)效
4.1.2　MG 動(dòng)畫(huà)與動(dòng)效
4.1.3　交互與動(dòng)效
4.2 為何 H5“無(wú)動(dòng)效不歡”
4.2.1　有趣加載治百病
4.2.2　絲滑柔順的轉(zhuǎn)場(chǎng)
4.2.3　一眼就看懂的引導(dǎo)
4.2.4　反饋動(dòng)效很有必要
4.2.5　讓人驚喜的動(dòng)態(tài)視覺(jué)
4.2.6　動(dòng)畫(huà)的魅力
4.3 H5 必備的運(yùn)動(dòng)法則
4.3.1　基本運(yùn)動(dòng)規(guī)律
4.3.2　貝塞爾曲線(xiàn)那點(diǎn)事兒
4.3.3　不可忽視的反饋與夸張
4.3.4　情緒的重要性
4.3.5　空間感
4.3.6　節(jié)奏
4.4 H5 與電影
4.5 案例解析
4.5.1　《里約小人大冒險(xiǎn)》
4.5.2　《2016 請(qǐng)回答》
4.5.3　《滑向童年》
4.5.4　《紀(jì)念哈利·波特 20 周年》
參考資料及延伸閱讀