隨著觸屏時代的普及,借助手勢交互可以提高用戶的操作便捷度和效率。那么我們都會經常使用哪些手勢交互呢?這些手勢交互在產品中的應用是否被你所忽略,下面黑馬哥就帶大家一起探索一下吧!
在聽一首喜歡的音樂時,參與評論可以表達自己對音樂帶來的共鳴感,也可以看其它聽友的評論尋找知音。在網易云音樂的評論區隱藏著一個手勢交互,對某一條評論雙指上滑就會針對其給出擁抱,兩個小人微笑擁抱的動畫顯示在該條評論右下角,進而用戶頭像下方會顯示“收到了抱抱”的標簽提示。
在不新增功能入口的同時,借助雙指手勢交互來滿足需求,既能不破壞原生的結構,又能帶給用戶不一樣的操作體驗。這個隱藏的彩蛋你是否注意到?以后在體驗產品的時候除了發現視覺表層的可見內容以外,也要加強手勢交互的操作來發現更多隱藏的功能。
我們在觀看視頻的時候,短視頻是單擊控制播放/暫停,而視頻播放軟件則是通過雙擊控制。由于長視頻用戶需要觀看很久,容易觸屏造成誤操作,雙擊是為了形成二次確認,降低誤操作的概率。
短視頻播放由于內容比較簡短,可以通過單擊控制播放/暫停,雙擊則是更多功能的輔助,同一個功能在不同的場景需要配合不同的手勢。我們在進行產品設計的時候,可以根據業務類型和用戶場景的差異借助手勢來滿足更多功能的操作,用戶習慣培養之后將會提高其操作體驗度。
左滑動是產品設計中非常普遍的手勢交互,通過左滑展開列表隱藏功能,比如編輯、置頂、刪除等。
在脈脈 APP 的消息模塊,消息列表左滑可以進行置頂和刪除,如果繼續往左側滑動則會實現自動刪除,以此來替代點擊刪除圖標完成刪除操作的步驟。通過左滑配合點擊刪除操作路徑多一步,而左滑程度控制刪除效率更高,針對一些消息較多的產品,可以方便用戶快速清理未讀消息。
在微信群聊或者與好友聊天的時候,為了重點提示好友,可以通過雙擊好友頭像進行“拍一拍”,晃動的頭像和震動的提示加強好友對信息的關注度。
結合雙擊的手勢交互,在不改變當前布局的情況下加強社交屬性,增強好友間的互動提示,通過手勢豐富了社交體驗。
雖然手機逐步進入大屏時代,但是用戶還是希望獲得更少的干擾,全屏模式的操作可以讓干擾降到最低。
百度地圖在操作后會有彈窗式的內容呈現,用戶可以通過單擊屏幕退出彈窗,再次單擊則會進一步隱藏基礎控件,進入全屏模式。通過單擊的手勢交互來簡化內容結構,降低干擾帶給用戶更集中的操作體驗。
通過愛奇藝 APP 刷劇的時候,在搜尋影視作品的過程中,可以通過長按作品封面進行快速預覽,播放精彩片段來判斷是否值得追劇。
通過長按激活彈窗,可以在不改變當前布局結構的前提下,進行更多功能操作。適合針對隱藏式功能,也能避免誤操作。
很多影視類產品在全屏播放視頻時,除了通過拖動進度條進行快進/倒退之外,也能通過長按屏幕進行快進。
而騰訊視頻與之不同的是結合了屏幕區域,在全屏狀態下,左側區域長按快退,右側區域長按快進。長按結合位置區域變化功能狀態,深入了手勢交互的操作,也能帶來不一樣的操作體驗。
單擊和雙擊的手勢交互較為常見,而三擊手勢應用較少,有待深入探索。目前來說,帶有 Home 鍵的蘋果系列手機,可以通過三擊 Home 鍵激活“輔助觸控”快捷鍵,再次三擊隱藏快捷鍵。
通過三擊可以快速激活功能快捷鍵,減少了多個步驟路徑,也不會導致用戶誤操作。
手勢下滑形成下拉刷新已經成為產品設計中的基礎操作,為了進一步延展功能,很多產品在下拉過程中根據下拉的程度判斷是刷新還是進入二層樓(活動或者功能模塊)。
通常是通過控制下拉的距離來做判斷,會提示“松開刷新”的字樣,如果繼續下拉則會激活功能變化。進入二級功能界面或者二層樓活動界面,深度的功能開發帶給用戶更多的選擇性。
蘋果手機自帶的相冊(照片)APP,可以通過雙指縮放來改變照片預覽的大小,方便用戶在眾多照片中通過縮小快速查看,再通過放大做進一步的選擇。借助縮放的手勢交互,方便用戶自由縮放預覽并作出快捷的操作,提高了用戶的操作體驗感。
雙指縮放對于屏幕的縮放預覽十分便利,在很多應用場景都有涉足,比如相冊、地圖、繪圖工具等。
在圖片預覽的時候,可以通過雙擊最大化圖片,方便對細節的觀察。通過雙擊的手勢交互來快速放大圖片,在很多相冊應用、電商產品、微信等社交產品中都有涉足,只要是全屏模式下預覽圖片,都可以通過該手勢交互完成縮放。
雙指縮放屬于慢動作,而雙擊最大化屬于快速一步到位,適合查看圖片細節等操作。通常是雙擊最大化,再次雙擊恢復正常。
手勢交互在地圖軟件中的運用表現得淋漓盡致,對于用戶來說操作變得更加便利和快捷。
以高德地圖舉例:單擊手勢可以隱藏操作欄進入全屏模式;長按固定區域會激活當前位置定位,方便隨時查看和開始導航;雙擊手勢可以對地圖進行固定倍數放大;雙指縮放可以對地圖進行任意縮放,便于精準查看位置區域等。手勢交互控制地圖預覽提升了操作便捷度,借助手勢提升了地圖類產品的體驗感。
當用戶下載的應用很多的時候,通常都會通過建組管理手機桌面上的各類應用軟件??梢酝ㄟ^拖動應用疊加到其他應用軟件上實現自動建組,建組、進組、移出等操作均可通過拖動手勢完成,操作非常便利。
拖動手勢交互針對一些防止誤操作的功能比較適合,相當于二次確認的過程。
在百度網盤中可以通過單擊選擇控件對文件進行選擇操作,也可以通過長按整個區域實現選中,長按過程中可以結合滑動實現多選。
長按滑動進行多選針對文件較多的場景非常便利,也不用擔心誤操作。在一些相冊應用中點擊選擇按鈕之后也可以通過滑動實現多選,操作路徑多一步。無論是通過激活選擇按鈕,還是長按都是起到二次確認的作用,長按滑動操作相對更簡單。
隨著手機觸屏靈敏度的提升,手勢交互在產品設計中的應用會越來越普及,特別是針對大屏手機。本期整理的關于手勢交互操作的案例僅作為拋磚引玉,還有很多的優秀案例有待大家去發現和總結,不足之處留言補全。
歡迎關注作者的微信公眾號:「黑馬家族」
復制本文鏈接 文章為作者獨立觀點不代表優設網立場,未經允許不得轉載。
發評論!每天贏獎品
點擊 登錄 后,在評論區留言,系統會隨機派送獎品
2012年成立至今,是國內備受歡迎的設計師平臺,提供獎品贊助 聯系我們
標志設計標準教程
已累計誕生 729 位幸運星
發表評論 為下方 2 條評論點贊,解鎖好運彩蛋
↓ 下方為您推薦了一些精彩有趣的文章熱評 ↓