亚洲另类97色波,四季久久免费一区二区三区四区,丰满蜜桃精品视频网,国产在线观看无码九色8X视频亚洲中文字幕久久精品无码喷水_国产精品无码一区二区

Carplay 設計規(guī)范(上)

2021-3-8    資深UI設計者


傳統(tǒng)的汽車中控系統(tǒng),大多是相對固定的硬件組合到一起,共同構(gòu)成中心的控制臺,控制著包括導航、收音機、播放器、空調(diào)等在內(nèi)的各種功能。一直到 2000 年前后,汽車的中控臺都一直以這樣相對固定的物理按鈕和旋鈕來搭建,用戶也可以通過官方或者第三方服務,來升級功能,比如將磁帶播放器升級為CD播放器乃至于內(nèi)嵌電視功能等等。

想做好車載設計?先掌握這份 Carplay 設計規(guī)范(上)

隨著移動端技術的發(fā)展,iOS 和 Android 等智能軟件系統(tǒng)的完善和提升,汽車的中控系統(tǒng)也不再受限于固化的硬件功能。平臺化的軟件體系讓中控系統(tǒng)有了更多的可能性,影音娛樂開始更加豐富,而已然完善的移動端觸摸式交互生態(tài),則為汽車中控以屏幕替代物理按鈕打下基礎,各類原本存在于手機電腦的新型的 APP 、功能、服務也逐漸出現(xiàn)在汽車中控系統(tǒng)上,而特斯拉更是一步到位,以一塊巨大的觸摸屏徹底革新了中控的交互體驗,OTA 升級,有機多樣的UI交互,徹底釋放開了汽車中控交互體驗上的想象力。新的問題出現(xiàn)了,新的方法在迭代,新的趨勢也得到了印證。

想做好車載設計?先掌握這份 Carplay 設計規(guī)范(上)

寶馬奔馳保時捷等頂級的汽車廠商大都在中控臺的設計上,探索了各自的可能性,國內(nèi)廠商也毫不示弱,不過其中絕大多數(shù)的系統(tǒng)都基于我們熟悉的 Android 或者是 Android Auto 作為基礎來進行定制和優(yōu)化,而蘋果則基于自家 iOS 生態(tài),在 2013 年推出了 iOS in the Car 服務,目前正式名稱為 Carplay。而目前各大廠商所青睞的 Android Auto 也上在 Carplay 發(fā)布之后所跟進并發(fā)布的。

目前,Carplay 和 Android Auto 都已經(jīng)上行業(yè)標準級別的存在,今天這篇文章, 我們先聊聊 Carplay。

關于 Carplay

想做好車載設計?先掌握這份 Carplay 設計規(guī)范(上)

CarPlay 車載系統(tǒng)旨在令用戶通過汽車制造商之原生車載系統(tǒng)來使用、操控iOS設備并發(fā)揮其功能。該產(chǎn)品的首個版本計劃于2014年發(fā)布,最早出現(xiàn)在一些制造商的汽車展覽上。

Carplay 本身并非完全獨立的存在,它本身會和 iPhone 一起聯(lián)動,讓iPhone 成為你的車鑰匙和輔助管理系統(tǒng)。

想做好車載設計?先掌握這份 Carplay 設計規(guī)范(上)

CarPlay 車載讓你能夠在駕駛車輛時智能、安全地使用各項 iPhone 功能。你可以開導航、打電話、收發(fā)信息、聽喜歡的歌。所有這一切,都整合在車內(nèi)的中控顯示屏上。在 iOS 14 中,CarPlay 車載還引入了全新的 app 類別和適用于 CarPlay 車載儀表盤的自定墻紙。

Carplay 以 蘋果自身在移動端交互和用戶體驗上的深厚積淀,總結(jié)和梳理出了一套可供學習和值得參考借鑒的規(guī)范。

