中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

導讀：前三篇文章講解了單指點擊類手勢、單指位移類手勢、描述維度。本文討論多指和組合類手勢，它們的使用遠遠少于單指類的手勢。由于本文與前兩篇文章的相關性較強，為了加深理解建議配合下面兩篇文章閱讀本文。

一、多指類手勢

之前的文章講解位移類手勢和點擊類手勢的時候，提到過不同的描述維度會讓手勢產生不同的變種，比如觸發時機、 按下次數、 閾值類型等。我們同樣也可以把使用手指的數目看做是一個描述維度，使用的手指數目不同也會產生不同的手勢變種，有著不同的應用方式。

使用多指類手勢的原因主要有兩個：

• 單個界面對于手勢的需求量比較大。當可用的單指類手勢都已經被占用后，通過引入多指的維度來擴充手勢，從而滿足設計需要，避免產生手勢沖突；
• 系統級的全局手勢通常使用多指類手勢來盡量避免與第三方App的手勢沖突。

全局手勢如果設計得過于簡單很容易引發手勢沖突。

例如一加手機的某個系統版本中，有一個全局手勢是單指連續點擊三次觸發頁面縮放，對于非游戲類的App來說基本沒有這個手勢，不必擔心誤操作，但是對于游戲類App而言，連續點擊屏幕上的攻擊鍵是一個很常用的操作，連續點擊三次觸發頁面縮放的設計導致用戶游戲過程中極易不小心觸發了頁面縮放。

iOS系統的做法很巧妙，在點擊次數外增加了手指個數的維度，通過三指雙擊才能夠觸發頁面縮放，從而基本解決了手勢沖突問題。

1.1 多指點擊

1）特點

多指點擊同樣有點擊次數、觸發時機和時間限制這些描述維度，它們的變化會給多指點擊帶來不同變種。在App中多指點擊常見的變種一般有多指單擊、多指按下，而像多指雙擊、多指長按這一類更復雜的變種較為少見，一般僅用于系統級的全局手勢。

2）案例

在iOS的短信App中，可以通過「雙指按下」快速選中一個短信。

在iOS的設置中開啟縮放功能后，任何頁面都可以通過「三指雙擊」觸發頁面縮放。

1.2 多指位移

1）特點

多指位移同樣有控制方式、穩定化效果、以及閾值類型這些描述維度，它們的變化可以實現多指輕掃、多指拖拽、多指甩動這些效果。多指位移通常用來移動受控物或觸發某個功能。

2）案例

在iOS的短信App中，可以通過「雙指拖拽」快速多選短信。

在網易云音樂的播放頁，向下「雙指輕掃」可以觸發黑膠背后的故事。

在筆記應用GoodNotes中，瀏覽模式下可以通過「單指甩動」瀏覽頁面，但是當進入編輯模式時，為避免手勢沖突，單指甩動會變為「雙指甩動」。

1.3 多指縮放

1）特點

多指縮放與多指位移比較相近，不同之處在于多指縮放的手指移動方向是以某一個點為中心進行匯聚或分散?？刂品绞?、穩定化效果、以及閾值類型這些描述維度同樣適用于多指縮放。

2）案例

iPad可以通過「四指縮小」快速退出應用。

iOS的照片App中，可以通過「雙指縮放」縮小或放大照片。

網易云音樂可以通過「雙指縮小」觸發抱一抱彩蛋。

1.4 多指旋轉

1）特點

多指旋轉可以看做是以多指的中心為圓心，通過多指的移動來模擬出圍繞這個圓心做旋轉的手勢。它是對物理世界幾乎100%的映射，因此一般用于旋轉某個物體，調節旋鈕等操作。

2）案例

iOS的照片App中，可以通過「雙指旋轉」轉動照片。

1.5 多指特殊手勢

有一類特殊的多指手勢可以支持更復雜的交互，一般為系統級手勢。例如iOS中長按桌面的App后進行拖拽時，可以同時點擊其他App一起進行拖拽。

二、組合類手勢

組合類手勢由兩個或兩個以上的手勢組成，因此隱蔽性較強，如果不進行引導很難被用戶發現，也是由于這種特性，它所觸發的功能一般有其他更明顯的入口或操作方式，使用它通常是為了增加高頻功能的操作效率，服務于專家型用戶。

組合類手勢之所以能夠提高效率，是因為它把用戶平時需要通過多個步驟才能完成的操作簡化為了短時間即可完成的手勢組合。雖然初次使用有一定學習成本，但是一旦用戶形成肌肉記憶，操作過程會非?？焖?。

因為組合類手勢更加多變，且系統并未直接提供這類手勢給設計師調用，需要設計師自己根據需求來組合搭配，因此很考驗設計師的創新能力。之后的案例展示僅為常見的用法，并不是全部。通過舉一反三，我們也可以設計出不同與本文中的案例但更滿足需求的組合類手勢。

2.1 設計模型

下面這個表格里的模型是總結常見的組合類手勢而設計的，能夠涵蓋絕大部分的設計需求，但僅適用于單指的組合類手勢設計。

模型將組合類手勢的操作過程分為啟動、調整和觸發三個階段。每一階段由一個分支手勢構成。比如在第一階段中，可以選用的手勢有長按、雙按、輕掃B。并不是只能選用這三個，而是它們三個作為第一階段的分支手勢體驗良好且最常用。

