備註
此設計指南已針對 Windows 7 建立,但尚未更新較新版本的 Windows。 大部分指引仍適用原則,但簡報和範例不會反映我們 目前的設計指導方針。
所有Microsoft Windows 應用程式都應該啟用畫筆。 這樣做比你想像的要容易。
畫筆輸入是指 Windows 可讓您使用手寫筆直接與電腦互動的方式。 畫筆可用於指點,也可用於手勢、簡單的文字輸入,以及在數位筆跡中擷取自由格式的想法。
用於輸入的畫筆有一個精細、平滑的筆尖,可支援筆跡中的精確指向、寫入或繪圖。 筆也可能有選擇性的畫筆按鈕(用來執行滑鼠右鍵)和橡皮擦(用來擦墨)。 大部分的畫筆都支援暫留。
一般手寫筆。
當手寫筆用於手寫時,使用者的筆劃可以使用手寫辨識轉換成文字。 筆劃可以維持在撰寫時一樣,並在背景中執行辨識,以支援搜尋和複製為文字。 這種未轉換的筆劃稱為數位筆跡。
筆跡輸入的範例。
大部分的 Windows 程式都已經適合手寫筆,因為可以使用手寫筆,而不是滑鼠,畫筆可順暢地處理最重要的工作和互動,而程式會回應手勢。 當程式協助手寫文字輸入時,程式會變得易寫。 當程式可以直接處理筆跡時,程式就會變成筆跡啟用,而不需要將畫筆筆劃轉譯為文字或對等的滑鼠移動。 這可讓使用者在自由流動、高品質的數位筆跡中撰寫、繪製和新增批注。 收集筆跡與收集滑鼠事件不同,因為筆跡需要更高的解析度和更高的取樣率,而且也可以增加壓力和傾斜的細微差別。 如需建立手寫易記和啟用筆跡程式的詳細資訊,請參閱使用手寫筆整合筆跡和文字輸入。
放置手寫筆時,游標的需求較少,因為小費代表本身。 不過,針對目標協助,Windows 會提供指出目前手寫筆位置的小型畫筆游標。 與其取代的滑鼠指標不同,除非畫筆靠近顯示器,否則不需要畫筆游標,因此會在幾秒鐘後消失,以允許資訊不受干擾的檢視。
大部分的手寫筆程式都支援手勢。 筆勢是電腦解譯為命令在螢幕上的手寫筆快速移動,而不是滑鼠移動、寫入或繪圖。 最快速且最容易執行的手勢之一是輕彈。 輕擊是一個簡單的手勢,會導致瀏覽或編輯命令。 流覽輕彈包括向上拖曳、向下拖曳、往後移動,以及向前移動,而編輯筆選包括複製、貼上、復原和刪除。
忙碌指標以外的所有指標都有單一圖元作用點,可定義指標的確切螢幕位置。 作用點會決定哪些物件受到互動的影響。 物件會定義經常性區域,也就是將作用點視為位於 物件上的區域。 通常,經常性區域會與物件的框線相吻合,但讓互動更容易變大。
因為畫筆可以比手指更精確地指向,如果您的使用者介面很適合觸控,它也適用於畫筆。 因此,本文主要著重於將手寫筆支援新增至已針對觸控而設計的程式。
注意: 與 滑鼠、 輔助功能及 觸控 相關的指導方針會顯示在個別文章中。
設計概念
使用手寫筆進行輸入具有下列特性:
- 自然和直覺。 每個人都知道如何用手寫筆點選。 對象互動的設計是為了對應使用者如何以一致的方式與真實世界中的物件互動。
- 表達。 手寫筆的筆劃很容易控制、製作書寫、繪圖、素描、繪製和標註比使用滑鼠更容易。
- 更個人化。 就像手寫筆記或簽章比具類型的筆記更個人化一樣,使用數位手寫筆記或簽章也比較個人化。
- 較不侵入性。 使用手寫筆是無訊息的,因此比鍵入或點擊要少得多的分心,特別是在會議之類的社交情況下。
- 便攜式。 具有畫筆功能的計算機可以更精簡,因為大部分的工作都可以在沒有鍵盤、滑鼠或觸控板的情況下完成。 它可能會更有彈性,因為它不需要工作介面。 它可啟用使用電腦的新地點和案例。
- 直接和引人入勝。 使用手寫筆可讓您覺得您直接與螢幕上的對象互動,而使用滑鼠或觸控板一律需要您協調手部動作與個別螢幕指標移動的相對比較。
所有 Windows 程式都應該有良好的手寫筆體驗。 用戶應該能夠有效率地使用手寫筆執行程式最重要的工作。 某些工作,例如輸入或詳細的圖元作,不適合畫筆,但至少應該可行。
幸運的是,如果您的程式已經設計得很好,而且易於觸控,提供良好的手寫筆支援很容易做到。 基於此目的,設計良好的程式:
- 有良好的滑鼠支援。 互動式控制件具有清楚、可見的能供性,以及指標回饋的暫留狀態。 物件具有標準滑鼠互動的標準行為(單鍵和按兩下、按鼠右鍵、拖曳和暫留)。 指標圖形會視需要變更,以指出直接作的類型。
- 具有良好的鍵盤支援。 此程式透過提供標準快捷鍵指派來讓使用者更有效率,特別是針對也可以透過手勢產生的瀏覽和編輯命令。
- 具有足以觸控的控制件。 控件的大小下限為 23x23 像素(13x13 對話框單位 [DLL]),且最常使用的控件至少為 40x40 像素(23x22 DLL)。 為了避免沒有響應的行為,應該在目標之間沒有很小的間距,UI 元素之間應該有間距,讓相鄰的目標可以觸碰或至少有 5 像素(3 個 DLL) 的空間。
- 可存取。 使用 Microsoft Active Accessibility (MSAA) 為輔助技術提供 UI 的程式設計存取。 程式會適當地回應主題和系統計量變更。
- 在 120 dpi(每英吋點數)中運作良好, 這是啟用手寫筆的計算機建議的預設顯示解析度。
- 使用一般控制件。 最常見的控件是設計來支援良好的手寫筆體驗。 如有必要,程式會使用妥善實作的自定義控件,其設計目的是為了支援簡單的目標和互動式作。
- 使用限制控制件。 針對簡單的目標設計時,清單和滑桿等限制控件比文本框等不受限制的控件更好,因為它們可減少文字輸入的需求。
- 提供適當的預設值。 程式預設會選取最安全的選項(以避免遺失數據或系統存取),以及最安全的選項。 如果安全性和安全性不是因素,則程式會選取最有可能或方便的選項,藉此消除不必要的互動。
- 提供文字自動完成。 提供最有可能或最近輸入值的清單,讓文字輸入更容易。
不幸的是,如果您的程序設計不完善,其缺點對於使用手寫筆的用戶來說尤其明顯。
手寫筆互動的模型
如果您不熟悉使用手寫筆,最好的簡介是透過做來學習。 取得已啟用手寫筆的計算機、將滑鼠和鍵盤放在一邊,並執行您通常只使用手寫筆執行的工作。 請務必嘗試啟用筆跡的程式,例如 Windows 日誌,以及未啟用筆跡的程式。 如果您有平板計算機,請嘗試將它放在不同的位置,例如在腿上,躺在桌子上,或放在手臂上,而你站著。 請嘗試在直向和橫向使用,並按住手寫筆進行書寫,並只用於指向左手和右手。
當您嘗試使用畫筆時,您會發現:
- 小型控件難以使用。 控件的大小會大幅影響您有效互動的能力。 10x10 像素的控件在畫筆上可合理運作,但較大的控件更適合使用。 例如, 微調控件 (15x11 像素)太小,無法輕易地搭配手寫筆使用。
- 手部是一個因素。 您的手有時會涵蓋您可能想要查看或與其互動的專案。 例如,如果右手使用者作功能表出現在按兩下點的右邊,則很難使用,因此,如果它們出現在左側,則比較好。 Windows 可讓使用者在 [平板電腦設定] 控制面板專案中指出其手部。
- 工作位置有助於。 雖然您可以使用 3 英吋的滑鼠移動,在 14 英吋的螢幕上移動指標,但使用手寫筆需要移動全 14 英吋的手。 在相距甚遠的目標之間重複移動可能會很乏味,因此最好盡可能讓工作互動保持在休息手的範圍內。 作功能表很方便,因為它們不需要手部移動。
- 文字輸入和選取很困難。 冗長的文字輸入特別難以使用手寫筆,因此自動完成和可接受的預設文字值可以真正簡化工作。 文字選取也可能相當困難,因此工作在不需要精確的游標放置時會比較容易。
- 顯示器邊緣附近的小型目標可能很難點選。 有些顯示器邊框突出,有些觸摸屏技術在邊緣較不敏感,使得靠近邊緣的控件更難使用。 例如,當視窗最大化時,標題欄上的 [最小化]、[最大化/還原] 和 [關閉] 按鈕可能會比較困難。
控制位置
工作位置可減少繁瑣的跨螢幕移動。 若要將手部移動降到最低,請找出最接近使用位置的控件。
不正確:
在此範例中,Windows XP 的調色盤離可能使用的位置太遠。
請考慮使用者目前的位置是最接近的目標,使得取得變得微不足道。 因此,作功能表充分利用 了 Fitts'Law,就像Microsoft Office 所使用的迷你工具列一樣。
目前指標位置一律是最容易取得的位置。
顯示邊緣附近的小型目標可能難以設定目標,因此請避免將小型控件放在窗口邊緣附近。 為了確保控件在視窗最大化時很容易設為目標,請將它們設為至少 23x23 像素(13x13 DLL),或將它們放在視窗邊緣之外。
手寫筆互動
系統手勢
系統手勢是由 Windows 所定義及處理。 因此,所有 Windows 程式都可以存取它們。 這些手勢具有對等的滑鼠、鍵盤和應用程式命令訊息:
| 系統手勢 | 合成的對等訊息 |
|---|---|
| 暫留 (支援時) |
滑鼠暫留 |
| 點選 (向下和向上) |
滑鼠左鍵 |
| 雙擊 (向下和向上兩次) |
滑鼠按兩下滑鼠左鍵 |
| 按住(按住、暫停、向上) |
滑鼠右鍵 |
| 拖曳(向下、移動、上移) |
滑鼠左拖曳 |
| 按、按住和拖曳(向下、暫停、移動、向上) |
滑鼠右拖曳 |
| 選取 (向下,移動選擇的物件,向上移動) |
滑鼠選取 |
開發 人員: 如需詳細資訊,請參閱 SystemGesture 列舉。
筆觸
輕彈是簡單手勢,大致相當於鍵盤快捷方式。 流覽輕彈包括向上拖曳、向下拖曳、往後移動,以及向前移動。 編輯輕拍包括複製、貼上、復原和刪除。 若要使用輕觸,您的程式只需要響應相關的擊鍵命令。
Windows 7 中的八個輕掃手勢及其預設指派。 流覽輕觸已變更為對應到移動流覽(物件移動手勢的位置),而不是捲動(物件在手勢的相反方向移動)。
Windows Vista 中的八個輕擊手勢及其預設指派。
流覽輕彈具有自然的對應,因此很容易學習和記住。 編輯筆觸是需要更精確的對角線,而且其對應不如自然(針對回收站輕觸以刪除,在 [上一步] 箭頭方向上輕觸以復原),因此預設不會啟用這些動作。 您可以使用手寫筆和輸入裝置控制面板項目來自定義所有輕拍動作。
| 電影 | 合成的對等訊息 |
|---|---|
| 向左輕彈 |
轉寄命令 (Windows Vista 的上一個命令) |
| 向右輕彈 |
上一步命令 (適用於 Windows Vista 的轉寄命令) |
| 向上閃爍 |
鍵盤向下捲動 |
| 向下輕擊 |
鍵盤向上捲動 |
| 閃爍左對角線 |
鍵盤上的 Delete 鍵 |
| 輕掃左對角線 |
鍵盤復原 |
| 輕掃右對角線 |
鍵盤複製 |
| 向下斜線輕掃 |
鍵盤貼上 |
應用程式手勢
應用程式也可以定義及處理其他手勢。 Microsoft手勢辨識器可以辨識 超過 40 個手勢。 若要使用應用程式手勢,您的程式必須定義可辨識的手勢,然後處理產生的事件。
回應性和一致性
回應性對於建立直接且吸引人的手寫筆體驗至關重要。 為了感覺直接,手勢必須立即生效,而且對象的接觸點必須在整個手勢中順暢地留在筆底下。 任何延隔、不穩定的反應、接觸損失或不準確的結果都破壞了直接作和品質的感知。
一致性對於建立感覺自然和直覺的手寫筆體驗至關重要。 一旦使用者瞭解標準手勢,他們預期該手勢在所有適用的程式中都有相同的效果。 為了避免混淆和挫折,請勿將非標準意義指派給標準手勢。 相反地,使用自定義手勢進行程式專屬的互動。
編輯筆跡和文字
使用手寫筆時,編輯筆跡和文字是最具挑戰性的互動之一。 使用限制控件、適當的預設值和自動完成可消除或減少輸入文字的需求。 但是,如果您的程式涉及編輯文字或筆跡, 您可以在使用手寫筆時,自動縮放輸入UI高達150%的生產力。
例如,電子郵件程式可以正常顯示UI,但將輸入UI縮放為150%,以撰寫郵件。
在此範例中,輸入UI會縮放為150%。
如果您只做四件事...
-
- 讓您的 Windows 程式有良好的手寫筆體驗! 用戶應該能夠有效地使用畫筆執行程式最重要的工作(至少那些不涉及大量輸入或詳細圖元作的工作)。
-
- 請考慮在最相關的案例中使用筆跡直接新增撰寫、繪製和新增批注的支援。
-
- 若要建立直接且吸引人的體驗,讓手勢立即生效,讓聯繫人點在使用者筆下順暢地在整個手勢中保持順暢,並直接對使用者的動作進行手勢對應的效果。
-
- 若要建立自然且直覺的體驗,請支援適當的標準手勢,並指派其標準意義。 使用自定義手勢進行程序專屬的互動。
指導方針
控制使用方式
- 偏好使用一般控件。 最常見的控件是設計來支援良好的手寫筆體驗。
- 偏好限制控件。 盡可能使用清單和滑桿之類的限制控件,而不是文本框等不受限制的控件,以減少文字輸入的需求。
- 提供適當的預設值。 選取最安全的選項(以防止數據或系統存取遺失),且預設最安全的選項。 如果安全性和安全性不是因素,請選取最有可能或方便的選項,藉此消除不必要的互動。
- 提供文字自動完成。 提供最有可能或最近輸入值的清單,讓文字輸入更容易。
- 對於使用多個選取專案的重要工作,如果通常使用標準多重選取範圍清單,請提供一個選項來改用複選框清單。
- 尊重系統計量。 針對所有大小使用系統計量不會硬線大小。 如有必要,用戶可以變更系統計量或 dpi 以符合其需求。 不過,將此視為最後手段,因為使用者通常不一定必須調整系統設定,讓 UI 可供使用。
在此範例中,功能表高度的系統計量已變更。
控制重設大小、版面配置和間距
- 針對一般控件,請使用建議的控件大小。 這些足夠大,適用於良好的手寫筆體驗,除了微調控件(無法搭配手寫筆使用,但是多餘的)。
- 選擇將控件放在最可能使用位置的版面配置。 盡可能將工作互動保留在小型區域內。 避免長距離手部移動,特別是針對一般工作和拖曳。
- 使用建議的間距。 建議的間距為手寫筆易記。
- 互動式控制項應該觸碰或最好在它們之間至少有 5 像素 (3 個 DLL) 的空間。 如此一來,當用戶點選預定目標外部時,就會避免混淆。
- 請考慮在控件群組中新增超過建議的垂直間距, 例如命令連結、複選框和單選按鈕,以及群組之間的間距。 這麼做可讓它們更容易區分。
互動
- 針對設計為接受手寫的程式,請啟用預設筆跡。 默認筆跡可讓使用者只要開始寫入即可輸入筆跡,而不需要點選、提供命令,或執行任何特殊動作。 這麼做可讓您使用手寫筆進行最自然的體驗。 對於未設計為接受手寫的程式,請以選取方式處理文字框中的手寫筆輸入。
- 如果您的程式有需要編輯文字的工作,允許使用者縮放內容 UI。 請考慮在使用畫筆時自動縮放至 150%。
- 因為手勢是記住的,因此指派它們表示跨程式一致。 請勿為具有固定語意的手勢提供不同的意義。 請改用適當的程式特定手勢。
手部
如果視窗是內容相關,請一律在啟動窗口的物件附近顯示它。 將它放開,讓視窗未涵蓋來源物件。
如果使用滑鼠顯示,則盡可能將內容視窗位移向下和向右放置。
位於物件右側的內容型視窗

