如何評價最終版 Apple CarPlay 的界面設計?

跟 WWDC 2013 上展示的很不一樣:

Apple - CarPlay


如何評價?我認為仍然是精彩的。即使在這樣一個精簡的界面上。

很多人批評Carplay的策略過於保守,並臆想它應該有的前衛功能。我認為這是缺乏蘋果式「設計」思維的表現。設計是The Whole Thing,是工業和界面設計,是用戶體驗,是產品的本質。

體現在商業上,是做成熟的、非概念的產品,放棄不能控制的部分,在能控制的部分提供蘋果式的完整體驗。

這個體驗對於Carplay來說,就是優雅的界面設計和交互體驗。

1、漸變色階

iOS7剛發布那會,圍繞圖標設計在知乎上有很多吐槽。(iOS 7 中的 Safari 圖標是不是非常丑?)

對於Safari的圖標設計,那時候我的態度還有些含混,但現在極愛之。為什麼?

我那時候的品位還不夠,現在提升了。

現在我感受到了,白色、彩色和細線在設計方向上是高度重合的。也就是說,明亮、鮮艷和銳利在感官上是一回事,並因為共振效應將感受推到了一個強度。

配合諸多汽車的黑色中控台,Carplay以黑色為設計基調,這使得設計向另一個方向轉化。

和白色不同,黑色講究隱藏,講究「低調」的協調,但iOS7的圖標配色過於明艷,顯得突兀。這也是很多人覺得丑的原因。同樣道理,白色在黑色界面上的對比也是強烈的。

怎麼辦?讓它灰一些。

我無法看清是否調低了圖標的彩度,但我注意到整體界面的最亮色調用灰色替代了白色,包括圖標。

程序打開後的界面設計,和我正在做的一個東西非常類似,都來自於漸變色階。

要點是用從深到淺均勻漸變的色階,來區別不同的功能區。

這是優雅的設計,體現了蘋果的功力。

反例:

為什麼丑?因為缺乏品位。

這裡面的黑白灰各個色階過於分裂,雖然表面是扁平化了,但黑色仍然是滯重的一坨,壓得整個界面喘不過氣。

2、居左的狀態欄

回到這個界面。

狀態欄和Home鍵移到了左邊。

@David Chang 的回答給出了一個重要原因。

圖片來自@David Chang 的回答。

另外,我還覺得,這也和比例相關,狀態欄放在下面,則界面過扁,而且要犧牲home鍵(在有的車型上也包括其他按鍵,比如溫度)的觸控面積,放到左邊是一個不錯的改進。

狀態欄包括了虛擬按鍵Home鍵,所以要模擬成界面外的感覺,用黑色聯繫實物環境:黑色的中控台。黑色擁有最高控制級,作為最深色/最高的圖層壓在其他圖層上面。

狀態欄和導航欄高度相當,並形成自然的尺寸分割。網格從中而來,將高度劃分為5個半頂欄。

為什麼是5個半,而不是5個或者6個?因為要暗示界面是可以向下滑動的,並且和狀態欄分屬不同圖層。

3、嵌入程序中的臨時圖層:Siri

Carplay的Siri界面是有啟示意義的,因為它展示了一個無時不刻的語音界面可能的樣子。未來的iTV會是類似的嗎?

打開電話程序,交互動畫分成前後兩部分。前半部分表達臨時圖層的出現,圖標朦朧化的同時,Siri的話筒圖標隨之呈現。(這裡面有一個慣性的頓挫感,朦朧化結束的時候彷彿有一個停滯的時刻。)後半部分表達圖標界面的放大,朦朧的圖標在臨時圖層下迅速放大並消失,Siri界面完整體現。

視頻封面蘋果CarPlay體驗實拍視頻欣賞:功能不多,但運行流暢視頻

從交互上理解,打開電話程序時,同時啟動了兩個交互動作。

Siri作為臨時圖層出現,彷彿在鏡頭上安裝了一個柔焦鏡,同時鏡頭向圖標圖層做相互運動,界面從圖標界面切換為聯繫人界面,但隱藏在Siri界面之後。

為什麼能確認是聯繫人界面?

因為Siri此時需要進行的語音操作就是呼叫聯繫人。因為右上角有」顯示聯繫人「的按鈕。

為什麼」顯示聯繫人「按鈕在右上角並且有向右箭頭的提示?

因為狀態欄在左,左為上,則右為下。