這些規(guī)范對于需要考慮車載使用場景的廠商以及正在布局車載移動端軟件或者系統(tǒng)的廠商的設計師而言,都有著相當?shù)膮⒖己蛯W習價值。

Carplay 核心原則和功能

作為車內(nèi)輔助、操作、娛樂的中心,Carplay 可以直接連接到汽車中控的觸摸屏上,提供基于 iOS 的相關的服務和應用。Carplay 的整體設計圍繞著車內(nèi)駕駛這一使用場景,而它的設計原則也圍繞著這一場景來規(guī)劃:

  • 成熟。基于最熟悉的 iOS 應用,來設計界面元素,并提供熟悉、直觀的體驗。
  • 簡短。采用盡可能簡短的交互,不過度引人矚目
  • 相關。屏幕顯示信息高度相關,提供盡可能少選項,不需要復雜決策
  • 語音?;赟iri,以語音交互為核心,司機無需視線離開前方,手也不用離開方向盤即可完成交互。

想做好車載設計?先掌握這份 Carplay 設計規(guī)范(上)

1.1、音頻應用

Carplay 當中會有提供音頻內(nèi)容的 APP,諸如 Podcasts,網(wǎng)絡電臺,新聞,音樂,體育節(jié)目等等,這些服務和 APP 將會通過內(nèi)置的屏幕顯示,并且借助最常見的「標簽欄+列表」來呈現(xiàn)基本的框架,并且必須包含「播放」界面。盡管這類服務和應用是借由內(nèi)置的界面框架來呈現(xiàn),但是依然有值得注意的要點:

想做好車載設計?先掌握這份 Carplay 設計規(guī)范(上)

  1. 即使數(shù)據(jù)不可用,也始終要提供內(nèi)容。考慮到內(nèi)容可能會受到網(wǎng)絡狀況的影響,在這種情況下,請依然使用占位符。
  2. 請將內(nèi)容層次結(jié)構(gòu)控制在3個級別,或者更少。
  3. 使用多個標簽頁來組織內(nèi)容,并且盡量簡化標簽導航的數(shù)量和結(jié)構(gòu)。
  4. 優(yōu)先顯示相關度最高的內(nèi)容,減少用戶不必要的操作。
  5. 在最頂層界面中,提供包括單點擊觸摸即可播放的功能,比如「播放」按鈕和「隨機播放」等選項。
  6. 行駛過程中,對內(nèi)容進行智能過濾。比如超速的時候,系統(tǒng)會進行語音提示,此時智能暫停播放的內(nèi)容,并在界面中呈現(xiàn)正在播放的內(nèi)容的相關信息。
  7. 提供盡可能簡潔的標題和說明。
  8. 提供補充性的可視化內(nèi)容,比如專輯封面等等,更加一目了然。
  9. 不要在 Carplay 中內(nèi)置登錄和設置的選項和功能,確保 APP 開箱即用。如果需要,盡量讓這類操作在 iPhone 上進行,并且盡早完成。想做好車載設計?先掌握這份 Carplay 設計規(guī)范(上)

使用此圖標代表明確的、本地的的內(nèi)容。

想做好車載設計?先掌握這份 Carplay 設計規(guī)范(上)使用此圖標來標識在線的內(nèi)容,確保用戶知道內(nèi)容來自網(wǎng)絡,并且會耗費網(wǎng)絡流量。

在進行音頻內(nèi)容播放的時候,Carplay 會顯示「正在播放」的界面,并且會使用如下界面:

想做好車載設計?先掌握這份 Carplay 設計規(guī)范(上)

在設計這個相關的界面功能的時候,需要注意以下幾點:

  • 播放音頻時,提供有用的、準確的信息,并且可以進行明確的控制。
  • 不要重新定義播放控件的含義。
  • 在中斷播放一段時間之后,適時恢復并繼續(xù)音頻播放。

1.2、汽車廠商應用

