魅族 Flyme 2.0 在交互方面有哪些特色與不足?


個人覺得 Smart Bar 幹了一件好事情,未來 Google 也可以考慮這麼干,畢竟 Navigation Bar 現在承載得功能太少了,佔據了寶貴的屏幕還不作為就有點浪費了。

以下分析搬運自極客公園:

原文鏈接:http://www.geekpark.net/read/view/167418

魅族的 MX II 發布會結束之後,留給我印象最深刻的,是 Flyme OS 2.0 中的 Smart Bar。在我看來,它做了一個第三方 Android 定製系統最應該做的事——改進原生系統的缺陷,用一種精巧的方式完成它,並以最簡潔的形式實現出來。

原生 Android 虛擬按鍵的缺陷

在 Smart Bar 之前,Google 就已經嘗試使用虛擬按鍵取代實體按鍵了。這樣的安排有助於 Android 設備在體驗上的統一。但是虛擬按鍵有兩個很明顯的缺點:

  • 佔用屏幕空間。在 Android 的界面布局中,虛擬按鍵佔用屏幕最下方 48dp 的高度,換算成像素的話,一個號稱 1280x768 解析度的屏幕,實際上用於顯示內容的空間是 1184x768
  • 除了最底端的系統級虛擬按鍵之外,按照 Google 官方的應用設計指南,應用普遍會在屏幕最下方再放上一排按鍵。雙排按鍵上下疊加的情況下,很容易導致誤觸的發生。這也是很多第三方廠商堅持使用實體按鍵的原因之一。

Smart Bar 的出現,在很大程度上規避了上述兩個問題。

整合,與釋放

Smart Bar 的作用,簡單的來說,就是:整合界面元素,釋放內容空間。

下圖是原生 Android 系統的底部結構,按照官方命名方法標出了 Action Bar 和 Navigation Bar:

下圖是帶有 Smart Bar 的 Flyme OS 底部結構:

這是發布會上的展示圖。從圖上我們可以看出,這個 Smart Bar 在豎屏狀態下主要的改動是合併了原生系統中在屏幕最下方上下疊加的 Action Bar 和 Navigation Bar。從不同的展示圖中我們可以注意到,Smart Bar上只有五個可操作圖標,多餘的圖標都進入了右邊的菜單鍵中。從各種角度上說,這樣的設計都使得誤操作概率大大降低。

如果你有讀過 Google 官方的 Android Design,相信會對這段話感到非常的眼熟吧?在 Android Design 中,Google 曾經強調底部 Action Bar 上不能有超過五個按鍵,而魅族 Smart Bar 在所有展示圖裡按鍵的上限都是5個——多餘的全部進入了右邊的菜單鍵中,而且連菜單鍵的位置都和官方 Action Bar 里的那個菜單鍵位置對應。

再看看這個橫屏模式下的 Smart Bar。它同樣對各種橫欄進行了整合,在Smart Bar 中統一顯示,最大限度地把界面空間留給屏幕上的內容。並且所有的操作按鈕都位於屏幕頂端的左右兩邊,便於在橫屏模式下雙手操作。這是不是很像 Android 4.0 平板的作風?在橫屏模式操作支持這一方面,Smart Bar 比其它國內第三方 ROM 甚至 Google 官方 Android 4.1 的解決方案都要更好些。

借鑒,與創新

在看到 Smart Bar 的時候,我非常自然的想起了當初 Google 為了相同的目的而創造出來的一種交互形式:Combined Bar。它同樣整合了平板上的各種橫欄,並把操作按鍵放在屏幕底部的左右兩邊,適合平板持握下的雙手操作。

這個對雙手操作極端友好,而且節省屏幕空間的設計,Google 在 Android 4.1 之後不知何故放棄了。而魅族的這個 Smart Bar 和 Combined Bar 的設計思路如出一轍,並且在 Combined Bar 的基礎上對用戶體驗的提升更進了一步。試想,你所有的操作都被集中在慣用手的大拇指能夠很容易操作的地方,而且還不容易誤觸… 是不是很夢幻?為什麼之前都沒有人好好利用到這點呢?

