首頁>科技>

小窗模式 2.0 設計歷程

小窗模式自 Flyme 7 上線以來,作為一個實用又輕量的功能,深受使用者的喜愛。

通知卡片上的“小窗開啟”,是一種便捷的回覆通知方式,不必切換應用就能快速回復聊天訊息。

小窗模式使用場景示意

隨著更深入的日常使用,我們逐漸發現小窗功能在一些場景下的表現還不夠出色:

又或者通知欄有多條未讀訊息時,若每條通知都去使用“小窗開啟”,操作將很繁瑣。

類似的場景還有不少,說明小窗模式仍有較大的提升空間。“希望小窗能有更主動的開啟方式,可以更方便的處理多條通知”。這成為新版小窗中我們想要實現的目標。

在隨 Flyme 8 釋出的小窗模式 2.0 中,我們著重對“隨時可用”和“多條通知”的場景進行了設計,推出了兩個重要的功能—“主動撥出”和“通知氣泡”。

主動撥出

通知氣泡

早期的主動撥出

我們最初構思的方案是通過手勢直接撥出小窗主體,來達到隨時可用的目的。在小窗右上方有“選擇應用”的按鈕。“選擇應用”可以讓使用者在不關閉小窗的情況下,切換不同的應用,讓主動使用小窗時目的性更強。

早期的主動撥出

但我們面對最大的難題是:

撥出的小窗裡面預設顯示什麼內容?主動撥出時所包含的可能性非常多,無論是固定一個預設應用,還是顯示上一次開啟的應用,都不能很好相容各種主動撥出場景,從而導致了“必須先撥出小窗開啟一個應用,才能去選擇另一個應用”的情況。這種“繞”的使用方式顯然不是我們想要的,然後我們開始尋求更優的解決方案。

對選擇應用的改進

我們嘗試跳出了原有的“手勢觸發→開啟小窗→切換應用”方案,在眾多的改良方案中,我們選擇了“手勢觸發→選擇應用→開啟小窗”方案,它有以下特點:

1. “觸發→選擇→開啟”更符合我們日常的使用習慣;

2. 選擇應用的步驟可以融合到撥出手勢中去,與最初的應用選擇方式對比它更輕量;

我們希望使用者在操作時思路更加清晰和自然,所以以該流程作為基礎進一步設計小窗。

小窗模式的進一步改進

通過手勢撥出選擇應用的選單,對於選單上應用的排布方式,我們曾嘗試了各種方案以尋求最佳的“操作手感”,包括縱向、橫向,塊狀、扇形、圓形排布等。在眾多的排布方式中,我們最終選擇了扇形排布。扇形的好處在於選擇應用時手指只需根據不同的角度要沿直線滑動即可,避免了因“拐彎”或“折返”讓操作變得複雜。同時,手指滑動的路徑上只有一個應用,中間不會經過其他應用圖示,避免了誤觸開啟其他應用的情況。

排布方式的確定

當手指落點在應用圖示上,我們特意使用了線性馬達的振感來表達反饋,它可以讓使用者選擇應用時心裡更“踏實”,盲操更“精準”。酥爽的振感甚至會讓人沉迷在扇形選單上反覆滑動。

最後為了提高扇形選單的適用性,我們讓扇形中的應用可以自定義,並且針對應用的數量有不同的排布方式,兼顧不同使用者的使用習慣。

不同數量的排布

通知氣泡的誕生

有多條聊天通知的時候,要使用小窗處理這些通知,可以依次點選每條通知上的“小窗開啟”按鈕,也可以在小窗開啟應用之後,自行在應用中處理各種訊息。無論是哪種方式操作都較為繁瑣。我們設想:如果能讓所有的未讀通知,在小窗開啟後仍能以某種形式繼續顯示,並且點選就能立即檢視,那麼小窗處理通知的效率將會提升很多。

通知氣泡

在探索通知以什麼形式繼續在小窗上顯示的過程中,我們列舉了通知的組成部分:

