介面設計奧革士access_timeJANUARY 11TH, 2015

良好的手勢互動設計要素

手勢是一種更貼近自然的操作方式,本文提供幾則要點 來檢驗應用程式的手勢體驗是不是合適且容易使用

雙手是人類最靈敏的部位之一

手勢的種類

 
各種手勢操作方式, via GestureWorks's 20 something gesture icons
  1. 單點觸碰(Tap)
    點擊用來選擇一個物件,類似滑鼠的左鍵,是最常用的手勢。
  2. 拖曳(Drag)
    點擊物件並進行移動,類似現實生活中推動或移動物體的體驗。
  3. 快速拖曳(Flick)
    速度很快的拖曳操作,類似滑鼠滾輪的體驗。
  4. 滑動(Swipe)
    水平或垂直方向的滑動,類似翻閱書籍的體驗。
  5. 雙擊(Double-Click)
    快速點擊一個物體,通常會在放大、縮小操作中使用。
  6. 捏(Pinch)
    兩跟手指頭向內捏,現實中捏會使物體變得更小,通常會使用在縮小操作中使用。
  7. 伸展(Stretch)
    兩根手指向外推,現實中這種操作會使物體向外拉伸,物體可能會變得更大,通常會在放大操作中使用。
  8. 長按(Touch and hold)
    點壓一個物體一陣時間,通常會在觸發編輯狀態或者提高效率的操作功能中使用。

手指的大小

手指的大小也是手勢操作要考量的要素之一,不同年紀、性別、人種的手指大小皆不相同,因此在進行手勢設計之前,分析目標使用者的特徵是非常必要的,例如你正在開發一款給學前兒童使用的繪圖工具。

各大平台都針對手指大小進行設計上的標準建議,綜合來說,點觸區域食指最小尺寸為 7 × 7 mm,拇指最小尺寸為 9 × 9 mm。

手持的方式

不同手持的方式決定不同的手勢操作方式,例如單手、雙手、直向、橫向,考慮這些可能發生的特徵進行手勢互動的規劃與設計。

手勢操作的範圍

進行手勢互動設計時,「裝置螢幕的大小」、「手勢操作範圍」都應該被考慮進來,以下分別說明

  1. 裝置螢幕大小
    隨著科技的發展,適應各種不同情境的裝置分別被設計製造出來,從過去3.5吋的 iPhone 一直到現在 5.5 寸的 iPhone 6 plus 甚至是不久即將上市的 Apple Watch,不同的螢幕大小影響手勢操作的可能性,例如大螢幕允許使用者進行多指手勢的行為,然而這種操作在較小螢幕的手機、手錶是不容易的。
  2. 手勢操作範圍
    除了螢幕的大小,還要考慮實際應用程式介面中,允許進行手勢的區域大小,一般來說,手勢操作應盡讓整個畫面都允許,如果應用程式只有某些位置能夠進行手勢互動,請務必確保操作區域的大小足以符合使用者能夠輕鬆的進行操作。

不同大小裝置操作區域易用性分析

 
iPhone 操作區域分析
 
iPhone 5 操作區域分析
 
iPhone 6 操作區域分析

從圖中我們可以看到以下的結果:

  1. 所有螢幕區域擁有不一樣的程度的操作易用程度
  2. 手指是以弧線的方式進行操作的
  3. 更大尺寸表示有更多的不易觸控位置
  4. 左上角不容易進行操作

良好的手勢互動設計

手勢互動需要考量非常多要素,一個良好的手勢互動通常會是:

  1. 自然的
    手勢是從人的基本行為延伸出來的互動技術,如果手勢符合人類自然的操作方式,那麼使用者就可以非常容易的學會、操作應用程式。
  2. 容易可發現的
    手勢本身是隱藏的,使用者不容易發現手勢功能的存在,因此在設計時,我們應透過「動畫」、「指意」隱喻提示使用者手勢的存在,必要的時候,甚至可以透過引導教學的過程告知使用者手勢的存在。
  3. 有回饋的
    現實生活中,我們的操作都會得到一個即時的回饋,我們透過回饋知道一個動作的結果,人們會依據回饋的型態來判斷操作行為的成功與否,因此在設計手勢互動時,提供使用者的手勢操作回饋,是非常必要的,除此之外,回饋的對應性與邏輯正確性也是非常重要的。
  4. 有趣的
    現在有許多的應用程式、遊戲都採用手勢作為操作的方式,例如Clear、憤怒鳥、水果忍者等。透過有趣生動的操作方式,讓應用程式更自然更好玩。
  5. 合適的
    在不同的國家、文化中,每一種手勢都有不一樣的意義,設計時也務必考慮到使用者的不同文化背景。

參考書目

  1. 行動設計之鑰
  2. 那些 App 好用的秘密
  3. 行動設計模式
  4. 設計的心理學

分享這篇文章

奧革士
奧革設計創辦人,也是一位產品設計顧問 ,平常熱愛研究各種產品的使用者經驗與介面設計,喜歡把將平常所見以及所得加上一些自己的經驗與想法與大家分享。

你可能還會喜歡這些文章

需要 UI / UX 設計上的協助嗎?
我們期待與您聊聊彼此的想法!

聯絡我們

您有專案時程或預算上的問題嗎?查看常見問題問與答

常見問題