打開這幅手繪長卷，帶你一起“川”越5年！

作品標(biāo)題

打開這幅手繪長卷，帶你一起“川”越5年！

參評項目

網(wǎng)頁設(shè)計

語種

?

刊播網(wǎng)站

四川在線

首發(fā)日期

2017年05月01日

網(wǎng)頁地址

http://topic.scol.com.cn/2017/17huajuan_m/huajuan.html

字?jǐn)?shù)

?

主創(chuàng)人員

鐘嵐、張運驕、陳晨、沈曉穎、陽博、劉暢

編輯

?

頁面點擊量（PV）,單獨訪客數(shù)（UV）,獨立地址訪問量（IP）

629010?,??110508?,??105657

采編過程
（作品簡介）

　　2017年5月23日，四川省第十一次黨代會召開前一天，四川日報微博微信聯(lián)合四川在線提前策劃，隆重推出《打開這幅手繪長卷，帶你一起“川”越5年》手機端網(wǎng)頁作品，精心的網(wǎng)頁設(shè)計，不但引爆四川人朋友圈，更在微博上被21市州政務(wù)、媒體官微轉(zhuǎn)發(fā)，總傳播數(shù)據(jù)高達百萬人次，成為一款現(xiàn)象級產(chǎn)品。 四川省第十一次黨代會召開前一個半月，主創(chuàng)團隊確定用“手繪畫卷”的方式來展現(xiàn)四川過去五年恢弘成就，為此邀請到川籍畫家郭勁松參與，并用兩周時間準(zhǔn)備文圖素材，四川在線技術(shù)部持續(xù)跟進，把畫家的畫作通過處理連接在一起，并以H5技術(shù)為基礎(chǔ)，提取其中關(guān)鍵圖像元素為原件，制作動畫交互效果，整個制作周期超過1個月，各部門通力協(xié)作，確保了產(chǎn)品如期推出。 該作品運用了當(dāng)時最先進的“交互技術(shù)”，用色彩水墨風(fēng)格的畫卷形式，以多場景動態(tài)H5無縫連接方式，展示四川5年來各個領(lǐng)域的發(fā)展和巨大變化。翻動觀看的畫卷結(jié)合彩蛋式的場景小動畫互動操作，生動直觀地把四川過去5年來各個領(lǐng)域的巨大變化進行了完美呈現(xiàn)。 整個畫卷以水墨風(fēng)結(jié)合場景動畫的交互，摒棄了傳統(tǒng)網(wǎng)頁的結(jié)構(gòu)，用“簡約的操作方式 生動的畫面表現(xiàn)”構(gòu)成了這一超長畫幅式的特殊網(wǎng)頁設(shè)計，讓人眼前一亮。無論是技術(shù)支撐還是表現(xiàn)形式，都屬“創(chuàng)新突破”。產(chǎn)品一經(jīng)推出，就受到全國眾多官方微信爭相效仿，成為2017年的H5制作新潮流，持續(xù)至今。

推薦理由

　　該H5作品以手繪長卷的方式，融入GIF動畫作為“彩蛋”增強趣味性來吸引受眾參與傳播，立體呈現(xiàn)蘆山地震災(zāi)區(qū)三年重建、四川自貿(mào)試驗區(qū)掛牌、成都天府國際機場開建等15個場景，形成恢弘長軸畫卷，以一鍵滑動的便捷方式，輕量化的閱讀體驗助受眾輕松回顧四川過去5年在政經(jīng)民生領(lǐng)域的大事件，網(wǎng)頁設(shè)計讓人眼前一亮。引發(fā)網(wǎng)友們的共鳴和反響熱烈，在微信朋友圈中廣泛傳播。我單位同意推薦。

初評評語

　　該作品頁面設(shè)計感強，富有創(chuàng)新，重視交互，有較強的網(wǎng)絡(luò)特色。作品名稱利用“川”與“穿”諧音，既明確地域范圍，又扼要地表明內(nèi)容。同時該作品頗具創(chuàng)意，以手機面板設(shè)計成邊框，將主要內(nèi)容以畫卷形式呈現(xiàn)在“手機屏幕”內(nèi)，用戶可以通過左右拖動畫卷，借助水墨風(fēng)格的畫卷了解四川這五年的發(fā)展。此外，該作品重視場景化搭建，用戶在滑動畫卷時可選擇在不同場景進行簡易操作，有較強的交互性，便于用戶理解接受。