《h5設(shè)計(jì)與制作》 課件 模塊一：H5的前世今生

H5設(shè)計(jì)與制作修創(chuàng)意設(shè)計(jì)心法／練動(dòng)效交互技法第一章H5的前世今生主

講：羅

玥/重慶工商職業(yè)學(xué)院／H5的基本概念課程內(nèi)容／H5的誕生之路H5的基本概念PART1聊幾個(gè)有關(guān)H5的問題H5Why——我們?yōu)槭裁匆鯤5移動(dòng)傳播特性紙媒用戶／是單純的讀者信息傳播單向／被動(dòng)接受／互動(dòng)少PC用戶／通過跟帖與媒體進(jìn)行簡(jiǎn)單互動(dòng)移動(dòng)用戶／通過微博、微信、QQ是內(nèi)容生產(chǎn)者，社交化傳播H5基于Web的產(chǎn)品形態(tài)強(qiáng)互動(dòng)／可監(jiān)測(cè)／跨平臺(tái)／易傳播等優(yōu)勢(shì)為了傳播而生為了推廣宣傳內(nèi)容、活動(dòng)或品牌而制作為了盡可能最大化地引導(dǎo)用戶分享和回流Who——用戶是誰(shuí)70后-85后社交群體核心型用戶

85后-95后95后-00后成長(zhǎng)型用戶

潛力型用戶

60%微信用戶（15-29歲）每個(gè)年輕人平均有100多個(gè)好友社交渠道

What——優(yōu)質(zhì)H5的評(píng)判標(biāo)準(zhǔn)需要具備以下特質(zhì)主題傳播性／熱點(diǎn)／點(diǎn)擊欲／信息有效／激發(fā)想象力視覺表現(xiàn)力／張力／吸引用戶在移動(dòng)環(huán)境下停留產(chǎn)品形態(tài)及交互體驗(yàn)創(chuàng)新點(diǎn)／簡(jiǎn)單易用／獲得感／愉悅感／情感共鳴／分享意愿12010203第三層級(jí)能夠引發(fā)用戶情感共鳴，提升產(chǎn)品的品牌調(diào)性第二層級(jí)用戶的參與感強(qiáng)，分享意愿強(qiáng)第一層級(jí)信息傳播準(zhǔn)確有效到達(dá)、交互順暢舒適成功標(biāo)準(zhǔn)

How——怎么做一個(gè)H5產(chǎn)品策劃／用戶心理／視覺設(shè)計(jì)／動(dòng)效運(yùn)用／交互手段建立一個(gè)完整的H5設(shè)計(jì)思維體系確定制作方向后開始設(shè)計(jì)H5究竟是什么呢廣

義第5代HTML

解碼HTML瀏覽器HTML5簡(jiǎn)化而來(lái)呈現(xiàn)內(nèi)容H5最顯著的優(yōu)勢(shì)在于跨平臺(tái)交

互圖

表音

頻文

字圖

片動(dòng)

效插

畫視

頻H5H5的誕生之路PART2／H5發(fā)展前史課程內(nèi)容／H5為何產(chǎn)生／H5階段性發(fā)展“H5發(fā)展前史”90年代：前Flash時(shí)代的那些事一個(gè)不忍直視的網(wǎng)絡(luò)世界十幾年前：Flash來(lái)了視頻+音頻形式風(fēng)靡網(wǎng)絡(luò)幾年前：如日中天的Flash建站、媒體廣告，頁(yè)游不久以前：移動(dòng)互聯(lián)網(wǎng)時(shí)代降臨Flash將何去何從?AdobeJustTookaBigStepTowardsEndingFlash.2015-12-1“H5何時(shí)產(chǎn)生”Newopenstandardscreatedinthemobileera,suchasHTML5,willwinonmobiledevices(andPCstoo).移動(dòng)時(shí)代的新開發(fā)標(biāo)準(zhǔn)，如HTML5，將在移動(dòng)設(shè)備（及Pc設(shè)備）上獲勝?！猄teveJobsApril2010喬布斯的偉大預(yù)言業(yè)界巨頭的聯(lián)合驅(qū)動(dòng)Html5的定稿與修訂2014Html誕生2016Html5.1即將問世為什么是2014HTML5元年WiFi普及3G/4G發(fā)展“H5的階段性發(fā)展”純靜態(tài)頁(yè)面PPT放在／移動(dòng)端播放易企秀等模版型第三方平臺(tái)制作1、最初階段——“視覺設(shè)計(jì)”婚禮邀請(qǐng)函

場(chǎng)景和故事直觀感受移動(dòng)端碎片化2、發(fā)展階段——“視覺＋交互

”《史上最長(zhǎng)夜班車》

長(zhǎng)拉頁(yè)滑動(dòng)交互引入游戲游戲腳本設(shè)定互動(dòng)性加強(qiáng)3、引爆階段——“游戲引擎”《圍住神經(jīng)貓》

沉浸體驗(yàn)式的范游戲類交互式微電影故事創(chuàng)作／影視制作