H5新聞作品《出警！川A7536警向暴雨中心駛?cè)ァ分械某两絺鞑ナ址\析

文 王幸 王歡

H5是第5代HTML的縮寫，即用H5語(yǔ)言制作數(shù)字產(chǎn)品。目前，大部分網(wǎng)頁(yè)都是HTML做的，它不是什么新興技術(shù)，但是由于功能豐富加上各大瀏覽器都可以支持所以相比于以前的HTML4就得到了廣泛應(yīng)用。也就是說(shuō)大家所看到的網(wǎng)頁(yè)其實(shí)都是HTML代碼所呈現(xiàn)出的效果。而使用H5制作適合在手機(jī)等移動(dòng)端呈現(xiàn)的新媒體產(chǎn)品，也早已成為各媒體的基本技能。而在新聞?lì)怘5作品中，如何讓讀者能迅速地了解到新聞事件全貌，并且可以身臨其境地感受新聞場(chǎng)景，就成為了作品質(zhì)量高低的關(guān)鍵之一。筆者以2020年四川省新聞獎(jiǎng)一等獎(jiǎng)作品《出警！川A7536警向暴雨中心駛?cè)ァ窞榘咐?，分析了H5作品中的沉浸傳播手法。

作品生產(chǎn)過(guò)程

2019年8月20日凌晨，成都市大邑縣西嶺鎮(zhèn)云華村山洪暴發(fā)，有群眾被困，急需救援。西嶺派出所副所長(zhǎng)李科，輔警周正良、羅永紅立即駕駛川A7536警出發(fā)，不幸遇險(xiǎn)。李科、周正良犧牲，羅永紅當(dāng)時(shí)失聯(lián)（后確認(rèn)犧牲）。8月26日上午9點(diǎn)，李科、周正良兩位英雄的遺體告別儀式舉行。為了送英雄最后一程，成都日?qǐng)?bào)錦觀編輯部立即制作并推出H5作品《出警！川A7536警向暴雨中心駛?cè)ァ贰?/p>

作品邏輯遞進(jìn)

H5講述了一個(gè)真實(shí)發(fā)生的新聞故事。整個(gè)作品以黑白色為主基調(diào)，畫面從一片喧嘩的雨聲中開(kāi)始，緊接著畫面中響起了緊急的鈴聲，“雨勢(shì)很大，出現(xiàn)山洪，有群眾滯留，需要救援！”電話那頭打給派出所的緊急呼救，附上當(dāng)事者最后的電話錄音，仿佛身臨其境。緊接著，畫面中出現(xiàn)了警車徘徊在山路間，漆黑的夜里有飛石落下，山邊的河水不斷上漲的場(chǎng)景，這些場(chǎng)景將當(dāng)時(shí)環(huán)境的危險(xiǎn)性真實(shí)地體現(xiàn)了出來(lái)。在表現(xiàn)警察到達(dá)遇險(xiǎn)群眾聚集的地方進(jìn)行緊急疏散的場(chǎng)景時(shí)，畫面采用了4格漫畫的形式，將快速的對(duì)話進(jìn)行了緊湊的分割。

新聞的高潮在于第二次真實(shí)的通話錄音。當(dāng)三位英雄與指揮中心的通話突然中斷時(shí)，觀眾能感受到電話突然斷掉后的未知恐懼，并為出警警察的生命安全擔(dān)憂。

手繪部分結(jié)束后，緊接著呈現(xiàn)的是真實(shí)的照片，對(duì)英勇?tīng)奚木爝M(jìn)行身份介紹，并突出了事件的真實(shí)性。新聞的最后是村民、同事、親人想要對(duì)犧牲英雄們說(shuō)的話，新聞的真實(shí)與現(xiàn)實(shí)的結(jié)果，不用刻意渲染就能感染讀者，自然而然就對(duì)這幾位英勇?tīng)奚娜嗣窬飚a(chǎn)生深深的敬意。

作品交互特點(diǎn)

《出警！川A7536警向暴雨中心駛?cè)ァ饭?jié)奏緊張，在線性敘事的過(guò)程中實(shí)現(xiàn)了精準(zhǔn)剪輯和重點(diǎn)表達(dá)。作品采用“滑動(dòng)+點(diǎn)擊”這種最簡(jiǎn)單最直接的操作方式，讓讀者以最小的操作成本就可以獲取到“畫面+聲音+動(dòng)效+時(shí)間軸播放”的沉浸式互動(dòng)體驗(yàn)。在制作過(guò)程中，作者巧妙地將SVG（可縮放矢量圖形）與canvas等多項(xiàng)技術(shù)結(jié)合運(yùn)用，既保障了作品體驗(yàn)的順暢感，又在整體時(shí)間軸的重要節(jié)點(diǎn)上用慢放等形式強(qiáng)調(diào)細(xì)節(jié)，使作品的層次感突出，感情表達(dá)強(qiáng)烈有力。

