做爰三级在线播放_又大又粗又猛又舒服又爽_暖暖www免费高清视频最新期_午夜精品aaa国产福利

地圖基礎知識及通用設計原則

2020-10-22    資深UI設計者

Part 1. 地圖的發展

地圖作為記錄地形傳遞路線信息的載體,在人類文明中一直扮演著重要的角色。其承載形式一直緊跟著時代技術的發展而變化,從石板、動物皮革,到絲綢、紙張。當互聯網走進千家萬戶,地圖也步入電子化時代。

相較于紙質地圖,電子地圖優勢顯著:更新速度快、獲取信息效率高、更清晰、可交互等。電子地圖(后文簡稱地圖)的出現也影響著人們的出行方式,尤其當智能手機普及,我們可以隨時查詢地點、發起導航,再也不需要提前記下高速出口和轉向路口了。

Part 2. 地圖在滴滴的重要性

滴滴擁有網約車、代駕、騎行、公交、自駕導航等眾多業務,是一站式出行平臺。而地圖作為承載出行服務的重要載體,橫向支撐著各業務線的發展。以網約車業務為例,調研結果顯示絕大部分乘客都會關注并使用地圖。

隨著各業務線對體驗的要求不斷提升,單一的地圖模式已經不能滿足業務訴求及用戶需求,需要進一步細分場景、精細刻畫地圖樣式,于是地圖的設計也變得愈發重要。

滴滴出品!地圖基礎知識及通用設計原則

Part 3. 解構地圖

地圖承載的信息種類復雜、數量巨大,初期可能會找不到設計切入點。我們可以先了解下它的定義和實現方式,或許就能從中找到答案。

定義:地圖是依據一定的數學法則,采用地圖語言,經過制圖綜合來表示地球表面的圖形。

實現流程:

  • 采集真實世界的地點信息,經過編譯轉化成數據
  • 數據信息中包含了地點的坐標、分類、名稱等
  • 數據經過渲染形成可視化雛形地圖
  • 雛形地圖經過設計最終變成策略完整、視覺美觀的電子地圖。

滴滴出品!地圖基礎知識及通用設計原則

結合“從雛形到完整地圖”這一步流程的實現方式,進而可將地圖拆分為基礎層、策略層和感官層。幫助各職能角色找到對應切入點。

  • 基礎層,指的是地圖的數據和能力。數據大家已經有所了解了,能力指的是引擎渲染能力、定位能力、圖像識別能力等。有了數據及各類能力作為基礎,才能設計出信息精準、交互明確的地圖。
  • 策略層,則指的是如何使用這些基礎數據和能力。地圖數據量非常龐大,無法全部展示,需要結合不同的場景及用戶需求,有重點的呈現。
  • 感官層,便是我們給數據穿上的衣服,會根據品牌調性、對應場景訴求等去設計最終的配色、圖標等。

滴滴出品!地圖基礎知識及通用設計原則

解構地圖后,我們不難看出,感官層是設計側需要關注的重點層級。

Part 4. 地圖設計原則

1. 元素分類

面對如此復雜的地圖信息,為了梳理出清晰的思路,我們會對地圖元素進行分類:根據數據的類別和呈現狀態,可拆分為點、線、面三類元素。

  • 點元素:地名、POI*等。數量龐大,是城市規模的體現,尤其POI信息,它是地圖中顆粒度最細的位置信息。
  • 線元素:道路、地鐵線、水系線、鐵路線、航線、邊界線等。線元素呈現了道路的走向、區域的劃分等,描繪出了城市的樣貌。
  • 面元素:陸地、草地、湖泊海洋、AOI*。面元素以色塊形式出現,很大程度上決定了一張地圖的色調。

名詞解釋:POI, Point of Information的縮寫,即“信息點”。一個POI可以是一棟房子、一個商鋪。

名詞解釋:AOI, Area of Interest的縮寫,即“信息面”。指的是區域狀的地理實體,如醫院、小區等。

滴滴出品!地圖基礎知識及通用設計原則

2. 核心設計原則

從定義可以看出,地圖是一種特殊的圖形語言,是以上所有元素的集合體。相比我們所了解的UI設計、運營設計,地圖有屬于自己的設計原則。以下為大家總結了一些核心的原則:

符合制圖學和公眾認知

地圖發展到現在已經成為了一門學科,我們會發現即使語言不通,拿到一張地圖時也能看懂,這是因為有制圖學和公眾認知在規范著地圖設計。如地圖默認北向上、草地水系基本遵循物理世界的顏色、省界線是實線、停車場圖標大多用P來代表等等。符合制圖學和公眾認知,大大降低了用戶的學習成本和記憶負擔,使地圖可以作為一種世界通用語言流通起來。

保證識別度

地圖屬于信息類工具,其上出現的元素均需清晰可識別,保證可讀性是最基本的設計原則。所以在設計時會限制顏色對比度、最小字號等,而具體規則會根據場景確定。

清晰有層次

地圖的層次清晰包含了兩個方面:信息主次清晰,視覺具有整體性。

信息主次清晰,地圖信息龐雜,沒有主次關系會影響用戶的讀圖效率。在設計時需要考慮元素本身的特點、重要性,可通過顏色、icon/文字大小、線形寬窄等表達。做到同類元素有關聯性,不同元素有差異性。同時,信息主次也會根據比例尺的變化有所調整。

視覺具有整體性,在滴滴的業務場景中,地圖通常作為最底層組件出現,上層還會有很多業務組件。因此在設計時需克制用色,既要保證地圖中各元素之間的區隔度,又要保證地圖整體與其他業務組件拉開視覺層級。這樣才能更好的突出當前業務模塊的重點,提升整體的使用效率和體驗。

細分地圖模式

地圖在各業務模塊中應用廣泛,用戶需求也不盡相同,設計時需要根據使用場景區分不同模式。以網約車場景為例,業務信息始終處于上層,地圖用來幫助用戶定位、快速發單。因此,網約車場景的地圖整體性強、色調偏冷、視覺層級后退,能更好的搭配網約車模塊的整體設計,保證用戶的操作效率。

滴滴出品!地圖基礎知識及通用設計原則

具有品牌特性

品牌調性一直是滴滴設計層面非常關注的原則,品牌基因貫穿了所有產品,始終具有獨特的視覺風格。遵循品牌的視覺語言,使地圖可以更好的融合到產品中,保證了設計的統一性。

文章來源:優設    作者:CDX創意設計中心


藍藍設計91whvog3.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務


日歷

鏈接

個人資料

藍藍設計的小編 http://91whvog3.cn

存檔