touch-interface

Design touch targets, gestures, and direct manipulation for mixed-input interfaces.

1|Updated Sep 11, 2026
One-click install
npx skills add https://github.com/rebuildup/my-web-2026 --skill touch-interface-rebuildup
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: touch-interface
Source: https://github.com/rebuildup/my-web-2026/tree/main/skills/touch-interface
Command: npx skills add https://github.com/rebuildup/my-web-2026 --skill touch-interface-rebuildup

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Touch support is often reduced to mobile spacing tweaks, producing undersized hit targets, gesture-only actions, and broken experiences when users switch between touch, mouse, pen, and keyboard. This Skill provides a structured workflow for designing reliable coarse-pointer interaction. ## Core Features & Use Cases - Hit Target Design: Separates visual size from effective hit area, comparing WCAG 2.2 minimums against Android, Apple, and Windows platform guidance instead of flattening them into one magic number. - Gesture & Direct Manipulation Rules: Ensures swipe, drag, pinch, and long-press actions have simple-pointer alternatives, preserve standard gesture meanings, show in-progress feedback, and support cancellation or undo. - Mixed-Input Continuity: Verifies that state, focus, and task context survive input switching, software keyboards, and orientation changes on 2-in-1 devices and tablets. - Use Case: When designing a drag-to-reorder list for a tablet app, use this Skill to add a visible move action as an alternative, validate hit target spacing against platform guidance, and confirm the flow still works after switching to a hardware keyboard. ## Quick Start Use the touch-interface skill to review this screen's touch targets, gestures, and mixed-input behavior against WCAG and platform guidance.

Frequently Asked Questions about touch-interface

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I design touch targets that meet accessibility guidelines?

Separate visual size from hit area so small icons can have larger effective targets without overlapping neighbors. Compare WCAG 2.2 minimum spacing requirements with Android, Apple, and Windows comfort guidance rather than adopting one universal size.

How to make swipe and drag gestures accessible?

Provide a simple-pointer alternative for any non-essential multipoint, path-based, or drag gesture, such as visible action buttons alongside swipe actions or a move option alongside drag reorder. Keep standard gesture meanings unchanged and ensure actions can be cancelled or undone.

What is the minimum touch target size for WCAG 2.2?

WCAG 2.2 defines a minimum target size with spacing and exception rules, but it is a floor, not a comfort ideal. Platform guidance from Android, Apple, and Windows defines larger comfortable sizes that should inform frequent or high-risk actions.

Does touch design need to support keyboard and mouse users too?

Yes. Devices like 2-in-1 laptops and tablets with trackpads mix input methods, so selection, focus, expanded state, and scroll position must survive switching between touch, mouse, pen, and keyboard without breaking the task flow.

Why do custom gestures cause usability problems?

Hidden custom gestures are undiscoverable and can conflict with system-reserved interactions like edge navigation. Use them only when necessary, discoverable, easy to perform, and never as the sole path to an important action.