產品交互控件:社交App中的「消息」功能窗口化
每天偷偷看大神秀文采的我終于發了篇字數不多的帖子…
開門見山,相信everyone如今每天必做的一件事就是刷朋友圈了,我也一樣,但在刷刷刷的過程中呢,有時會有新消息進來,或者說和someone聊天時,由于對方回復慢,不自主就進入朋友圈看了起來,好的,無論怎樣,其實就是一個場景:
在瀏覽朋友圈時有新消息!而我們必須返回,點擊第一個Tab『微信』,才能收發消息。
其實這種場景普遍存在于各類App中,被迫終止當前功能使用,去使用另一個功能。以類似上例的社交App為例:
- 微信 -> 發現 -> 朋友圈微信 -> 發現 -> 小程序
- QQ -> 動態 -> 子功能(看點、購物、閱讀、直播)
這些功能用戶在使用時,一旦來了新消息,如想回復消息,都需要被迫中斷瀏覽。
而淘寶,右上角導航的擴展按鈕,基本存在于所有子頁面,內部有消息頁入口,使用相對方便一些。
所以想要實現用戶在看新聞、看直播、逛商品、刷朋友圈的同時,可以輕松查看并回復消息這種能力,
提出了這樣一個解決方案:
如上圖,位于『QQ – 動態 – 看點』功能中,左下角增加懸浮小窗,在任意時刻,可通過點擊收發消息,可以想象成QQ第一個Tab最小化在window最上層了。
在這里,暫將此控件定義為『消息窗』,綁定一些簡單規則:
在App內:
- 只要App脫離主Tab頁面,消息窗立即自動顯示至當前window最上層;
- 消息窗可拖動,類似iPhone的AssistiveTouch;
- 點擊消息窗 – 展開,再次點擊 – 最小化;
- 消息窗內,只能進行簡易的查看、發送消息,無法進入其他子功能頁面;
- 無論用戶處于什么深層功能中,當有新消息是,消息窗跳動提示, 并顯示新消息條數;
寫到這里,其實這個小想法已經表達清楚了
- 在技術實現方面,如果小窗內僅僅是收發消息,相信開發量并不大;
- 考慮到當前環境下的移動設備配置,相信多個窗口,只要管理好內存,性能不會有問題;(當然,可能有很多中老年用戶使用的設備還比較老舊,需要針對設備做版本功能管理,這個肯定已有的)
- 此種窗口設計,對于用戶在使用App時的影響,會許只有真正做出來,上線了,根據用戶行為數據分析,以及用戶的使用反饋,才能有一個定論,到底是否適合移動設備;
- 可能并不是所有App都適合添加這種小窗,還是要根據不同場景下的需求。
想法很簡單
好吧,必須承認,只是想在刷朋友圈看新聞時,不要來回反復的回到首頁查看消息~
寫到這里,萬一有微信或者QQ等App的PM同學看到,如果覺得可行,還是希望可以嘗試一下
這個想法或許做技術的同學更易理解,至于交互細節、能力細節,還是由有興趣并專業的PM同學去細思吧。
本文由 @Tiny 原創發布于人人都是產品經理。未經許可,禁止轉載。
評論
想起了在這里留的貼,功能實現很久了,來還個愿
作者說的這個問題確實存在,就是必要的時候無法快速多任務處理。這是移動小屏幕用層級換尺寸的天然缺陷。
但是作者的解決方法有點粗暴了,相當于每個模塊都與主頁有快速切換按鈕,會不會導致軟件的整體架構變化,產品價值引導變化?
1.是否換一種思路,把沒看完的內容遷移到某個觸手可及的位置?
2.或者再換一種思路,是否每條來的信息我們都需要回復?我不知道大多數人的微信推送是否顯示對話內容,我就沒有開啟,這導致了來信息我知道,但我不知道是否當前急需回復?所以瀏覽朋友圈內容時顯示誰發了什么信息,用戶可以自己判斷是否需要立刻退出回復。
如果是qq微信同時出來信息是不是要好幾個那種消息懸浮按鈕,這種懸浮按鈕還是要看用戶,感覺懸浮的東西太礙視線了,個人理解
不是的哈,是App內的浮窗。
看到了demo,出發點是好的,解決被迫中斷當前操作,提升任務切換路徑。但是有的顧慮:從產品設計層面講,當前頁面增加一個懸浮按鈕,邏輯上即為 彈出頁面時 是懸浮在當前頁面的,懸浮頁面不宜出現兩層,意味著需要在一個懸浮頁面上完成查看信息、回復信息、發送信息。這種是優化了閱讀瀏覽體驗,但是作為社交溝通為核心主題的APP,卻犧牲了信息反饋的溝通體驗,這種是否有點得不償失呢?
感謝透徹的理解和寶貴建議!
我考慮在設計上發發力會不會體驗更佳,
彈出的頁面做的更像一個立體、獨立懸浮于上層的窗口,通過『消息窗』按鈕快捷的 展開 – 收起,,浮層內至多2-3層,不能過于深入
浮層內操作與『消息窗』按鈕工作獨立,前者等同于聊天列表首頁(功能缺?。笳咧回撠熼_合。
感覺不拿給用戶使用,通過用戶的行為數據分析,反饋分析,難以得到可靠的優劣比啊~
https://pan.baidu.com/s/1kUZkyYN,網盤可下載 demo演示視頻,供參考
文章內發了兩次都被刪掉了,大家可以在這里看
提醒一下:
安卓版微信
在任意窗口輸入://multiwebview
你再試試看文章的時候,如果想查看消息,調出多任務,看看會出現什么情況
這點很抱歉,我的確沒用過安卓手機,之后按您說的體驗下,感謝提示
適用場景:
1.顯示級別比較高
2.數量級比較少
3.頻率比較低
4.建議設置成特別關注的人
看來,你可能比較宅。。。數量級你考慮了嗎?2個人,一個人給你發了1條消息,一個人給你發了9條消息,該如何顯示,你回復哪條?群消息,不停的彈呢?
最后想想,你這樣設計,跟原本的設計比起來呢。。PS 三星 S6有這個設計
感謝評論指點,2條我統一回復哈~
適用場景:其實這只是個粗糙的idea,針對不同場景是可以優化設計的;
1、此控件的顯示級別高,這點贊同;也表示此類窗口內的功能即時性較強,最好可以第一時間處理的,所以舉了社交-微信消息為例
4、考慮過,例如QQ收到關注的朋友的消息,聲音是不同的,異曲同工,取決于具體的App場景,獨立設計
2和3以及第二條評論,能感受到您的意思是如果一直來消息怎么辦?垃圾消息?多種類消息?分2點說明:
1、對于提示,動效、靜態紅點、靜態紅點數字都OK的啊,可以區分消息種類,在『小窗』上顯示不同的符號、數字,并沒有定死哈,這個應該是PM+UE+UI針對自己產品場景發揮的點吧
2、關于頻率和量級,無所謂的呀,您可以下視頻看一下,雖然demo做的簡單,但是最后一頁的展開效果應該還是能夠看懂
最后,這只是一個idea哈,我覺得可以是現在微信非首頁的其他應用場景內,類似的設計很多的,如:
騰訊新聞的視頻類新聞最小化窗口效果,斗魚直播 – 直播小窗口,都是此類設計的應用
然而,怎么看出我比較宅的 ?
而且,其實此種窗口也正解決了您說的『一個人給你發了1條消息,一個人給你發了9條消息,該如何顯示,你回復哪條?群消息,不停的彈呢?』這個問題
展開,愛回哪個回哪個,愛看哪個看哪個,看完收起來就好啦,參考視頻模擬的點擊效果哈
不好意思,沒看到視頻、、、、、無奈臉
再次嘗試發布文章后,下載demo視頻的網盤連接還是被B掉了,https://pan.baidu.com/s/1kUZkyYN