Carplay 能夠內(nèi)嵌到不同廠商的車中,自然也可以控制車內(nèi)的硬件。這一部分的硬件驅(qū)動支持通常是由廠商提供,并且借由 Carplay 內(nèi)的界面,提供統(tǒng)一的交互體驗。

想做好車載設計?先掌握這份 Carplay 設計規(guī)范(上)

  • 將控件和內(nèi)容限制在與汽車本身相關的范疇以內(nèi),不要加入無關的功能
  • 首選標準UI控件,包括按鈕、標簽、導航、表單等控件,具體可參閱系統(tǒng)元素
  • 不要重新設計標準控件,確保整體的視覺和體驗的一致性
  • 切勿模仿汽車本身的UI 界面設計,確保 Carplay 內(nèi)的統(tǒng)一性

1.3、信息傳遞和 VoIP應用

VoIP 也就是基于 IP 的語音傳輸功能,而在 Carplay 中,VoIP 應用主要借助 Siri 服務,并且全由 Siri 操控,它并不為用戶提供直接的交互界面,因此無需專門設計 UI 界面。

想做好車載設計?先掌握這份 Carplay 設計規(guī)范(上)

它支持閱讀信息和編寫/回復消息,不過需要用戶授予權限

想做好車載設計?先掌握這份 Carplay 設計規(guī)范(上)

2.1、信息標識

當你的 APP 有推送信息未讀的時候,通常會在 APP 的右上角增加一個紅色的小紅點標識,并且其中會有一個白色數(shù)字用來標識未讀信息的數(shù)量。

想做好車載設計?先掌握這份 Carplay 設計規(guī)范(上)

  • 盡量讓信息標識足夠直觀。讓用戶打開APP之后能夠看到推送信息。
  • 保持克制。不要讓推送信息大量而頻繁,在這個場景下會讓用戶感到迷惑。
  • 注意重要信息的呈現(xiàn)。在標簽欄和APP內(nèi)的重點位置凸顯重要信息,不要僅靠信息標識來凸顯關鍵信息推送。
  • 避免使用警報提示來作為信息標識的補充。即使有重要的信息,用戶也不希望你在打開APP的時候出現(xiàn)警報彈出框來推送信息。這些信息應當是可見,顯著,但是用戶選擇是否要打開和點擊的。
  • 始終保持信息標識是最新的。

2.2、錯誤推送

對于錯誤信息,應當妥善處理,并且絕對是要在必要的時候才推送報錯信息。

  • 通過 Carplay 推送錯誤信息,而不是推送到連接的 iPhone 上去。
  • 優(yōu)先以非侵入性的狀態(tài)推送來推送報錯信息,而不是直接彈出警報。

2.3、加載狀態(tài)

在加載內(nèi)容的時候,使用黑屏或者靜態(tài)的界面,可能會讓它整體上看起來像是死機了一樣,者可能會導致用戶離開。

想做好車載設計?先掌握這份 Carplay 設計規(guī)范(上)

  • 進行加載的時候,盡量明確顯示加載狀態(tài)
  • 加載時,盡快顯示主要內(nèi)容,使用文本和圖片占位符來呈現(xiàn)內(nèi)容布局,并且在完成之后替換,如果可能,盡量預加載已有內(nèi)容,再更新。

2.4、導航模式

在 Carplay 當中,有2種常見的導航模式:

橫向?qū)Ш健MǔJ褂脴撕灆趤磉M行導航,不同內(nèi)容橫向排布,用戶可以快速點擊不同標簽切換。

想做好車載設計?先掌握這份 Carplay 設計規(guī)范(上)

分層導航。用戶在屏幕上點選不同選項,通往不同的子界面。其中地圖應用采用的是這種結(jié)構(gòu)。

想做好車載設計?先掌握這份 Carplay 設計規(guī)范(上)

