百度遷徙數據可視化項目開發幕后

發布:egoldy    時間:2014-02-02 23:51:15


          隨著百度公司的品牌項目-百度遷徙的上線,引爆了整個2014年的春運話題點,也讓眾多業內人士對于百度2014年春節如何表現有了答案。百度通過百度遷徙這個品牌項目,與央視1套,4套,13套等媒體合作“據說春運”節目,使用大數據的視角來查看春運人口的移動的情況,一方面實現了新技術的接地氣,為更 多的用戶服務,另一面充分的拉近了百度和老百姓的心的距離。百度贏得了用戶,更獲得了業內人士認可,整個互聯上一片好評。做為開發者的我們,我們要給百度一 個好評,有網友評論,它是蛇年最牛逼的一個產品,而且是沒有附帶任何其它推廣的牛逼產品。如果您對此項目的開發過程有興趣,請往下看


           萬博思圖做為可視化開發公司,百度遷徙項目是5年來用戶訪問最多,用戶受益最多的一個項目,傳播最廣最有影響力的一個項目。盡管之前三年所做的項目多數為 京城大領導參觀演示所做,相比之下,我們做為開發人員,開發有更多受益用戶的項目讓我們有更大的滿足感。

           言歸正傳,隨著百度遷徙項目的上線,越來越多的朋友,網友問我們是如何實現的,是不是很難,怎么做到的。這里面我們打算寫出我們的基本思路和項目的開發過程,以享對此項目有興趣的網友。

一, 需求與時間的沖突

        項目的早期需求并不是只停留在中國地圖版塊上的,而是可以深入到每個省的版塊,基本上是一個總分總的鏡頭深入的交互效果。而且還會有白天和黑夜的效果。如下圖為早期的示意圖形。


/media/upload/2014/02/02/baidu2_small.jpg
/media/upload/2014/02/02/baidu1_small.jpg


但是這個需求沒有多長時間就被推翻了,考濾到時間不足,因此最終決定只保留了全國的地圖版塊而省去與各省版塊的交互操作。于是誕生了第二版本:

/media/upload/2014/02/02/TOP10.jpg

/media/upload/2014/02/02/7TOP10.jpg

當你看到這個位置時,你肯定已經知道最終的樣子并不是這樣的,設計師都很苦逼,你懂得的,設計不但要具備高水平的設計能力,還要有不能摧毀的耐心:).個中的痛苦不在多述,如果你也是設計師,你會明白。

從 上圖看,最終效果并不是與設計圖一致,原因有二個,第一,對于萬級數據,設計是無法繪制的,設計師能做的就是示意,這里也是開發的關鍵,在設計過程中與開 發人員進行了充分的溝通,也就是說開發人員要有一定的想象力和美術鑒賞力。第二,原稿中出的三次曲線,但最終客戶想要的是二次曲線,模擬航線效果。

二,開發就是一個雕琢的過程,就象藝術品一樣.

       為什么說開發就是一個雕琢過程,原因有三:

       1,具體的效果在設計師和開發人員的腦子里,你不知道什么樣,我也不知道。需要一步一步的雕琢。

       2,數據級別是萬級數據量,雖然每小時呈現量還沒有達到100萬級別,但是對于繪制性能仍然要有很高的要求,當發生沖突時,是犧牲性能還是犧牲效果,需要一步一步雕琢。

       3,對于百度用戶這種級別的訪問量和并發量,后臺數據圖生成的穩定性重于一切,手機版雖然只提供了讀圖功能,但是后臺我們提供了一個強大的穩定的圖形生形器。

      以上即為開發過程中的難點,1月4日正式開發,我們的開發人員開始了雕琢過程,我們曾在微博上直播過開發過程。如下圖:

第一次連線實驗效果

/media/upload/2014/02/02/baidus1.jpg
 

第一次弧線實驗

/media/upload/2014/02/02/baidus2.png/media/upload/2014/02/02/baidus3.png

第一次排名就位實驗:

/media/upload/2014/02/02/baidus5.jpg
 

上述的幾個圖形都是講述在開發過程中的第一次。值得慶興的是不管我們背后實驗多少次,在1月13號第一次提交時,客戶非常滿意,這是我們值得欣慰的。在接下為數不多的時間里我們主要的任務集中在如何讓前端的性能更流暢,讓系統運行的更穩定。大體上的開發思路是是前端讀取捷報數據推送過來的百度lbs數據,前端讀取的是json接口數據。在前端flash中進行解析,繪制連以及曲線。編寫排名邏輯,時間選擇,日期選擇邏輯等等。

三,手機端-強大穩定的圖形生成器。

因為時間關系,手機端沒有時間開發成app ,在項目開發之初,曾討論過到底是用flash開發還是用 html5 開發,但在有限的時間內,我們最終決定采用flash開發可以在短時間內解決問題。但是手機端并不支持flash。所以最終使用服務器端生成圖像,手機端讀圖的方式。后臺我們提供了一個強大的圖形生成器,每隔一段時間會生成300張以上數量的圖形。與每個時間點和省市對應。

/media/upload/2014/02/02/baidu_m.jpg


四,未爆光的東東

最后,想在這里展示一下未爆光的東東,我們的動畫師為此項目定制了兩個小動畫GIF,最終沒有使用不得而知。如下:

 

五,寫在最后

 項目上線后,贏得社會各界人士的肯定,全國各大電視臺都在爭相播放,社會各界人士爭相評論。最讓人激動的是百度遷徙項目上了除夕的新聞聯播。做為參與此項目的開發公司,我們的小伙伴們倍感榮興,也獲得了前所未有的成就感! Cheers!

/media/upload/2014/02/02/baidup2.jpg
 

/media/upload/2014/02/02/baidup3.jpg


還沒有玩過的朋友們不要錯過哈!

項目地址 | 百度遷徙 

或直接訪問如下網址: http://qianxi.baidu.com

關注萬博思圖微博賬號 :   cnwebstudio


 

 

服務項目_SERVICE

關于我們

萬博思圖(北京)信息技術有限公司,專業的flash,flex開發團隊,5年經驗。公司致力于互聯網上的業務的開展,對于互動網站行銷,互聯網應用程序開發有成熟的解決方案。我們關注互聯網市場動態,關注新技術,更注重在新的領域不斷探索發現。
萬博思圖業務內容主要包括企業品牌Flash網站開發,企業形象宣傳Flash設計,動畫,多媒體演示,Flex企業級應用程序開發,擁有眾多成功案例,歡迎來電咨詢。
 
COPYRIGHT BY WEBSTUDIO INTERACTIVE DESIGN Co.,Ltd. ALL RIGHTS RESERVED.
公司地址: 北京市朝陽區光華路15號院泰達時代中心4號樓704 郵編: 100026 EMAIL: [email protected]
電話: 010-59070059   (新號:010-59897050 010-59897060)  手機: 13693660520 傳真: 010-59070059-801
京公網安備:110108006741      京ICP備:05013074號-1
王先生
浙江6十1开奖结果规则