但是我非常好奇的是,魅族是怎麼做到將 Action Bar 中的按鈕整合進Smart Bar中的。魅族方面表示只要是按照 Android 4.0 規範進行設計的應用都可以無需改動直接兼容,而在魅族的演示中,除了這些按照標準製作的應用之外,沒有套用標準的老應用也同樣有很好的集成效果。不知 Google 的 Android 團隊對這個 Smart Bar 有何感想。反正我可以說,他們的臉色必定不會好看:當初被拋棄了的 Combined Bar 以另一種方式出現在了 Flyme OS 2 上,而且還進行了大量的優化和改進,用比較誇張的話說——打臉打得啪啪響。

魅族的 UI 設計師一定有認真的考慮過 Android Design,站在用戶的角度設身處地地考證這些設計。你可以把 Smart Bar 看作是 Action Bar(實際上它也確實是 Action Bar 的一種形式),但是它又同時起到了 Navigation Bar 的作用,同時還可以和標準與非標準應用有良好的兼容性,比 Google 的原生解決方案要好很多。

在實際的使用中,它確實有效地節省了屏幕空間,提高了屏幕使用的效率。這也正是當初 Google 在 Android 3.0 里使用 Combined Bar 的初衷吧?結語

把 J.Wong 的人品性格之類的話題拋開不談,把將這種交互上的創新命名為 J.Wong 交互到底合適與否的問題拋開不談,把 J.Wong 設計的外殼與邊框拋開不談,這次,在 Smart Bar 這個簡潔精巧的改進上,我們看到的,是真正的用心。


需要注意到,這是一個非標準Android的設定,雖然名義上使用者不需要承擔魅族試圖增加Android碎片化的責任,但最終承擔的人是使用者。

smart bar許諾了一個美好的未來,但它還沒有證明這一點。這是現在選擇它的風險。

非標準Android的問題,如果一個人是從HTC的One系列以及別的品牌的按照nexus設備的鍵盤定義的手機遷移到三星的galaxy s3/note2的時候,就會注意到非標準帶來的不便。

同時在另一面,前面提到的非標準鍵盤布置的手機是地球上android設備中賣得最好的