作品定位為第三人稱視角，前半部分主要采用了手繪故事的形式，H5技術(shù)將所有畫面片段串起來(lái)的同時(shí)，也賦予了作品動(dòng)效和聲效，讓定格的手繪場(chǎng)景動(dòng)了起來(lái)、活了起來(lái)，場(chǎng)景表達(dá)自然且生動(dòng)。作品后半部分則采用了“真實(shí)圖片+文案”的基本元素，在滑動(dòng)交互中展現(xiàn)不同角度的人物故事，將人物形象表現(xiàn)得更加豐滿。

作品的感情渲染在漫畫手繪與真實(shí)照片資料無(wú)縫切換時(shí)達(dá)到高潮，讓讀者突然發(fā)覺(jué)“漫畫”其實(shí)就是真實(shí)事件，這種“從虛擬到真實(shí)”的劇本處理方式也進(jìn)一步加深了讀者心中的情感迸發(fā)。同時(shí)作品在音效的處理渲染中巧妙結(jié)合時(shí)間軸中的關(guān)鍵節(jié)點(diǎn)，進(jìn)一步突出作品高潮和情緒爆點(diǎn)，增強(qiáng)感染力。

作品傳播效果

習(xí)近平總書(shū)記曾指出，講中國(guó)故事是時(shí)代命題，講好中國(guó)故事是時(shí)代使命。該作品基于現(xiàn)代網(wǎng)絡(luò)、智能手機(jī)等基礎(chǔ)條件，運(yùn)用H5交互設(shè)計(jì)技術(shù)創(chuàng)新講故事的方式方法，讓英雄故事深入人心、讓英雄精神直抵人心。

該作品一經(jīng)發(fā)出，就在社會(huì)各界引起廣泛傳播轉(zhuǎn)發(fā)。僅在發(fā)布后24小時(shí)內(nèi)，該H5總瀏覽量就達(dá)到了11.4萬(wàn)，流量不僅覆蓋全國(guó)各地各省份，還包括紐約、東京等國(guó)外城市。截至目前，該作品全網(wǎng)瀏覽量超20萬(wàn)，還得到了中央政法委官方微信公眾號(hào)“長(zhǎng)安劍”等平臺(tái)轉(zhuǎn)發(fā)傳播。

產(chǎn)品通過(guò)最簡(jiǎn)單的“豎向滑動(dòng)+點(diǎn)擊”的互動(dòng)操作，運(yùn)用SVG（可縮放矢量圖形）與canvas等多項(xiàng)技術(shù)，將文字、照片、手繪、場(chǎng)景聲效、人物音頻、背景音樂(lè)、漸進(jìn)式動(dòng)畫等要素協(xié)調(diào)交融在模擬場(chǎng)景中，創(chuàng)造了一個(gè)沉浸式的體驗(yàn)環(huán)境，給人以真實(shí)的臨場(chǎng)感。該作品主題鮮明，集中所有形式和元素展現(xiàn)基層干警一心為民、忘我工作、不怕?tīng)奚木?；該作品布局完整、?jiān)持創(chuàng)新，將三位英雄的故事從出警到犧牲的全過(guò)程一一展現(xiàn)；該作品高度融合技術(shù)和藝術(shù)，在運(yùn)用現(xiàn)代技術(shù)講好故事的同時(shí)，也打造出一個(gè)網(wǎng)絡(luò)平臺(tái)，讓不能到現(xiàn)場(chǎng)送別英雄的人能通過(guò)網(wǎng)絡(luò)和手機(jī)回顧英雄事跡、向英雄致敬。

畫面的美術(shù)表達(dá)

要想讓讀者在閱讀作品時(shí)的沉浸感更強(qiáng)，除了要控制好作品的邏輯遞進(jìn)、把握好敘事節(jié)奏外，畫面的表現(xiàn)力也將直接影響讀者的觀感體驗(yàn)。一個(gè)好的美術(shù)設(shè)計(jì)可以將作者想要表達(dá)的情感融入進(jìn)線條元素與畫面色差等美術(shù)表達(dá)中，從而使讀者通過(guò)視覺(jué)元素就能體會(huì)到作品的情感。

線條元素的當(dāng)代用法

H5當(dāng)中的畫面設(shè)計(jì)運(yùn)用了傳統(tǒng)美術(shù)的點(diǎn)線面中的線為基礎(chǔ)內(nèi)容之一，不同的畫面用線條來(lái)表達(dá)，其有著完全不一樣的結(jié)果。例如直線的緊密寫實(shí)、細(xì)線的虛擬委婉、曲線的婉轉(zhuǎn)陰柔等，以及畫面中線條之間的虛實(shí)結(jié)合、輕重緩急。讓整體畫面有著抑揚(yáng)頓挫的視覺(jué)感受。場(chǎng)景人物畫面都用線條來(lái)表現(xiàn)，那線條會(huì)給讀者帶來(lái)怎樣的感受？以下用3個(gè)不同應(yīng)用來(lái)舉例：

