張 璇?。斞该佬g(shù)學(xué)院　116650）

一、項(xiàng)目的選題背景和前期調(diào)研

（一）《數(shù)據(jù)之美遼寧》網(wǎng)站的選題背景

在這個數(shù)字化生活的時代，互聯(lián)網(wǎng)已經(jīng)成為信息傳播的主流載體之一。智能化可操作移動設(shè)備、移動應(yīng)用程序互動體驗(yàn)逐漸成為人們不可剝離的生活必須，包括動態(tài)網(wǎng)站信息成為當(dāng)今Web應(yīng)用的潮流。本課題研究用戶互動頁面動態(tài)效果生成和信息的整合性體驗(yàn)，現(xiàn)今更多的APP應(yīng)用和網(wǎng)站設(shè)計強(qiáng)化圖形信息的多樣性并將更多的人機(jī)交互體驗(yàn)，優(yōu)秀的操作界面具有用戶使用更簡單、反映用戶興趣愛好更明顯細(xì)致等優(yōu)點(diǎn)。全球新媒體產(chǎn)業(yè)的日趨活躍，技術(shù)演進(jìn)和應(yīng)用創(chuàng)新的加速發(fā)展，使各國政府逐漸認(rèn)識到新媒體在推動經(jīng)濟(jì)發(fā)展、改善公共服務(wù)，增進(jìn)人民幸福感。新媒體將傳統(tǒng)藝術(shù)作品從美術(shù)館、博物館、展廳走向公共廣場以及各種城市空間，或是虛擬的網(wǎng)絡(luò)平臺。藝術(shù)家的這些舉動無形中加強(qiáng)了城市的活性化。以城市本身作為藝術(shù)的表現(xiàn)主題，將“提高國家文化軟實(shí)力，要加強(qiáng)國際傳播能力建設(shè)，精心構(gòu)建對外話語體系，發(fā)揮好新興媒體作用，增強(qiáng)對外話語的創(chuàng)造力、感召力、公信力，講好中國故事，傳播好中國聲音，闡釋好中國特色。這里面不難看出，新興媒體以及新興媒體傳播平臺建設(shè)的重要性。數(shù)據(jù)化媒體的再利用再建設(shè)可以更好的服務(wù)于遼寧省政治、經(jīng)濟(jì)、文化建設(shè)，推進(jìn)良性的文化發(fā)展。

（二）網(wǎng)站的創(chuàng)作思路和目標(biāo)人群

《數(shù)據(jù)之美遼寧》網(wǎng)站是基于移動客戶端的網(wǎng)站，主要功能是從90后的視角記錄遼寧，帶著大家認(rèn)識有趣的遼寧。項(xiàng)目組9個成員從不同的角度切入，分析沈陽、大連市人文、生活等方面的內(nèi)容。從一個微小的內(nèi)容點(diǎn)著手，在數(shù)據(jù)收集整理和分析的基礎(chǔ)上， 通過設(shè)計的手段得出可視化的圖形，并在此基礎(chǔ)上進(jìn)行網(wǎng)站的界面設(shè)計。

網(wǎng)站的目標(biāo)受眾是20—40青年人為主（包括7歲以上兒童及所有想要了解不一樣的遼寧的人）。

（三）市場調(diào)研/分析

目前主要是資源分享類網(wǎng)站對某地的環(huán)境人文進(jìn)行介紹，但是從數(shù)據(jù)的角度出發(fā)宣傳某一地方特色的網(wǎng)站相對較少，從90后視角關(guān)注遼寧大連、沈陽的城市人文、歷史、飲食、語言等方面的分享類網(wǎng)站幾乎還是空白。比如《城》網(wǎng)站講述大連的廣場文化是大連地標(biāo)式建筑特色，從數(shù)據(jù)的角度整理出各個廣場不同的參數(shù)和特點(diǎn)分析比較便于用戶深入的了解廣場文化的不同層面。

總結(jié)數(shù)據(jù)分享類網(wǎng)站的特征分析出：

1.圖文結(jié)合數(shù)據(jù)分析直觀有效的傳遞信息

2.視角獨(dú)特，從一個小點(diǎn)出發(fā)深入挖掘

3.加入動態(tài)圖形效果豐富視覺層次

4.卡片分欄方式，清晰便于快速瀏覽信息

二、流程圖

網(wǎng)站的流程圖

圖例1：《數(shù)據(jù)之美遼寧》網(wǎng)站流程圖

三、《數(shù)據(jù)之美遼寧》網(wǎng)站界面設(shè)計及創(chuàng)作思路