音樂類應用可以使用橫向?qū)Ш?,也可以使用分層導航,在設計導航的過程中,應當注意:

  • 盡可能讓用戶快速而輕松地獲取內(nèi)容。結(jié)構(gòu)化信息,讓用戶以最少點擊、滑動來找到他們想要的東西。
  • 用戶在進行返回操作的時候,請保留之前的界面,防止用戶迷失。避免音頻自動播放,除非它是主要功能。
  • 為每一個界面分配一個固定清晰的路徑。
  • 盡可能使用標準的導航組件,比如使用選項卡菜單欄和列表視圖。
  • 使用導航欄應該能夠遍歷所有的層次結(jié)構(gòu)。
  • 使用標簽頁選項卡的時候,顯示同一級的內(nèi)容或者分類。

2.5、測試

全面的測試,是確保應用可用性的重要前提。

  • 請在實際與 Carplay 兼容的顯示器上進行測試,最好是在真實的車上進行測試。
  • 在惡劣的網(wǎng)絡條件下測試,比如穿越隧道或者網(wǎng)絡覆蓋狀況較差的區(qū)域。
  • 測試安裝和設置的流程中有沒有問題,并且密切注意涉及到登錄和隱私相關的問題。

3.1、音頻內(nèi)容

無論音頻是否是你的 APP 的主要內(nèi)容呈現(xiàn)形式,你都需要了解用戶對于音頻有哪些期待,并且盡量去貼合這些需求。

  • 只有當準備好播放之后,才會切換到「正在播放」的屏幕頁面。
  • 音頻加載完畢之后就可以開始播放,即使描述性的信息依然在加載。
  • 盡量避免自動播放。
  • 如果被別的程序和提示打斷,在暫停之后再繼續(xù)恢復音頻播放。
  • 在必要的時候,自動調(diào)整當前內(nèi)容的音量,而不是整體的音量。
  • 在系統(tǒng)發(fā)出短提示音的時候,使用系統(tǒng)音量。比如警報。

3.2、汽車數(shù)據(jù)

在管理汽車功能的頁面當中,廠商提供的功能和數(shù)據(jù)將會無縫的接入到 Carplay 當中,比如氣候、網(wǎng)絡、GPS 等等。當數(shù)據(jù)不可用的時候,盡量提供合理的響應方式。

比如當汽車通過隧道,沒有 GPS 信息的時候,盡量以不打擾的方式來告知用戶。

3.3、iPhone

Carplay 是和 iPhone 連接起來使用的,并且在程序數(shù)據(jù)上也相互兼容互通,只是Carplay 本身提供的是簡化之后的 UI ,并且針對駕駛的場景進行了優(yōu)化。

  • 當 Carplay 處于活動狀態(tài)時,隱去 iPhone 上的 APP 交互。
  • 請不要將 iPhone 和相關用戶置于 Carplay 范疇以外,因為正常使用的時候需要 iPhone 的數(shù)據(jù)接入。
  • 確保當 iPhone 鎖定或者在后備箱中的時候,你的程序可以正常使用。

3.4、旋鈕和控件

支持 Carplay 的車輛通常會有物理按鈕和旋鈕,它們可以作為 Carplay 交互的輔助。當物理按鍵作為用戶的主要交互介質(zhì)的時候,通常至少會存在一個 Siri 按鈕,導航控件,選擇控件,以及后退控件。

這些控件和 Carplay 應當高度對應,無論是播放、暫停、上一首/下一首 都應該做出準確的相應。具體可以參閱:MPRemoteCommandCenter

想做好車載設計?先掌握這份 Carplay 設計規(guī)范(上)

當 Carplay 投射的屏幕不支持觸摸的時候,還有基于旋鈕的焦點式交互方式,當用戶擰動旋鈕的時候,能夠讓光標從一個元素切換到另一個元素,激活并交互。

文章來源:優(yōu)設 作者:陳子木

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



日歷

鏈接

個人資料

藍藍設計的小編 http://www.teruid.com

存檔