①啟動階段的目的是創建一個新模式，在新模式下，界面原有的手勢會失效，系統只能響應②調整階段的手勢，可以選用拖拽和輕掃E。在③觸發階段可以進行抬起、停留來觸發最后的功能，如果選擇「無操作」，則說明手勢在②調整階段已經達到目的，不需要③觸發階段的手勢。

僅解釋這個模型可能比較難理解，下面會用一些案例進行演示。

2.2 常見案例

長按+輕掃E+抬起

特點：

通過長按激活一個控件，在手指不離開屏幕的情況下將手指移動到某個功能選項的位置上，然后通過抬起觸發該功能。功能選項一般出現在手指的附近，從而方便下一步操作。

案例：

花瓣App中長按某個圖片后可以快速進行收藏等操作。

長按+拖拽+停留

特點：

通過長按激活一個控件，在不松手的情況下將手指拖動到控件的某個功能選項的位置上，然后停留特定時間觸發該功能。

案例：

在京東讀書App中，需要跨頁選擇文本時，需要長按后拖動手指至頁面左下角后，停留一段時間進行翻頁。

在iOS桌面長按圖標將其拖動到邊界，停留一段時間后可以將圖標移動到下一頁。

為什么上面兩個案例在觸發階段使用停留而不是抬起？

因為完成了觸發階段的操作后手指仍然需要對受控物保持控制狀態，此時不能松開手指，因此這種情況下操作的觸發手勢使用停留更合適。

輕掃B+輕掃E+抬起

特點：

通過輕掃B激活一個控件，在不松手的情況下將手指往某個方向移動來選中某個功能選項，然后通過抬起觸發該功能。

案例：

Chrome瀏覽器中，下拉頁面后將手指左右移動并抬起可以觸發其他功能。

雙按+拖拽

定義：

當一個界面中，上下左右四個方向都已經存在位移類手勢了，但是仍然有功能需要新增額外的位移類手勢。此時可以將雙按看做是一個模式啟動，雙按后可以立即使用拖拽來觸發相應功能。

案例：

地圖類App中，可以通過雙按后手指不離開屏幕往上拖拽來放大地圖，往下拖拽來縮小地圖，從而解決了單手操作時難以放大縮小地圖的問題。不足之處在于，這個手勢的教育成本較高，只有少部分用戶能夠發現并持續使用。

2.3 根據使用場景進行分類

上文依據操作方式將案例進行了分類。實際上在設計過程中，使用場景分類更能便于我們去選擇適合的手勢。我將組合類手勢通過使用場景的區別分為了四類，它們分別是 ①單個屬性的調整、②多個功能選其一、③默認選擇主要功能、④同時進行兩項操作。由于下面案例的手勢在上文已經進行了介紹，所以不做贅述僅羅列更多案例幫助理解。

2.3.1 單個屬性的調整

單個屬性可以是亮度、大小、位置等，通過雙按或長按啟動模式后，再使用拖拽來進行調整。

雙按+拖拽

每個地圖App基本都支持這個手勢，雙按后通過拖拽來對地圖大小進行調整。

（上文有動圖示例，這里不再重復展示）

長按+拖拽

在快手App的拍攝界面中，長按拍攝鍵后上下拖拽可以調整取景框的大小。

2.3.2 多個功能選其一

通過長按喚起功能菜單，在手指不離開屏幕的情況下移動到某個功能后抬起觸發該功能。

長按+輕掃E+抬起

在iOS的桌面長按App的圖標可以喚起更多功能菜單，移動手指到某個功能后抬起可觸發該功能。

2.3.3 默認選擇主要功能

使用長按或輕掃B后可以直接松手默認觸發主要功能，但如果保持手指不離開屏幕使用輕掃E，則可以選擇其他次要的功能，然后抬起觸發。

長按+輕掃E+抬起

微信錄制完語音后，抬起默認會觸發發送語音，也可以通過移動手指到「取消」或「轉文字」上來觸發另外兩個較為低頻的功能。

輕掃B+輕掃E+抬起

下面是一個概念案例，來自于一本交互設計相關圖書《交互設計語言》，非常推薦閱讀。在下圖案例中，手勢的目的是解決微信的多層級導致的返回步驟過多問題。右滑頁面后如果直接松手會返回上一頁，但是如果上下移動則可選擇其他層級的頁面，抬起后進行跳轉。

2.3.4 同時進行兩項操作

部分場景中，長按后手指需要保持接觸屏幕的情況下同時操作兩個功能，由拖拽和停留分別操作。

長按+拖拽+停留

暫無更多案例展示，可以看上文的京東讀書App選中更多文字的同時進行翻頁、在iOS桌面拖動圖標的同時進行翻頁的案例，在這里就不重復展示了。

以上就是關于多指類和組合類手勢的思考總結，后續暫定的更新計劃如下。有興趣的朋友可以持續關注哦~

相關閱讀：

交互手勢全解析之點擊類手勢

交互手勢全解析之位移類手勢

本文由 @Ballen成明 原創發布于人人都是產品經理，未經作者許可，禁止轉載。

題圖來自Unsplash，基于CC0協議。