（一）網(wǎng)站的整體風(fēng)格分析

1.網(wǎng)站標(biāo)識及衍生圖形設(shè)計

網(wǎng)站的標(biāo)識數(shù)據(jù)之美遼寧是根據(jù)一種星狀數(shù)據(jù)類圖形設(shè)計的，體現(xiàn)了文字的內(nèi)涵。將衍生圖形應(yīng)用到網(wǎng)站的圖標(biāo)設(shè)計中去，使得整個設(shè)計具有數(shù)據(jù)的美感。

2.網(wǎng)站的一級界面設(shè)計

網(wǎng)站的一級界面導(dǎo)航分成首頁、關(guān)于項(xiàng)目、項(xiàng)目成員三欄，主頁布局上至下分為三個部分分別為頁面標(biāo)題及導(dǎo)航區(qū)、通欄超鏈接推送、頁面內(nèi)容區(qū)（項(xiàng)目網(wǎng)站）。

3.網(wǎng)站項(xiàng)目組界面設(shè)計

網(wǎng)站項(xiàng)目組界面有9組。成員們選題后收集相關(guān)信息并對其分析整理成數(shù)據(jù)并將數(shù)據(jù)進(jìn)行可視化設(shè)計，在這個基礎(chǔ)上設(shè)計制作和發(fā)布相關(guān)的頁面。9組設(shè)計都有著鮮明的風(fēng)格和特色。比如其中《時節(jié)印象》是以大連的特色節(jié)日為題材，重點(diǎn)分析討論大連節(jié)日活動內(nèi)容，以及數(shù)據(jù)的可視化圖案，在考察時對大連節(jié)日數(shù)據(jù)的收集，大連一年之中地方特色節(jié)日主要有八個，從旅游的方面切入，整理相關(guān)圖案，分析網(wǎng)站服務(wù)人群，及同類網(wǎng)站的交互研究與分析，創(chuàng)作過程中的數(shù)據(jù)采集，用戶心理分析，數(shù)據(jù)可視化，將插畫風(fēng)格的圖形融于頁面設(shè)計中形成獨(dú)特的設(shè)計風(fēng)格進(jìn)行設(shè)計。

（二）網(wǎng)站的交互設(shè)計

1.界面布局的不同

比如在《時光碼頭》的設(shè)計中，一級界面為首頁，單屏呈現(xiàn)，動態(tài)圖案與文字相結(jié)合，以報紙的風(fēng)格排版，邊框和暗紋相結(jié)合，把主次內(nèi)容通過圖形圖案分開，很容易讓觀者識別；二級界面多以小標(biāo)題的方式呈現(xiàn)，把三級界面中的文字歸納總結(jié)，二級界面的排版有疏有密，文字大小不同，突出主次，兩段文字之間有插圖作為輔助，增添趣味；三級界面多以文字和圖案為主，主要介紹的圖案占接近一屏的面積，輔助的圖形穿插在文字段周邊，讓觀者很容易分清主要內(nèi)容是什么。所有的界面設(shè)計，主要內(nèi)容都放在了“最佳視域”的位置，符合觀者的視覺方向，盡量做到滿足大部分人的視覺。

2.導(dǎo)航及輔助圖標(biāo)

按鈕及輔助圖標(biāo)在頁面中起到引導(dǎo)用戶瀏覽點(diǎn)擊的作用，具有交互的功能。特別是用在導(dǎo)航中，用圖形的語言直觀有效的傳遞導(dǎo)航每一欄的信息。比如項(xiàng)目組《逮味兒》網(wǎng)站，做的是一個大連特色美食的網(wǎng)站，但這也不是一個單純的美食網(wǎng)站，它還加入了一個新鮮元素大連方言。網(wǎng)站名叫：逮味兒，這個名字就是結(jié)合了大連話所取出來的，體現(xiàn)了地方特色。首頁網(wǎng)站導(dǎo)航欄按鈕是結(jié)合大連當(dāng)?shù)氐牟似愤M(jìn)行的圖形元素設(shè)計。線框式的圖標(biāo)與手繪的配圖形成了有趣的對比。

圖例2　網(wǎng)站導(dǎo)航欄按鈕

（三）網(wǎng)站的數(shù)據(jù)可視化設(shè)計

1.數(shù)據(jù)的收集整理