SmartBar是對安卓原生控制項的一個大膽而有創意的改造。對於嚴格遵循Bottom ActionBar設計 (http://developer.android.com/design/patterns/actionbar.html) 的APP來說,這是絕佳的方案:把雙層合併為單層。

當然,牛逼的創新必然引出新的挑戰,例如:

1、 大部分APP,都不採用安卓4.0設計模式。尤其國內流行的APP,仿iOS的居多。

據說,在魅族自帶的應用商店裡,只有15%的APP完美兼容和部分兼容這一設計。這時候的效果,可能是:

或許可以認為,這種情況至少不比原生安卓使用虛擬導航欄的方案更差,大家都是雙層,誰也別說誰。但這忽略了一點:原生安卓虛擬導航欄方案包含了home鍵,因此真機不會再有home鍵;而MX2 SmartBar還要為Home鍵多留出一層的空間。相當於原生是2層,MX2是3層。

所以,真實的MX2是:上面的截圖加上home鍵。算是一個缺憾。

2、 對於兼容這一設計的APP,如果ActionBar本來有5個按鈕,合併到SmartBar後,只能在首頁留下3個,其他塞進Action
Overflow(…)。

留下哪3個,不知道MX2是如何取捨的。或許是從左到右,自動取前3,剩下2個自動進入三個點菜單。如果自動取前3,那麼,就要求APP設計者對於按鈕功能的優先順序排序正好符合這一標準,從左到右依次降低。

個人觀點,在國產廠商里,魅族是最有態度、最用心做設計的,也始終秉承了簡約的風格,非常難得。他們的創新,無論是思路、勇氣還是缺憾,也都值得我們借鑒。


Smart Bar

將Android原生系統的Action Bar和Navigation Bar兩層底欄整合成一層Smart Bar,既節省了屏幕空間也避免了上下兩層Bar間的誤操作。應用開發商只要遵循 Android 4.0 的 Action Bar 標準進行開發即可在flyme中融入Smart Bar,但是,如果應用開發商沒有按照標準開發,那就會出現兩層Bar,這時返回按鈕單獨佔據一層Bar的界面會顯得特別彆扭,而目前沒有按照標準開發的應用似乎不在少數,希望能有更多應用遵循標準來開發。實例見下方:

home鍵

鎖屏下雙擊home鍵喚醒屏幕,向上滑動解鎖屏幕。運行時雙擊home鍵從底部浮出多任務管理界面;

從home鍵快速劃向屏幕裡面是全局返回鍵。可以解決部分第三方app全屏時沒法點擊back的問題;

長按home鍵會使屏幕變暗,鬆手後鎖屏。變暗後不想鎖屏就把手指劃向屏幕裡面取消鎖屏。

觸控面板

MX2的下半部分一整塊都是觸摸面板,在觸摸板區域任何地方的操作flyme系統都會知道,這拓展了屏幕的觸控範圍。

滑動選中

在文件管理中,通過滑動可以快速選擇多個文件。


Smart Bar 算個亮點吧? 當然,也有問題,要詳細說說。。。轉自魅族論壇:

詳解 Smart Bar

------------

1 Smart Bar 的自動隱藏

要求全屏的 Apps , Smart Bar 就會隱藏起來。

那麼,什麼樣的 Apps 會全屏?這是由 Apps 的開發者決定的。

如果 Apps 的開發者覺得需要全屏,比如位元組社的書籍閱讀界面,他會設置一個值告訴系統。那麼, Smart Bar 就不會出現。

(截圖1)

(另外,實際情況更複雜些,比如 Android 上有多種全屏模式。不過,作為用戶可忽略)

一般而言,全屏時,開發者會在界面上做完善的導航。比如 截圖1 左上角的小房子圖標。此時,系統的 Back 就不是必須的。

萬一,開發者沒有考慮?沒關係,從 MX2 的觸摸 Home 鍵向上滑動,仍然可以 Back 。同時,屏幕上也會給出提示。是的,既然是手勢操作,提示上當然要做的更用心一些了。

(截圖2)

這裡需要強調的是,全屏屬性和 Android 4.0 的 Action Bar 標準無關。在 Flyme 出現之前,當然,也在 Android 4.0 出現之前的 Apps ,Smart Bar 都可以對應(即可以自動隱藏)。

2 Smart Bar 的一層顯示

這是 Smart Bar 最完美的狀態。但是,這裡需要一個條件,就是 Apps 需要遵循 Android 4.0 以後的標準開發。

這些 Apps 說多不多,說少也不少。比如所有 Android 內置的 Apps ,幾乎都是基於 Android 4.0 之後的標準開發的了。代表即為 Google Maps 。

(截圖3)

所有 Flyme 2.0 的內置 Apps 當然也是基於這個標準開發的,所以,他們的表現,當然是完美的。

(截圖4)

第三方使用這個標準的也有,比如布卡漫畫,比如 Pinterest ,比如四次元等等。

(截圖5)

這裡需要強調的是,所有這些 Apps 都不是為 Flyme 定製的,他們遵循的是 Google 的標準,而非魅族的。相信隨著時間的推移,接受這個標準的人會越來越多。

3 Smart Bar 的兩層顯示

有些 Apps ,比如微博,微信,Instagram。他們使用的是 iOS 的設計風格。這時很可惜,會出現 5 tabs 和 Smart Bar 同時出現在下面的情況。

(截圖6)

這些 Apps 的 5 tabs 並非 Google 的標準。他們多是使用第三方開源實現來做修改。這時技術上系統很難會自動適應,於是只好在下面變成兩層。

雖然,這是 Android 交互標準不斷變化導致的分裂。而且, Smart Bar 並沒有讓情況惡化: Google 的 Navigation Bar 在這裡也同樣會是兩層。但是,魅族仍然會努力改善這種情況。

辦法也很簡單:推動重要的 Apps 走向 Android 4.0 的標準。畢竟我們使用的是 Android 手機,而且 iOS 的交互在更寬,更大的屏幕上,也有他的問題。(比如右上的功能不好按,左上的導航實際上也沒有下面的方便等等)

目前和微博的合作在進行中,其他重要的 Apps 也會單獨聯絡。另一方面,隨著時間的推移,相信會有更多的第三方接受 Google 的新標準。

4 最後的話

曾經,我們的祖先並非地球上最領先的物種。另一支智人更有優勢:他們的牙齒善於咀嚼球狀植物,食物來源穩定。

而我們的祖先能在進化中勝出,恰恰是因為他們缺乏這種優勢,就更加敢於嘗試,甚至冒險去狩獵食肉動物。於是,當環境變化?

那支智人被淘汰了。

今天 Back , Home , Menu 的三硬鍵,就類似「智人的優勢」:

短期內看起來安穩,但是隱患已經可以預見。 Menu 是鍵盤時代的化石(去看看 S60 和黑莓?),而對 Back 的詬病也不少。大屏幕下, iOS 經典導航的劣勢也逐漸顯現。

Smart Bar 是個新的嘗試。改進了 Google 的 Navigation Bar 和 Action Bar 的設計。在一些情況下,有更好的結果。即使在最不利的情況下,也不會比 Google 原生的更差。

我相信,隨著 Google 新標準的普及和手機屏幕的逐漸變大, Smart Bar 以及他後續的改進,會讓魅族在智能手機持續變化的生態中勝出。

就像人類的祖先一樣。


flyme2.0的亮點和敗筆都在smartbar了。

知乎上把smartbar誇上天了都。使用了mx2一周多。給我感覺更多是噁心頭疼。(可能我運氣不好吧。喜歡的軟體都……)

我覺得 smartbar在現在看上去很酷。眼光再長遠一些則是落後的設計。

以下全是引自。

這是我看過的最客觀評價smartbar的了。

▲四次元, 一款完全 Holo 的優秀的微博客戶端, 由於在 Split Action Bar 上放置了 Borderless Bottom(一種按鈕控制項), 導致 Smart Bar 排版悲劇. (感謝 @CarlosLOL 的截圖) 右圖是四次元在我的手機上的截圖.

其實, 四次元的情況已經算是比較好的了, 有些應用明明完全符合 Android Design, 在 MX II 上卻會發生詭異無比的情況:

▲撫波, 一款非常輕便的 Holo 風格發微博工具, 在普通的 4.X 上是無比和諧的 Holo Theme 的存在, 但是在 MX II 上會出現雙重 Action Bar 和讓 Smart Bar 變成白條. 左圖來自撫波的開發者@碎星De雨, 右圖是我手機上的截圖.

還有更悲劇的情況:

▲上圖是一款剛剛上市的當紅照片處理應用 Snapseed. Smart Bar 直接將其濾鏡選擇區域遮擋. Snapseed 應用完全符合 Android Design. 這是一個全屏應用, 在正確的情況下 Smart Bar 應該隱藏起來. 然而在 Flyme 上, Smart Bar 卻沒有隱藏. 右圖是在我的手機上的截圖.

▲Catch Note 這個例子非常的典型. Catch Note 是個完全符合 Android Design 的同時做到與眾不同的應用. 它最大的與眾不同之處就是在 Split Action Bar 上放了一個自製控制項. 自製控制項對於一個應用的個性化而言是不可或缺的——除非開發者僅僅滿足於」和原生應用長得差不多」這種水平.

那麼以後呢? 將來的趨勢是什麼? 難道你以為大家都會乖乖的和 Google 一樣只往 Action Bar 里丟 Icon? 將來的趨勢, 是 Action Bar 集成更多的控制項. 可以料想, 像 Catch Note 這樣的, 在 Action Bar 上利用自製控制項實現個性化和更多功能的應用會大規模出現. 這些事情如果發生在原生 Android 系統上, 對 Navigation Bar 是不會有任何的影響的. 但是到了那時, Smart Bar 的存在就只剩下限制這些控制項的發揮和浪費空間兩個作用了——不會更好, 只會更差. 當然, 魅族可以不在乎這些, 因為他們想要打造一個封閉的生態系統. 只要讓系統內所有的應用都只在 Action Bar 上放 Icon 就可以了.

就國內 Android 生態而言, Smart Bar 看起來似乎是頗有遠見的設計. 但是就整個 Android 生態圈而言, Smart Bar 的存在反而是嚴重製約了大陸開發者對 Split Action Bar 的利用, 扭曲大陸開發者對 Android Design 的理解, 將大陸開發者引導向一個錯誤的方向. 當國外開發者都在積極地探索 Action Bar 的無限的可能性時, 魅族對 Android Design 初衷的誤解和並不聰明的 Smart Bar 一起, 給國內開發者對 Android Design 的理解設下了又一道障礙. 從這個角度來看, 不得不說, 開發並使用 Smart Bar 是個極端短視的舉動.

引自:

http://www.phonekr.com/smart-bar-or-not/

真心推薦!!!


其實也不錯,能在業界大膽創新的公司在天朝已經算少了,看到小米沒有設計的設計真是噁心到吐啊,只會堆硬體,吹n皮,對比於魅族的創新和公司勤勞務實來說 。必須贊一個。


Smart Bar和home鍵看介紹不錯

更新: smart bar應用不兼容 只有圖標 識別率略低

home鍵做的很漂亮 鎖屏的細節很好


@碎弦 Catch Note在smart bar 下的效果如下,設備為MX3。其實不如想像的那麼糟糕,魅族的產品規劃布局上,爭取手機應用都可實現單手操作,即使是現在5.1寸的大屏,smart bar 在優化上,增加了自動調節觸控位置的功能,也是滿足了上敘的需要。

在「返回」的操作上,盡量避免雙手操作,去按左上角的按鍵,單手按鈕點擊smart bar 即可,此外smart bar 的menu也集成應用相關設置內容。

不過在smart bar的兼容性,確實是魅族工程師們要考慮的問題!


兼容性不好,弄個隱藏功能吧。


smart bar的第三方兼容性還有待提高,但smart bar確實是flyme 2.0的一大設計亮點,過度動畫還是有些過於簡單,交互上手勢還是簡單了一些


我覺得Smart Bar意義在於:

  1. 服務MX2 Home鍵設置,變物理鍵的按為屏幕的觸,統一指尖感受
  2. 節省屏幕空間,提升內容區域
  3. 統一App與Flyme OS風格和操作習慣。

這是MX到MX2的進化,三物理鍵機器無需效仿。整合還需App開發商額外投入按4.0標準開發。

Smart Bar與Home觸控鍵皆為MX2定製,讓MX2前面板比MX、三物理按鍵機更簡潔。Smart Bar對於MX來說,可能反而多餘,佔用屏幕空間。

某個角度看,MX2的設計也許屬於過渡,會不會下一代徹底取消HOME鍵呢? 就看如何處理返回桌面和喚醒屏幕的操作,觸屏上的手勢操作靠譜么?@李楠


Smart Bar為什麼不增加一個隱藏功能呢?


flyme2.0雖然還存在些許不足,但比起原生態的android可以說是好太多了,推崇簡介界面的魅族真的很好,是一家用心做手機並真正考慮用戶體驗的公司。


推薦閱讀:

魅族 Pro 7 會加入什麼黑科技?
幫女朋友的mx2升級flyme4,結果開不了機,只能清除數據重新刷了。沒有備份,怎麼跟女朋友解釋?在線等。?
為什麼魅族要開放 Flyme 適配非魅族機型,會有何影響?
魅族是不是已經放棄MX4PRO以及它的用戶們呢?
如何評價魅族楊顏帶領的flyme團隊? ?

TAG:魅族科技 | 交互設計 | Android | Flyme |