今天透過社群平台,一直不斷看到Milwaukee Police Department美國密爾瓦基警新聞網站的曝光,許多看懂門道的朋友們會描述網頁設計技術透過 Vertical Parallax Scroll 呈現特別,而看不懂技術設計門道的我,就是湊熱鬧的瀏覽網站後,尋找相關的媒體或推測背後如此令人驚艷設計的創意從何而來。

第一眼看到網站首頁配置讓我想到了美國犯罪影集節目。如果沒有特別提醒,還真的以為是美國有新警匪影集上映。滑鼠往下瀏覽後,串場視覺設計不諱言地讓我有種在看24或NYPD之類的節目,但其實這網站呈現的是密爾瓦基警察的工作內容和市政資訊,透過有圖有工作真相的即時資訊呈現,完成警察局給市民的公開市政資訊宣導,讓枯燥難用的犯罪數字透過美化後的設計,讓更多人容易理解。

2012-08-29_相當有電影特色的過場視覺


印象中的美國政府類型的官方網站宣導,大概都有固定的公版配置與來自首長的問候之類的設計,所以一看到這為了公關設計的密爾瓦基警網站後,也是先去Google相關資訊,然後發現警察局本身仍保有舊版的配置,但卻利用新版公關使用的網站素材呈現資訊,或者也兼顧了保守和現代兩種潮流的思考。

簡單介紹Milwaukee County,這座城市位在美國的威斯康辛州,主要人種組成是白人為主,郡內有舉世聞名的Oak Creek(橡樹溪)紅岩峽谷美景,而Milwaukee Police Department成立於1855年,在2012年8月初發生了震驚國際的錫克廟7死30傷的槍擊案後,成為美國對持槍文化政府無作為和宗教暴力的負面案例,也因此讓這座城市蒙上陰影。

 本新聞網站的網址是.com結尾:http://www.milwaukeepolicenews.com/,和官方的http://city.milwaukee.gov/police (.gov)不同,但看起來應該是有授權或與民間合作的關係。



對於這網站首頁登入的配置,一口氣披露瀏覽重點訊息:正在進行的工作、通緝犯查詢和市政報告,回到會使用這網站的目標對象,應該就是新聞記者和對於安全有疑慮的人,所以這些資訊被列為重點,相當恰當。少了官方無謂的繁雜訊息,只提供最主要且跟自己周遭最有關係的資訊,其實相當把使用者放在設計思考的一環,也巧妙地包裝想佈達的公開訊息。

網站首頁-HOME:以"警察工作"為主的配置,清楚標示網站建置的目的。而整體的照片視覺呈現都讓我想到NCIS,右方的導覽列會隨著滑鼠移動,隨時可以做選單切換

2012-08-29_首頁   右邊的導覽列清單,在設計上文案淺白易懂,而且還搭配了圖片顯示,活潑了導覽列的顯示方式,卻又不花稍

2012-08-29_一點都不馬虎的導覽列設計  the source:透過the source可以清楚看到警察的日常工作,最近大事或過去的重點工作,固定的大標+前言+日期,可清楚知道網站更新的速度和最新的工作重點,想看更多,只要點選感興趣的區塊就能在同頁的視窗瀏覽完整的內文報導。

2012-08-29_有圖有真相的工作  想找過去的歷史資料,只要點選左方文字下的年代,會滑出月份的導覽,儘管沒有明顯的視覺區隔,但因文字配置都相當清楚,所以不難吸引網友點選。內容的部份可以清楚知道這則訊息的目的、日期、有圖文或只有圖等內容。

2012-08-29_日期列表  

THE STATS:這是有關犯罪統計的數字顯示,只呈現最重要的犯罪數字(如逮捕、暴力犯罪、查獲多少槍枝)等數字搭配相關視覺設計,讓民眾了解警察局的公開績效。

2012-08-29_資訊視覺的圖片設計  MOST WANTED:正在通緝的嫌犯列表,搭配持槍的警察視覺設計,其實頗妙。而且從人物比例的配置來看,這一頁相當清楚明確地表達了反恐的宣告。

2012-08-29_通緝要犯加上了警察  Heros:既然都有通緝犯的清單,當然不能少了英雄有多努力工作的宣達,採取報導的方式設計表揚警察大人們的工作細節。

2012-08-29_英雄的故事甚至還列出隕落英雄清單,這也是全網站唯一設置了<社群平台推薦>的地方,同時從這裡也能窺見美國文化縮影。

2012-08-29_隕落的英雄12012-08-29_隕落的英雄2  

About:最後來到了關於我們的資訊,簡單列出MPD警局的重要里程碑,更設計了最常被詢問的警民互動FAQ問答。

2012-08-29_年代表和faq  其實美國的警察局長派命多半需通過選舉才有機會勝出,所以炸看到這個網站設計時,真的有種應該是選舉花招之類的策略規劃,不過透過Check Out the Milwaukee Police’s Mind-Blowing, Crime-Busting Site的評論,發現這網站的規劃是透過市民們討論的最終成果,更希望能透過即時的資訊互動來預防犯罪。甚至未來將以此網站作為主要的新聞發佈管道,全然以親民為主。只能說以這樣的網站呈現回歸到美國的警察與選舉文化,真的相當有巧思與『有圖有真相真的有在工作』的示範。

2012-08-29_串場動畫2~據說有3d特效2012-08-29_串場動畫3~我們嚴正為市民們服務  以上圖片來源均為:Milwaukee Police Department網站截圖


另外Milwaukee Police Department也設有粉絲專頁與更多民眾互動和呈現即時的訊息,稍微瀏覽後,比較讓我吃驚的應該就是專頁的經營者竟然可以直接用手機寫故事,相當厲害耶!

2012-08-29_粉絲專頁  

【企劃書練習_人類使用版】從Milwaukee Police Department網站練習提案 

 

arrow
arrow

    Phoebeitravel 發表在 痞客邦 留言(0) 人氣()