視頻交互的設計參考

視頻中的常見交互分析

常見的視頻交互

在瀏覽視頻時，用戶會有四個最基本的手指交互操作：

左右滑動

右半區上下滑動

左半區上下滑動

雙擊暫停播放

在這個三個基本交互操作的前提下，很多產品又為視頻增加了進行操作的功能。

視頻操作的目的

視頻操作是為了滿足用戶更好的觀看體驗，包括調整清晰度，鎖定屏幕，彈幕，分享等功能。

在對視頻進行操作的時候，會有一個界面操作的外框，在界面中，有各種功能可以操作，用戶在觀看視頻時，是不希望看到這個操作界面的，一般會在3秒左右，這個操作界面就會漸漸隱去。當然，如果覺得太慢，可以觸碰一下屏幕，就自動隱去了。

騰訊視頻參考

用戶在對視頻操作的時候，除了一些簡單功能的操作，在更多選項中，可以參考下圖這種彈窗形式，盡量避免全屏，全屏在用戶體驗上全屏會讓用戶感覺進入到另一個界面，有負重感，彈窗只需要觸碰一下左屏的視頻，就可以自動收回了，非常快捷方便。

愛奇藝參考

主流產品的常見交互及功能

gif錄製

嗶哩嗶哩

在屏幕上，有一個gif按鈕，長按按鈕，它就會為你錄下當前的視頻畫面，並且可以預覽，保存和分享。

騰訊視頻

騰訊視頻的交互和嗶哩嗶哩完全不同，同樣是錄製gif，騰訊視頻可以選擇視頻的段落來錄製，並且支持調整錄製時間：最短3s，最長10s，並且支持小視頻和gif，還可以添加音樂，支持分享的平台也比較多。

鎖定屏幕

鎖定屏幕是為了防止用戶在觀看視頻時發生誤觸，用戶只需要點擊鎖定按鈕就可以鎖屏了。（按鈕：鎖定狀態，和開鎖狀態）

值得一提的是嗶哩嗶哩的鎖屏設計是完全相反的，它的鎖屏鍵代表的不是狀態，而是一個動作，容易讓用戶產生體驗誤差。

綜合以上視頻內容分析，做個簡單的交互總結

影視類產品不同於普通視頻軟體，它由於承載大量的內容和用戶，功能的擴展在所難免，而在功能的擴展過程中，千萬不要忽略交互的重要性，無論你的功能多麼豐富，用戶終究是被有好的內容和體驗所吸引。

視頻APP交互參考

在設計的時候一定要按照這個交互做嗎？

看產品，不同的產品有不同功能需求，也可以根據你的產品交互來做一些情感化的小設計或者創新，不過這個模式是很多視頻產品都在使用的交互參考。

關於情感化設計及創新設計，可以參考Youtube的視頻交互設計。

Youtube在視頻界面做了很多手指交互，在視頻預覽的過程中，可以用手指下拉視頻，就可以將其縮放至首頁。

GIF

觀看視頻的過程中，手指上滑可以查看視頻選集，下滑將其隱藏。

GIF

總結

通過找尋產品交互的共通性，來做一些情感化的交互和設計，當然，產品不同類型，其功能方向也不同，如果遇到類似影音類產品的交互設計，可以參考以上的分享內容。

老冰

- END -

獲取素材請回復：筆刷/模板/設計手冊/賜我英文字體/賜我好圖/RM筆刷/中文字體

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！