確定主題后，項(xiàng)目組成員通過不同的方式收集整理數(shù)據(jù)。比如項(xiàng)目組《漁燈影草》研究方法主要以訪調(diào)查走訪的形式，對周邊的住戶，漁民進(jìn)形一對一訪問，在訪問過程中以錄音，筆錄的形式記錄調(diào)查。調(diào)研的內(nèi)容主要包括周圍的地形，漁民的生活習(xí)俗，金石灘碼頭船運(yùn)情況，金石灘港漁船數(shù)量，金石灘海域有哪些海鮮以及周邊人口分布情況。通過實(shí)地的考察得出結(jié)果，最后再經(jīng)過分析整理得出相關(guān)數(shù)據(jù)。

2.數(shù)據(jù)可視化設(shè)計

數(shù)據(jù)的圖形化一般會具備以下幾個特點(diǎn)：準(zhǔn)確性、創(chuàng)新性和簡潔性。其目的是要對數(shù)據(jù)進(jìn)行可視化處理，以使得能夠明確地、有效地傳遞信息。在項(xiàng)目組《漁燈影草》網(wǎng)站中數(shù)據(jù)圖形化集中體現(xiàn)在訪問數(shù)據(jù)頁面中，數(shù)據(jù)的內(nèi)容分布有：廟上村漁民年齡的分布圖，本地人口與外地人口環(huán)形圖，金石灘港客運(yùn)信息，漁民收入，漁民打漁的時間圖，金石灘港周圍地圖，以及漁民使用大船小船的航行的時間公里圖。比如：年齡分布圖：表現(xiàn)方法；年齡分布圖是以漁民頭像為設(shè)計元素，用不同深淺的藍(lán)色代表不同的年齡階段的漁民，依次按照采集數(shù)量成比例排列。特點(diǎn)；用戶可以根據(jù)頭像的顏色直接去讀數(shù)據(jù)。

圖例3　數(shù)據(jù)圖形，漁民年齡分布

3.動態(tài)圖形信息設(shè)計

動態(tài)圖標(biāo)可以應(yīng)用于導(dǎo)航按鈕、gif動態(tài)圖片以及頁面中圖標(biāo)按鈕。隨著這些動起來的圖標(biāo)出現(xiàn)在網(wǎng)頁設(shè)計中，給網(wǎng)站的功能增加了很多的趣味性，使機(jī)器和人的交流互動不再枯燥，用輕松有趣的方式引導(dǎo)用戶瀏覽視線。

比如項(xiàng)目組《漁燈影草》網(wǎng)站中漁船航行時間圖，其表現(xiàn)方法分別以木船，和漁民打漁的大船為元素把船設(shè)計成圖形，結(jié)合海浪線，并做成動態(tài)，讓船自然地移動到各自的終點(diǎn)處，代表了木船和大船的航行時間差。特點(diǎn)；動態(tài)的效果，增添趣味性。

四、結(jié)語

在項(xiàng)目創(chuàng)作過程中，結(jié)合我省城市規(guī)劃理念，形成統(tǒng)一的思想情感和創(chuàng)作思路；在題材的選擇上進(jìn)一步拓展形成城市新的文化精神增長點(diǎn)；利用社會化媒體的傳播優(yōu)勢，打造我省經(jīng)濟(jì)、文化、人文精神、城市精神的新視角；拓展新媒體視覺形態(tài)，塑造城市形態(tài)特征在人們心中的主觀印象。數(shù)據(jù)可視化設(shè)計是一門綜合了美學(xué)、設(shè)計藝術(shù)學(xué)、傳播學(xué)、計算機(jī)學(xué)等多種學(xué)科的藝術(shù)，在進(jìn)行設(shè)計和研究時會發(fā)現(xiàn)它交叉運(yùn)用著其他學(xué)科，正逐步走向數(shù)字化、信息化，從靜態(tài)向動態(tài)轉(zhuǎn)化，從單一的表現(xiàn)形式向多元表現(xiàn)形式轉(zhuǎn)化，從二維設(shè)計向三維思維轉(zhuǎn)化。同時，它與受眾的互動性也正逐步加強(qiáng)，與觀眾進(jìn)行溝通，拉近普通受眾與藝術(shù)的距離。項(xiàng)目組成員的九組作品從90后的視角出發(fā)，表達(dá)對他們生活了四年的城市遼寧大連以及沈陽的感受和情感，創(chuàng)作出有溫度有趣味的作品。并通過數(shù)據(jù)化圖形設(shè)計讓更多的用戶深入了解每個項(xiàng)目點(diǎn)。

經(jīng)過反復(fù)的推敲、從選題到數(shù)據(jù)收集整理再到網(wǎng)站界面設(shè)計：dataliaoning.com一個關(guān)于遼寧的數(shù)據(jù)可視化網(wǎng)站誕生了！