2021-5-26 資深UI設計者
相信很多人在開車時都用過手機或車機上的地圖導航,而今天 Alibaba Design 想和大家分享的就是大家常用的地圖導航的換代升級版——車道級導航。
先來說說車道級導航有哪些不一樣。相比于傳統(tǒng)地圖,車道級地圖導航在信息精細度、定位準確性、動態(tài)信息豐富度上有大幅提升。比如,車道級導航能清晰顯示道路上的虛實標線、自己的車行駛在哪條車道上,還能在地圖上看到車身攝像頭和雷達檢測到的周圍車輛、錐桶、防撞桶等。
車道級導航在智能汽車的駕駛場景中,有兩方面的用戶價值:
目前,高德已經(jīng)發(fā)布搭載了車道級導航能力的量產產品——高德第三代車載導航,已在小鵬P7車型的NGP*自動導航輔助駕駛系統(tǒng)中落地。
*NGP 是高級智能輔助駕駛系統(tǒng),可以在全中國大部分高快速道路上進行自主并線、超車、駛入匝道等。
車道級地圖導航承載的信息與傳統(tǒng)地圖有明顯差異,如何將這些信息加工轉化為愉悅的駕駛體驗,就是設計師要解決的問題了。下面分享一些我們在車道級導航設計中的思考。
車道級導航應用于智能汽車的人車共駕場景,需要同時考慮用戶的駕乘體驗和車企客戶的設計定制訴求。包含三部分內容:
車道級地圖中所呈現(xiàn)的數(shù)據(jù)元素對比普通地圖更多更復雜,而且在不斷采集更新中,但大致能劃分為三類:動態(tài)識別元素、高精道路元素以及場景氛圍元素,如下圖所示。
我們要做的設計,就是將以上這些數(shù)據(jù)元素以三維視覺化的方式進行呈現(xiàn),最終服務于駕駛場景中的駕駛者。我們總結了幾個重要的構建原則:
「 清晰的空間關系展示 」
數(shù)字地圖的優(yōu)勢在于能清晰展示復雜世界的空間結構、空間關系??臻g關系的清晰表達能讓駕駛者更了解當前所處道路環(huán)境,心里更有底,這對于開啟自動駕駛的車輛尤為重要。
空間關系表達的關鍵在于表現(xiàn)道路的上下層級和聯(lián)通關系、坡度變化,加上仿真的車輛及視角變化,實現(xiàn)高架穿橋而過、相機視角由遠及近的場景展示。
空間關系表達的另一重點在于道路與周圍環(huán)境的關系,比如道路與山脈,通過高精地圖可以看到遠方道路的彎曲路形,提前減速,提升山路駕駛安全性。
「 簡約元素風格提煉 」
地圖設計時整體風格選擇需要克制,既要保證地圖中各元素之間的區(qū)隔度,又要保證地圖整體與上層業(yè)務組件拉開視覺層級。這樣才能更好的突出當前需要駕駛者注意的重點元素,提升整體的信息傳達效率和體驗。
既要讓駕駛者能快速識別地圖中的元素是什么,又需要讓畫面整體有序,主次明確。所以我們使用介于寫實與抽象風格之間的簡約風格,既能寫實展示元素的關鍵特征,整體又不復雜。
對于單個元素的設計上,主要是通過元素現(xiàn)實中的關鍵特征提取,去掉一些不影響認知的細節(jié),讓駕駛者一眼就能明確這個元素是什么。
「 動靜風格統(tǒng)一 」
靜態(tài)元素是由高精地圖生成,而運動元素則是車輛傳感器識別的車輛、交通設施等。地圖上的這些元素的仿真表達,能夠反應車周圍的實時動態(tài)環(huán)境信息,增強駕駛者對車輛感知能力的信任。
對于這些動態(tài)識別元素,我們推薦客戶在設計風格上與地圖相呼應,在保證識別性的前提下,兩者風格盡量統(tǒng)一,形成整體感。
下面是客戶設計團隊制作的動態(tài)元素模型:
對于行人、自行車等出現(xiàn)人體的元素,我們通過循環(huán)的骨骼動畫原地播放,以及傳感器確定的運動軌跡,來模擬對應的人體運動。
地圖畫面是由渲染引擎程序的攝像機拍攝出來的。攝像機的位置、俯仰角、投影中心、裁剪區(qū)域等都會影響用戶看到的畫面內容。
「 遠近兼顧的視野 」
為了讓駕駛者有全局的掌控感,車道級地圖的攝像機視野需要兼顧眼前和遠方的信息呈現(xiàn)。在地圖上既可以看清眼前的車道標線、周圍的車輛,又可以看到 500 米甚至一公里后的路形變化、高速出口等。
「 自動駕駛動態(tài)視角 」
我們與客戶設計團隊一起,對自動駕駛場景拆分做了多次討論,最后決定對車速和并線這兩個變量設計動態(tài)視角。
在自動駕駛場景中,攝影機與自車的距離會隨著車速大小在一定范圍內變化。當車速較慢時,拉近攝影機與自車的距離,以強化顯示自車周圍的動態(tài)信息。當車速較快時,拉遠攝影機與自車的距離,獲得更遠的視野和足夠的預判時間。
自動駕駛的關鍵場景是車輛自動并線。為了強化駕駛者對車輛并線決策的感知,在汽車進入并線等待狀態(tài)時,相機的投射中心會移動到目標車位。
「 車道級導航動態(tài)視角 」
與自動駕駛相對的是人駕駛的場景。按與下一個轉向路口的距離遠近,人在駕車導航時可抽象為 4 個階段:順行、預判、確定、動作。
不同的駕駛階段需要不同的攝像機視角,來強調最相關的信息。例如:當下一個轉彎路口在幾公里以后時,駕駛員對幾公里范圍內路況的需求要強于對前方路口位置的需求;當臨近路口時,駕駛員對前方從哪里轉彎、走哪條車道的需求又會強于對幾公里后路況的需求。
下面詳細介紹一下臨近路口時,攝像機視角的動態(tài)過渡策略:
過程 1:根據(jù)用戶位置和交通情況,提示用戶并線,此時將攝像機拉近,畫面從 2D 地圖視野平滑放大到車道級地圖視野,突出并線引導和目標車道;
過程 2:保持攝像機與自車距離不變,仰角隨著自車與路口的距離逐漸減?。存i定路口在屏幕上的位置)。這樣既能有清晰的路口距離感知,又能讓路口形狀逐漸清楚,規(guī)避了大仰角導致的離路口越近,路口形狀越扁平的問題。
不同的路口形狀適合不同的仰角參數(shù)。例如分叉路口用“大仰角”就能既看清路口形狀,十字路口則需要偏鳥瞰的“小仰角”才能看清路口形狀。另外,當轉彎路口之前很近的位置還有一個路口時,還需要調整相機的旋轉角度,來清晰傳達兩個路口的位置和形狀,防止駕駛員走錯。
車道級地圖與自動駕駛關聯(lián)緊急,且依賴于車輛的精準定位能力,是車輛智能化的核心功能展示,對于設計上每個車企都會考慮進行深度定制,與自身 HMI 風格統(tǒng)一,且功能上有與其他車企的差異化與賣點,這就需要我們考慮規(guī)?;O計中的效率問題。
規(guī)?;y點在于,與客戶產研設團隊的合作鏈路摸索和優(yōu)化;車道級元素種類多、狀態(tài)多,設計產出的落地文件生成方式也不同;預覽驗證困難,導致新接觸的客戶設計師理解門檻高,缺乏對應的工具集。
「 低成本風格定制 」
第一階段,我們?yōu)榭蛻籼峁┝烁鱾€設計階段需要的設計規(guī)范、源文件、教程。第二階段,客戶可以使用高德設計團隊打造的 D-Map 平臺,通過所見即所得的方式進行設計方案配置,并且能快速預覽設計效果。
「低成本增減元素」
對于車道級地圖中新增三維元素,梳理了對應的元素新增流程,規(guī)范前期建模中的模型面數(shù)、坐標、法線等,減少返工調整。
傳統(tǒng)導航地圖的使用對象只是人,而車道級導航地圖是人車共用的。在自動駕駛時,車道級導航地圖不僅為自主駕駛系統(tǒng)提供地圖和導航路徑,駕駛者與乘客也可以通過地圖更清楚地了解車輛做決策的依據(jù),增強對于車輛的信任感;而在人駕駛時,通過車道級的精細引導,可為駕駛員帶來更舒適、更安全的導航體驗。
地圖是人類文明的坐標,隨著科技進步,地圖不斷被賦予新的內涵。對于車道級導航的設計探索才剛開始,未來,我們也會嘗試利用不斷增強的車載硬件算力,與車企一起創(chuàng)造次世代的車載導航體驗,為用戶提供更準確好用的高德地圖。
藍藍設計建立了UI設計分享群,每天會分享國內外的一些優(yōu)秀設計,如果有興趣的話,可以進入一起成長學習,請掃碼藍小助,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯(lián)系。
文章來源:優(yōu)設 作者:AlibabaDesign
分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯(lián)系,我們立即更正或刪除。
藍藍設計( www.88yangsc.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業(yè)提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網(wǎng)站建設 、平面設計服務