2021-3-8 資深UI設(shè)計(jì)者
用戶可以通過內(nèi)置的觸摸屏來與 Carplay 直接進(jìn)行交互。高保真屏幕可能會比低保真屏幕,在交互效率上更高,更低延遲,支持更多手勢。Carplay 的交互基本采用的都是單指交互,具體可以參考下方列表:
在設(shè)計(jì)交互的時候,盡可能少地使用觸摸交互,避免用戶在駕駛過程中分心。
Siri 是 Carplay 的基本功能,無干擾的語音讓用戶和程序之間的交互更加自然和安全
即使看不到 Carplay 的屏幕,依然可以使用方向盤上的語音命令按鈕來激活 Siri。激活后,Siri 會針對語言進(jìn)行處理和分析,并且轉(zhuǎn)換為可用的指令。
具體可以參與 SiriKit 編程指南。
動畫可以讓屏幕上的元素,擁有一層附加的視覺效果。如果方法得當(dāng),動畫還能呈現(xiàn)狀態(tài),提供反饋,增加用戶直接操控時候的感覺,并且告知用戶可視化操作的結(jié)果。
成功的品牌設(shè)計(jì)并不只是把 LOGO 塞到 APP 當(dāng)中,出色的 APP 能夠巧妙地使用字體、配色和圖像來構(gòu)建獨(dú)特的品牌形象。
關(guān)于這方面的設(shè)計(jì),可以詳細(xì)參考 iOS 設(shè)計(jì)規(guī)范中的 配色、版式以及 圖標(biāo)和圖像 這三個章節(jié)。
在品牌設(shè)計(jì)上,Carplay 要求設(shè)計(jì)師:
通常,配色可以提供交互性,提供視覺連貫性,并且對界面賦予生命力。
Carplay 支持不同像素密度不同縱橫比的顯示,但是這也意味著在實(shí)際布局設(shè)計(jì)的時候,要格外小心,盡量讓你的設(shè)計(jì)在不同的屏幕分辨率和長寬比之下,都顯得足夠正常。
Carplay 采用的字體是蘋果的 SF 字體。你可以在這里下載到字體:
和 iOS 類似,在 Carplay 當(dāng)中,屏幕分辨率也分為 1x 2x 和 3x。
每個 Carplay APP 都應(yīng)該有一個顯著突出的圖標(biāo),確保在駕駛的時候可以輕松點(diǎn)擊到。
如果你設(shè)計(jì)的 APP 當(dāng)中,需要的圖標(biāo)并不存在于系統(tǒng)圖標(biāo)當(dāng)中,或者系統(tǒng)圖標(biāo)與你的 APP 并不匹配,可以自定義圖標(biāo)設(shè)計(jì)。
系統(tǒng)本身內(nèi)置了許多小圖標(biāo),服務(wù)于日常各種不同的任務(wù),通常這些小圖標(biāo)會使用在導(dǎo)航欄和標(biāo)簽欄當(dāng)中,盡可能使用這些內(nèi)置的圖標(biāo)。
上拉菜單是一種特定的彈出菜單,通常從屏幕底部彈出,并且包含2個以上的選項(xiàng)。不過在 Carplay 當(dāng)中應(yīng)該盡量避免使用上拉菜單,在 iPhone 上倒是可以使用它,但是不要在 Carplay 中顯示。
在內(nèi)容加載的過程當(dāng)中,請勿讓屏幕保持靜止,或者空白,使用活動指示器確保它看起來沒有靜止。
如果可以的話,可以在加載過程中提供對用戶有幫助的信息。具體可以參考 UIActivityIndicatorView
警告會用來通知用戶一些關(guān)鍵性的信息,警告通常由標(biāo)題、可選信息以及一個或者多個按鈕組成。除此之外,警報的視覺系統(tǒng)是靜態(tài)的,無法自定義。
警告最小化呈現(xiàn)。由于警告本身會破壞用戶體驗(yàn),所以請?jiān)谥匾那闆r下使用警報。
相關(guān)開發(fā)人員可以參考這份文檔:UIAlertController
按鈕通??梢杂脕碛|發(fā)一些特定的操作,具有可自定義的背景,并且可以包含標(biāo)題和圖標(biāo)。和 iOS 不同,Carplay支持的按鈕樣式非常有限。
標(biāo)簽是推送到屏幕上的一條短消息,這個標(biāo)簽可以顯示任意數(shù)量的靜態(tài)文本。在設(shè)計(jì)標(biāo)簽的時候,盡量保持標(biāo)簽清晰易讀。具體開發(fā)可參考UILabel。
導(dǎo)航一般在屏幕的頂部,通常導(dǎo)航欄右側(cè)會有返回按鈕,中央是標(biāo)題。有時右側(cè)會有其他的可交互的控件。
滾動視圖讓用戶可以瀏覽到更多的內(nèi)容,用戶可以用滑動或者輕拂來進(jìn)行瀏覽信息。
標(biāo)簽欄通常出現(xiàn)在屏幕頂端,并且用戶可以借此快速切換。邏輯上標(biāo)簽欄可以包含無限多的 Tab,但是可見的標(biāo)簽數(shù)量,會根據(jù)實(shí)際顯示尺寸而有所不同。
表單通常會以單列的樣式存在,干凈有效地呈現(xiàn)大量信息。
在具體的表單條目的設(shè)計(jì)上,也有詳細(xì)的規(guī)格要求。
默認(rèn)樣式,左側(cè)可放置圖片,并且標(biāo)題也是靠左對齊的。具體參考文檔:UITableViewCellStyleDefault 以及 UITableViewCell
副標(biāo)題樣式。這是包含標(biāo)題和副標(biāo)題的一種樣式,兩者靠左對齊,上下排布。具體參考文檔:UITableViewCellStyleSubtitle 和 UITableViewCell
Value1 樣式。標(biāo)題靠左對齊,副標(biāo)題靠右對齊。具體參考文檔:UITableViewCellStyleValue1 和 UITableViewCell
Value2 樣式。標(biāo)題和副標(biāo)題文本都靠右對齊,具體參考文檔:UITableViewCellStyleValue2 和 UITableViewCell
文章來源:優(yōu)設(shè) 作者:陳子木
藍(lán)藍(lán)設(shè)計(jì)( www.teruid.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
藍(lán)藍(lán)設(shè)計(jì)的小編 http://www.teruid.com