<em id="09ttv"></em>
    <sup id="09ttv"><pre id="09ttv"></pre></sup>
    <dd id="09ttv"></dd>

        • 簡單實用!系統化總結「地圖標簽」設計

          2022-2-21    seo達人


          一、地圖組件的四種類型

          1、圖標
          地圖上只標記圖標,這種呈現方式能最大程度地顯示地圖上的信息,減少內容遮擋,也是在設計中首先要考慮的類型。

          2、文本
          如果地圖上標記的內容沒有合適的圖標能展示出來,可以直接利用文本來描述。

          3、圖標和文本
          隨著地圖的放大縮小,氣泡信息的詳細程度也會發生變化。地圖放大時將圖標和文本相結合可以顯示更多的信息,而縮小時只顯示圖標。

          4、圖標、文本和注釋
          圖標,文本和注釋相結合的形式雖然能顯示更多的信息但是需要謹慎使用,因為氣泡的尺寸太大會遮擋地圖的內容,反而影響使用。

          只有當氣泡內容能顯著提升用戶體驗時,才使用這種類型。

           

          二、地圖組件的視覺樣式

          大多數場景中,地圖組件的底部會有一個突出的箭頭,用來標記確切的信息或地址。
          考慮到后期開發的難度,箭頭的位置應始終位于組件的中間。另外如果一個頁面中有多個地圖組件,可以將箭頭調整到頂部,防止發生重疊。

           

          1、顏色

          組件的顏色比較靈活,默認情況下是白色,但可以通過改變背景色來匹配品牌色。
          顏色通常出現在圖標后面用來強調信息,如果沒有圖標可以把整個氣泡組件都填充上顏色。

          根據背景色的不同,文本和圖標盡可能使用黑色或白色,減少對內容的干擾。
          2、狀態
          地圖氣泡尺寸的大小根據點擊需求確定。白色輪廓加上膠囊形狀讓用戶能夠快速識別出可點擊的對象,選定后氣泡顏色會反轉。

          3、內容縮放
          組件基于地圖縮放級別和縮放速度展示不一樣的動畫效果。

           

          三、組件可用性指南

          如何判斷設計出來的組件是否適合用戶使用?組件需要怎樣設計才能適用于不同的使用場景中,有沒有統一的規范?
          1、組件狀態
          面對不同場景中的組件,提供多種狀態:重疊、可見、收縮、聚類、分離

           

          2、密度

          地圖中至少要保持40%的內容是始終可見的,這樣用戶可以明確位置信息,防止產生誤操作行為。

          利用聚類功能將相鄰的氣泡組件合并在一起,通過數字顯示包含的內容,這種形式利于用戶理解和操作。

           

          3、易讀性
          易讀性在地圖中很重要,例如用戶手持使用手機時組件中的字體為15pt,當用戶駕駛導航時組件的字體會變為24pt。

          另外還要考慮語言的選擇對組件的影響,最好避免在氣泡組件中使用長串字符,以防止地圖中的信息被遮擋。

          如果必須要顯示長串字符,需要把氣泡組件的尺寸水平拉長至地圖尺寸的75%,然后換行且最多只能顯示兩行文本。

           

          四、總結–點擊即導航

          在開始設計地圖UI界面之前,有必要花費時間了解地圖組件的樣式、類型和可用性指南。
          通過這些信息可以幫助設計師更快地確定方向,從而設計出清晰美觀的地圖界面。

           

          原文地址:Medium

          譯文地址:Clip設計夾(公眾號)

          作者:Linzi Berry

          譯者:Clippp

           

          轉載請注明:學UI網》簡單實用!系統化總結「地圖標簽」設計

          藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請掃碼藍小助,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系。

          截屏2021-05-13 上午11.41.03.png

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.
          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

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

          UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司



          日歷

          鏈接

          個人資料

          藍藍設計的小編 http://m.sdgs6788.com

          存檔

          无码人妻精品一区二区三区久久久| 久久青青国产| 久久久久亚洲Av无码专| 99久久精品影院老鸭窝| 久久99热狠狠色精品一区| 国产日韩久久久精品影院首页| 欧美精品福利视频一区二区三区久久久精品 | 欧美日韩中文字幕久久伊人| 综合久久一区二区三区| 亚洲一区二区三区日本久久九| 久久精品综合网| 国产精品狼人久久久久影院| 久久亚洲私人国产精品vA | 国内精品久久久久久麻豆| 亚洲成色WWW久久网站| 色综合久久久久综合99| 久久国产精品免费一区二区三区 | 久久国产精品99久久久久久老狼| 亚洲AV日韩精品久久久久久久| 久久一区二区免费播放| 色天使久久综合网天天| 国产精品一区二区久久精品涩爱| 热综合一本伊人久久精品| 久久久久亚洲精品日久生情 | 亚洲中文字幕无码久久2020| 2021少妇久久久久久久久久| 久久婷婷五月综合97色直播| 久久午夜综合久久| 久久精品日日躁夜夜躁欧美| 久久精品国产亚洲AV不卡| 日韩精品久久无码中文字幕| 久久亚洲精品无码观看不卡| 久久99国产精品一区二区| 精品久久久久香蕉网| 久久精品久久久久观看99水蜜桃| 国产真实乱对白精彩久久| 蜜臀久久99精品久久久久久小说| 无码人妻少妇久久中文字幕| 久久国产精品无码一区二区三区| 久久人人爽人人爽人人片AV东京热| 色综合久久天天综合|