為才要起步的android auto ui限制先行翻譯起來放～

1. by IDC Fanny
Audio
UI Guidelines

2. 必須搭配Android 5.0以上的手機系統 ，就可以利用車
內螢幕控制手機內容，包括全音控。
搭配 Voice Search 的功能，目前只支援 Audio的相關
內容以及text的閱讀，讓開車的人可以免持使用撥打/接
聽電話、播放音樂、導航、即時語音訊息
應用程式設計上，規定影片的播放必須在 停車 的狀態
當用戶連結到auto時，手機會被鎖定，駕駛無法分心

3. 簡單、掃視的
優化互動模式、降低認知負荷、增加安全性
好的app會提供適當足量的訊息讓駕駛得以馬上做決定並可以將注意力放回路上。
多裝置、不間斷連接的
提供駕駛一個在多裝置與車子間連結不間斷的經驗。
提供即時且相關的訊息讓司機得以在開車過程中預測、掌握他所需要的
簡化複雜的警告訊息讓駕駛在開車時也能處理重要事件，出現即時資訊時也同時預測使用者下個任務，
有效率的app只顯示與駕駛直接相關的訊息，其他一般任務則利用基本模式來處理。
自然的整合
使用時像汽車的延伸又或者是使用者身邊的裝置一樣容易。
Android auto 訴求
CREATIVE VISION

4. 規範類型 App設計規範
Driver Attention App內不得有任何動態圖像、動畫、遊戲、影像或是進度條。
App內不得含有視覺或文字廣告、只有聲音廣告是可以接受的。
App內不得在車內螢幕上顯示圖片，但可以接受內容背景帶有靜態
圖片，例如專輯封面、或是當做導覽用的icon。
*總之不得含有會讓司機分心的元素
Layout App內不得含有自動跑馬的文字形式設計（scrolling text）。
App內只能用預設的Roboto字型而且只能是兩個規定的size。
App內一行字長度不可超過120個字。
Visual Contrast App支援夜晚模式，會在暗色背景將文字轉成亮色。
Interaction App一定要支援聲控。
App的按鍵在回應使用者時不可延遲超過兩秒。
翻譯by fanny
Android auto 限制
How to evaluated for driver safety

5. 文字大小
整個介面唯一的字型-Roboto
為了維持閱讀性，整個畫面只能出現2種級數的字體大小*1～2
*Google非常注重「分心」的問題，因此app必須非常容易快速瀏覽。
白天/夜晚模式
減少畫面中「高明度」的視覺設計。
字串長度
請讓文字簡短且易閱讀，若過長則使用”…”
對比度
畫面的排版上，前景與背景的對比度需要在各
種環境條件上（ex晚上、白天、陽光直射時）
皆得以適用。
別讓司機分心
MINIMIZING DRIVER
DISTRACTION

6. 別讓司機分心
MINIMIZING DRIVER
DISTRACTION
背景更深
按鈕色加亮
Bar變成灰黑色
文字反白
白天/夜晚模式
背景淡黑
按鈕色鮮明
Bar為白色
文字為黑

7. 廣告
廣告只能是利用聲音播放的方式出現，不得以
有文字或圖像型態的廣告。
自動滾動文字
不得有跑馬燈形式之文字，滾動的文字被視為
是令人分心的。
手機上的通知和警告
當android auto啟動時，唯一可以傳遞訊息給司
機的方法就是在車機顯示幕上。你的app不該推
播任何形式的視覺內容在手機上。
圖像和影像
你可以在特定區塊放置靜止的圖片，例如在now playing中會有
專輯封面等圖片放置於背景加強整體娛樂體驗，而系統會自動
產生一層透明黑底覆蓋，讓圖片不會影響文字的閱讀。
別讓司機分心
MINIMIZING DRIVER
DISTRACTION

8. 剖析
Android auto app

9. 使用者第一次與車機連結時，手機將會到達Overview畫面這個畫面利用
卡片式的訊息顯示，包含使用者位置、時間、以及一些app通知。
Overview screen Activity bar and app switching
Navigation, Communication, Media and car-
related functions.以Audio為例，點擊icon則
會出現在這個分類中的apps
例如他們最近用過media app,使用者便可以在接上後點擊該卡片繼續剛剛
聽的音樂。App’s 主標將會自動依照該app brand的主要顏色變化，背景亦
然。
介面剖析
ANALYZE THE USER INTERFACE

10. 介面剖析
ANALYZE THE USER INTERFACE
Demand Layer
麥克風icon可以呼叫聲控模式，除了控制基本
功能外也可以搜尋。
Navigation drawer
使用者可以利用drawer圖示叫出內容的分類或是相關功能，
並可以利用back鍵或是點擊麥克風下的有色區塊執行返回動作。

11. 媒體類app框架
*專注在核心內容的設計上，不需要將整個app都放上來
*不需要將設定自由度或複雜度很高的機制放進來，若需要，使用
者可以利用手機操作。例如申請一個帳戶、登入或建立一個新的
音樂清單。
*專注在顯示最近的、經常使用的、和喜好的內容給使用者。
次要功能會放在overflow按鈕
例如 喜愛/不喜愛/radio/隨機 等功能
*一次4個選項+一個overflow按鈕

12. 專注在核心內容的設計
MEDIA CONTROL CARD

13. Media的drawer內會顯示最近歌手、熱門歌曲等選項。提供更快過
濾內容的選項，讓使用者快速得到他們喜愛的內容。
讓使用者更快得到他們想要的
Tailor the audio app drawer to the user
不要利用「all」這種選項，因為太廣泛的選項會讓使用者花太多
步驟去完成一個決策任務。
*一個任務必須在6步內結束
*drawer內架構不可以多於兩層
*頁面一次顯示4-5個選項，更多的部份必須要用滾動的。

14. • 動作選項擺在最上方，並且是群組的
• 同一個level必須保持一致性，以分類為第一層級則內容
物必須降為第二層級，不可以同時混雜擺放。
讓使用者更快得到他們想要的
Tailor the audio app drawer to the user

15. Demand Layer
麥克風icon可以呼叫聲控模式，除了控制基本
功能外也可以搜尋。
觸發
聆聽
處理
回應
讓使用者更快得到他們想要的
All of the interaction happens via voice

16. Notifications
通知被視為干擾駕駛的重要因素，因此是否適合在開車時出現，
必須經過嚴格的規範與評估。
打開
點擊就打開到該頁面
關閉
點擊X 就能關閉
數秒後未反應就會自動消失
重複
當一個app短時間出現太多訊
息要推播時，會合併成一則訊
息。
一張圖/一個代表icon
文字敘述和次要資訊
讓使用者更快得到他們想要的
Anatomy of heads-up notification

17. The End
整理得很辛苦
請大家給予設計者一個尊重
謝謝