iOS7的圖層邏輯在這裡得到延伸和精確表達。建議閱讀 空間深度與鏡頭運動——iOS7的圖層邏輯 - 表面 - 知乎專欄 一文來加深理解。


在 Apple WWDC 2013 上公布的最初版本設計,並沒有太多考慮車廠底層系統的 UI/UX 設計,所以模擬展現的效果是這樣:

然而,事實上不同車廠,不同車型的顯示屏配備並不會完全一樣,很重要的,譬如說屏幕面積,長寬比例,這些不同,很大程度制約了 CarPlay (iOS in the Car) 的界面設計。

從 Volvo 展示的視頻(Volvo and Apple CarPlay - YouTube)看來,CarPlay 的最終界面設計是雙方妥協的結果

CarPlay 只是整個中控屏幕界面的一部分,如何與框架和諧地共存,就是 CarPlay 需要考慮的事情。譬如說把狀態欄和 Home 移到左邊,為汽車底層的車載系統控制界面讓位。等等。(Volvo 這個展示車型的屏幕,看起來跟 Tesla Model S 的 17「 中控屏幕看起來一般大。可惜卻不能完全展示核心內容)


這應該是最終的樣子
ios in the car 是一個松耦合的設計,手機和原有的車載系統可以完全獨立
就ui方面,現在的安卓和ios趨同
上面我提到松耦合,實際上看到的界面不能理解成一個系統,ios in the car 不是傳統的意義上的車載系統,確切說就是手機。
我想從蘋果的生存之道來理解這一產物,源於封閉性,這是一個不折不扣的獨立於原有車載系統的產物,不存在深度整合。但是呢看起來像是聯繫在一起了,不得不承認蘋果的功力。
我害怕這是一個起大早,趕晚集的東西,車載領域就像手機一樣,可能被幾乎不要錢的安卓席捲,看看和蘋果合作的車廠不太像是尋常百姓能承受的起。


Google 開發的話。只可能更丑。。

UI主要的目的是方便使用。沒有使用之前評價UI好壞根本毫無意義。ios 7 的時候罵聲一片,但用過的人絕對會支持ios7 的簡潔和明了。之前的擬物設計就是太繁文縟節了。

人類文明就是要靠精英們引導,他不做出來讓你用,你還真想不到。。

至於carplay 。我覺得這是很好的開始,功能齊全,希望在操作方式和流暢性上超越之前車載系統。

一個標準化的UI意義就在於減少學習成本,擴大通用性。我的音樂都在手機里,這樣我再也不用刻CD了。那些所謂內置500G音樂硬碟的豪華車也可以去死了。。那些車載價值1000美元的GPS導航界面還丑的要死的可以去死了。。

iOS carplay 成功之處就在於定位:絕大多買這幾款車的主都有iPhone . 而且他並不會取代汽車自己的操作系統, 其實僅僅是Siri + 手機第二屏,但卻省去了GPS和iPod player 等現代汽車必備的配件,也能更大擴展iTunes 用戶的受益面(別和我說android 用戶的音樂消費能力)。。

此外我想說的是,這更能增強maps 的實力。現在maps 已經好多了,在道路辨識度和視覺設計上比google maps 要強。誰用誰知道。maps 的視圖傾角更大(看得更遠),且主路輔路顏色差別更直觀,設計更符合視覺原理,在北美這個500米之內有幾十個高速出口的地方,你絕對不會像google maps 那樣走錯。google maps 可能會提示你好出去了,但是面對前面排列緊密的3個出口,看著google maps 那麼不清楚的道路拓撲,你絕對會提前一個口然後走錯。


題主的疑問是Carplay的界面設計如何評價,自然很好啊,iOS系統難道不好么。再說界面的好壞首先是要能用起來,這一點幾乎是毫無疑問的,然後剩下的就是個人喜好問題了,說美與丑意義不大。

既然定位是iOS in the car,最大的優勢就在於它仍然還是iOS,對於使用過iPhone手機的人來說,上手門檻幾乎為零,只不過旋轉了一下屏幕。

看了以下視頻發現,目前Carplay最大的問題是操作不便,界面還不支持滑動,僅支持點觸。在車輛行駛的過程中操作起來問題還是蠻多的。

視頻封面CarPlay視頻


你們不表揚不知道,我做原型經常自定義那個你們所謂的高端深度灰和黑,怎麼辦,一不小心被高大上了。


推薦閱讀:

Car Play 和 Android Auto 的發布會對未來汽車設計帶來怎樣的變革?

TAG:用戶界面設計 | CarPlay |