公主的腿间舌奴们np肉_国产在热线精品视频99公交_公主车上荫蒂添的好舒服_公侵犯人妻中文字慕一区二区_公么大龟弄得我好舒服秀_公交车+多人+高cH文章推荐_日本熟妇另类视频在线播放

帶你看世界!20個巧用地圖元素的優(yōu)秀網(wǎng)頁設計

2015-9-16    博博

藍藍設計tweetduck.com )是一家專注而深入的界面設計公司,為期望卓越的國內(nèi)外企業(yè)提供有效的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網(wǎng)站建設 、平面設計服務

如果您想訂閱本博客內(nèi)容,每天自動發(fā)到您的郵箱中, 請點這里

來源:優(yōu)設網(wǎng)

20-maps-elements-websites-1

多數(shù)時候,我們在網(wǎng)頁中看到的地圖,都是用百度/谷歌地圖來顯示公司、機構(gòu)或者店鋪的地理位置。然而,地圖在網(wǎng)頁中的使用真的就只能這么單調(diào)么?

加入一點想象力,添加一些技術(shù)支持,你會發(fā)現(xiàn)地圖可以讓整個網(wǎng)頁的逼格拔高不止一個層次!

將原始的、額外加入的地圖元素轉(zhuǎn)化成極具吸引力和視覺沖擊力的組成部分,需要進行相當程度的調(diào)整,加入和互動元素:微妙的動效、基于多媒體的工具、動態(tài)指針、扁平化的風格、Lowpoly風的插畫、現(xiàn)代風的線條圖標,甚至是略顯古怪的草圖也能讓地圖煥發(fā)出生命力。

描述太過抽象?不妨看看腦洞大開的設計師們是怎樣“改造”網(wǎng)頁中的地圖的吧!

Rolex Awards 2014

設計師使用色彩明亮的點和線搭建出一幅優(yōu)雅而細膩的世界地圖,它不僅以不同尋常的方式展現(xiàn)出五名年輕的夢想家,而且以一種優(yōu)雅的方式營造出品牌獨特的風格和氛圍。

TFI World Map

和上一個案例頗為相似,設計師用小圓點優(yōu)雅地搭建出世界地圖,灰白的色調(diào)看起來雅致而時尚。用戶頭像在地圖的映襯下成為視覺重心,一點違和感都沒有。

Sailing Seas of Plastic

這個網(wǎng)頁反映的是塑料在全球各地的分布情況,明暗對比鮮明的世界地圖巧妙地揭示了問題的嚴重性。

Cost of Living

想知道哪個歐洲國家的首都生活成本最合理,最令人舒適么?試著探索一下這個項目吧,在地圖上點擊這些國家的首都,你會清晰地看到哪些成本高昂,哪些經(jīng)濟實惠。

Alfoart Photo Travel

如果你熱衷于參觀名勝古跡,那么這個項目就是為你量身定制的。復古的地圖樣式,精雕細琢的經(jīng)典圖標,充滿活力而漂亮的地標,完美的互動性和豐富的信息整合在一起,你一定不要錯過。

Deutschland

在Google的支持之下,你可以借助這個網(wǎng)站對德國進行更深入的了解。這個使用彩色地標的互動式地圖為你展現(xiàn)了25個不同主題的內(nèi)容,你可以以任何語言參與到其中的討論。

Beyond the Track

Beyond the Track 是一個有趣而又實用的網(wǎng)站,它以一種更為引人入勝的方式展現(xiàn)了世界摩托車大賽冠軍賽的相關(guān)信息,并提供了相關(guān)服務。你可以在這里查看比賽的五大賽道,相關(guān)的統(tǒng)計數(shù)據(jù),周邊的文化經(jīng)典,住宿信息,等等等等。

Galapagos

這個網(wǎng)站的團隊專注于尋找更富有活力的三位互動地圖的創(chuàng)意解決方案。通過HTML5來驅(qū)動多邊形圖形,以精巧別致的地圖展現(xiàn)出Galapagos的獨特風景。

Everyday Moments

Everyday Moments 是一個交互可視化的網(wǎng)站,展示關(guān)于英國和愛爾蘭的一些日常的推文。設計師采用了柔和的色調(diào),微妙的圖形和賞心悅目的動效,其中地圖的設計最是抓人眼球。

Dangerous Roads

借助街景技術(shù),這個網(wǎng)站的開發(fā)團隊成功地呈現(xiàn)了世界上最危險的道路。雖然地圖的插畫僅僅只是在開頭“歡迎”環(huán)節(jié)展示了一下,但是整個項目是基于這個地形來構(gòu)建的。

Windward

打開網(wǎng)站,沉靜的藍色世界地圖美得令人窒息。僅僅只是調(diào)整了顏色,稍加修改,就這個簡單。

Wellesley

壯麗的美洲俯瞰圖和大標題組合在一起,簡單但精致。

Svenska Kyrkans Internationella Arbete

整個網(wǎng)站基于一幅精心定制、點綴許多可交互的地標的地圖,而網(wǎng)站內(nèi)容旨在通過照片展現(xiàn)人們遭受的各種災難。

Oil Spills in the Beaufort Sea

正如同標題所說,這個網(wǎng)站試圖引導用戶關(guān)注海上石油管道泄漏所造成的惡劣影響和可能的解決方案。更重要的是,它是一個復雜而多功能的項目,你可以添加圖層,針對特定領域進行探索。

Get the Look

這是一套的矢量地圖,額外的導航菜單被放置在底部,紅色的區(qū)域象征著項目所支持的國家。

Give Holland

Give Holland 這個網(wǎng)站使用了半寫實的地圖來展現(xiàn)那些壯觀的圖片,為用戶提供了一種純粹的樂趣。

Explorez

Explorez la legend 是一個網(wǎng)頁游戲,3D地球是整個游戲最關(guān)鍵的因素。

Anywayanyday

Anywayanyday 是一個受歡迎的票務預訂服務,線條勾勒的世界地圖是它的加載動畫,看起來頗為不錯。

Ferias para Curtir

網(wǎng)站使用了漂亮的卡通式的地圖插畫,與整個網(wǎng)站風格非常協(xié)調(diào)。

Grano Armando

網(wǎng)頁在菜單大圖標中使用了優(yōu)雅而標識清楚的意大利地圖,復古風的網(wǎng)頁中,這樣的圖標使用顯得非常有范兒,不僅展現(xiàn)了店面的覆蓋范圍,還雅致地展現(xiàn)出品牌氣質(zhì)。

Lotr Project

很高興能看到指環(huán)王的粉絲為自己喜歡的電影設計網(wǎng)站。設計者制作了可交互的中土世界地圖,你可以借此查看相關(guān)的人物、事件和地方。

結(jié)語

可交互的地圖通常使用HTML5和JS來實現(xiàn)這些功能,確保用戶體驗的同時,還為信息的展現(xiàn)提供了更多的可能性。

 

日歷

鏈接

個人資料

藍藍設計的小編 http://tweetduck.com

存檔

桦南县| 建德市| 陵水| 孝感市| 沂南县| 小金县| 陇西县| 年辖:市辖区| 大丰市| 伊宁市| 沾益县| 屏边| 榕江县| 安岳县| 富民县| 安仁县| 沁源县| 弥渡县| 安乡县| 伊春市| 思南县| 仁怀市| 广昌县| 黄骅市| 菏泽市| 礼泉县| 东源县| 巴林右旗| 怀来县| 高陵县| 卢湾区| 太原市| 新疆| 万安县| 晋中市| 二手房| 南京市| 绥宁县| 南宁市| 昌吉市| 金山区|