例1：粗細(xì)線條的合理搭配

在《出警！川A7536警向暴雨中心駛?cè)ァ返膱?chǎng)景一里面有個(gè)西嶺派出所的畫面表達(dá)，用粗細(xì)結(jié)合的直線條來(lái)表達(dá)公正且莊嚴(yán)的場(chǎng)景，細(xì)線條和粗線條結(jié)合能使畫面更加柔和。

例2：婉轉(zhuǎn)的曲線和簡(jiǎn)潔線條的用法

婉轉(zhuǎn)的線條勾勒能變換出不同維度的畫面，在中西式畫風(fēng)的不同分割下，線條的委婉柔和有著不同的理解，例如錢選的山水畫《浮云山居圖》用簡(jiǎn)單的線條勾勒山石，用細(xì)筆勾勒出樹(shù)木枝干，更多的留白營(yíng)造出云淡風(fēng)輕的意境。而西方的線條表達(dá)多用女性婀娜多姿的體態(tài)，來(lái)表達(dá)曼妙柔美的視覺(jué)觀感，例如西班牙畫家畢加索的《夢(mèng)》用粗線條婉轉(zhuǎn)地表達(dá)了女人身體的外部輪廓，留給觀者想象空間和思維的自由性。

例3：虛實(shí)結(jié)合的線條運(yùn)用方法

虛實(shí)結(jié)合的用法廣泛運(yùn)用在了藝術(shù)表達(dá)中，我們可以在很多藝術(shù)領(lǐng)域都能看見(jiàn)，比如動(dòng)畫電影《心靈奇旅》，動(dòng)畫人物用簡(jiǎn)單的線條勾勒卻能有豐富的表情變化和性格特征，虛實(shí)結(jié)合線條元素打破了本來(lái)單一線條局限的條件，再加上畫面背景的配合，將動(dòng)畫人物勾勒出傳神的視覺(jué)感受，將一些只能用語(yǔ)言表達(dá)解釋的詞用視覺(jué)的方法來(lái)表達(dá)，將線條賦予生命和性格。

美術(shù)構(gòu)圖方式在H5動(dòng)畫中的運(yùn)用

畫面中想要表達(dá)的主要內(nèi)容可以通過(guò)不同的構(gòu)圖布局來(lái)彰顯藝術(shù)表現(xiàn)力，處理好畫面的加減法讓主題得到更好的表達(dá)，讓情節(jié)效果得到更多強(qiáng)調(diào)，例如傳統(tǒng)中國(guó)水墨動(dòng)畫《小蝌蚪找媽媽》，簡(jiǎn)單的荷葉元素、顏色深淺不一的色塊表現(xiàn)石頭，不用過(guò)多對(duì)水的刻畫就能有活靈活現(xiàn)的小蝌蚪們?cè)谒锎┧蟮漠嬅娓小?/p>

顏色搭配在H5動(dòng)畫設(shè)計(jì)中的運(yùn)用

H5動(dòng)畫設(shè)計(jì)中顏色搭配主要傾向于劇情和人物性格的判斷，顏色能夠代表人物的性格特征和畫面的主要情感色彩，比如：黨政人物記事類采用深紅色最為莊重，科技展示類動(dòng)畫表現(xiàn)多為藍(lán)色或深紫色，文化類故事講述采用銀色或淡金色。以澎湃H5作品《天渠》中的顏色搭配應(yīng)用為例，總基調(diào)是黑色，仿佛在遙遙無(wú)期的黑暗中尋找到了一絲光，順著微弱的光線逐步講故事。整個(gè)H5采用黑白灰金的4個(gè)簡(jiǎn)單的色彩，并且人物從黑色逐漸過(guò)渡為白色成為畫面中心，推動(dòng)著劇情的發(fā)展，畫面由暗到亮推動(dòng)著H5講述時(shí)情緒的發(fā)展，而黑白的明亮對(duì)比又能營(yíng)造更加真實(shí)的場(chǎng)景氛圍。

當(dāng)前，H5雖然是一種較為新興的網(wǎng)絡(luò)呈現(xiàn)方式，但在視覺(jué)設(shè)計(jì)中依舊滲透著傳統(tǒng)美術(shù)的表達(dá)模樣，依舊嫁接、模仿了傳統(tǒng)美術(shù)中的精髓，從而繼承其中的優(yōu)良藝術(shù)精神，既符合現(xiàn)代人的審美觀，又不失傳統(tǒng)美術(shù)的文化底蘊(yùn)。當(dāng)代的審美藝術(shù)在不斷前行、開(kāi)拓創(chuàng)新，我們要不斷吸收著前人的經(jīng)驗(yàn)并創(chuàng)造出屬于自己時(shí)代的藝術(shù)作品。