顯示它從中啟動之物件附近的關係型視窗。
如果使用手寫筆顯示,請盡可能放置內容型視窗,以免由使用者的手遮住。 針對右手使用者,向左顯示;否則會顯示在右側。
放置於物件左側的內容型視窗

使用手寫筆時,也會顯示關係型視窗,讓使用者的手不涵蓋這些視窗。
開發人員: 您可以使用 getMessageExtraInfo API 來區分滑鼠事件和手寫筆事件。 您可以使用具有 SPI_GETMENUDROPALIGNMENT 的 SystemParametersInfo API 來判斷使用者的 手。
寬恕
- 提供復原命令。 在理想情況下,您應該為所有命令提供復原,但您的程式可能有某些命令無法復原其效果。
- 提供良好的暫留意見反應。 清楚地指出手寫筆何時超過可點選的目標。 這類意見反應是防止意外作的絕佳方式。
- 只要可行,請提供良好的手寫筆意見反應,但在移動或畫筆之前不要採取動作。 這麼做可讓使用者在犯錯之前更正錯誤。
- 只要可行,允許用戶輕鬆地更正錯誤。 如果動作對畫筆生效,允許使用者在手寫筆仍然關閉時滑動來更正錯誤。
文件資料
參考手寫筆輸入時:
- 將手寫筆形狀的手寫筆輸入設備稱為畫筆。 在第一次提及時,請使用平板電腦畫筆。
- 將畫筆側邊的按鈕稱為畫筆按鈕,而不是桶狀按鈕。
- 一般是指鍵盤、滑鼠、追蹤球、手寫筆或手指作為輸入設備。
- 在記錄使用手寫筆的特定程式時,請使用點選 (和按兩下),而不是按兩下。 點選表示按下螢幕,然後在按住時間前抬起。 它不一定用來產生滑鼠點選。 針對未牽涉到手寫筆的互動,請繼續使用 Click。