我們以“發訊息的人”作為切入點,因為“發訊息的人”能和每條通知一一對應(來源應用、時間則無法和每條通知對應),例如看到某人的頭像,就有很大概率知道是誰發來通知,但如果只看到某個應用的圖示,就無法很好的知道是誰發來的。

小窗開啟後,為了讓通知以“發訊息的人”的形式繼續顯示,我們提取了訊息傳送者的頭像,以代表該人發出的通知,顯示在小窗的周圍。

聯絡人列表

我們還對通知氣泡的顯示邏輯進行了較為謹慎和剋制的設計—僅顯示來源於當前小窗應用的通知氣泡,不會同時顯示其他應用的氣泡。這樣做是為了讓小窗和通知氣泡是一種包含的關係,氣泡邏輯更簡單,學習成本更低。

同時為了讓操作更順手,我們對通知氣泡的排布進行了調整,整體顯示在小窗下方,在大屏上操作更舒適。

小窗的未來

目前的小窗並不完美,我們也不輕易說完美。

在上文中,我們當前採取了較為剋制的通知氣泡方案,但也不代表會停下探索的腳步。我們對通知氣泡有更激進和前衛的嘗試。

每一個通知氣泡除了聯絡人的頭像之外,也會顯示來源應用的圖示。這樣,點選不同應用的氣泡,小窗也隨之切換到對應應用的會話頁面。有多條不同應用的訊息時,處理效率大大提升。

我們認為這個方案的想法是非常有遠見的。它打通了小窗、通知和應用之間的渠道,讓小窗更加靈活和便捷。但目前,我們仍需要解決一些問題,例如使用者在主動撥出某個特定的應用小窗時,可能其他應用的氣泡反而是一種干擾,又例如,如何去避免氣泡數量過多等等。

這種想法仍有“打磨“的空間,我們將在未來的某個時間,給使用者帶來一個能完美處理各種通知,並且輕量簡潔的小窗模式。如果你有好的想法,非常歡迎和我們一起探討。

同時,我們也在對小窗的其他細節進行完善,希望小窗能永遠保持現鮮活的生命力,腳踏實地為使用者帶來更多好用的功能。

最新評論
  • 1 #

    主動撥出,個人認為圓點方便,扇形有時感覺不靈敏(劃過頭容易誤碰其它),如果設計為圓點的話,一點它就出來了,

  • 2 #

    全球手機最好的系統是iOS,中國產手機裡最好的系統flyme,錘子系統第二,miui第三,華為、vivo、OPPO就不排名次了,特點不明顯。個人使用後認為。

  • 3 #

    為什麼我沒有下面的聯絡人?

  • 4 #

    放在哪兒都會誤觸

  • 5 #

    現在有五個小窗模式在增加五個手指一劃自動旋轉最完美

  • 6 #

    手機發熱太嚴重了,拿在手裡燙手。

  • 7 #

    關於小圓點。我覺得蘋果那個真的好用,雖然很多人都不會自定義用的是預設的幾個選項。。。

  • 8 #

    不想雙清,等穩定版中,但這個功能對我誘惑太大,怕自己忍不住

  • 9 #

    底層為什麼不更新[what]15plus還是安卓7.0

  • 10 #

    這個功能比較人性化

  • 11 #

    沒有dc 調光,眼睛受不了

  • 12 #

    自己手機上的資訊應用都不能小視窗,,,

  • 13 #

    小米6轉16S ,後天到機,希望能用下去

  • 14 #

    先調好全面屏手勢再說吧,這幾天更新後卡的都想用回三大金剛鍵了

  • 15 #

    能不能把小窗模式加上一個透明度???可以調節透明度的小窗。

  • 16 #

    主動撥出有點抄襲OPPO 了吧

  • 17 #

    獨霸所有手機系統超級實用

  • 整治雙十一購物亂象,國家再次出手!該跟這些套路說再見了
  • 阿里巴巴投資8億在南京建江蘇總部,難道是要轉移戰略重心?