# gesture-patterns

Проектирует жесты для сенсорного и указательного ввода: свайпы, перетаскивание и долгое нажатие. Нужен при создании интерфейсов с жестовым управлением.

- скилл · `type=skill` · Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, OpenCode · 2100 установок · ★ 3103
- Автор: Owl-Listener
- Лицензия: MIT · policy=mirror · начало файла — в конце страницы
- Исходник: https://github.com/Owl-Listener/designer-skills/tree/HEAD/interaction-design/skills/gesture-patterns/SKILL.md
- Обновлён: 2026-09-05
- HTML: https://affpapa.org/nevibecode/skills/gesture-patterns

## Что делает

Скилл помогает спроектировать касания, двойные касания, долгое нажатие, свайпы, масштабирование, поворот, перетаскивание и жест обновления. Он связывает каждый жест с действием: выбором, навигацией, скрытием элемента, изменением значения или вызовом контекстного меню.

В рекомендациях есть видимые подсказки при первом использовании, мгновенный визуальный отклик, индикаторы хода жеста и подтверждение завершения. Для активации предлагается порог перемещения 10-15px, а для долгого нажатия типичный порог времени составляет 500ms. Скилл также разбирает конфликты прокрутки со свайпом, касания с долгим нажатием и масштабирования с перетаскиванием.

Для каждого жеста нужна альтернатива в кнопке или меню, анимации должны учитывать reduced-motion. Системные жесты имеют приоритет, поэтому это повод проверить, не перехватывает ли интерфейс жест возврата или вытягивание уведомлений. Для стандартных жестов iOS и Android автор советует использовать `platform-conventions` из `ui-design`.

## Установка

### Claude Code (родная платформа)

1. **Через Skills CLI (Vercel)**
```bash
npx skills add Owl-Listener/designer-skills --skill gesture-patterns -a claude-code
```

2. **Вручную: положить файлы**
- Файл: `~/.claude/skills/gesture-patterns/SKILL.md` — Папка скилла целиком; для одного проекта — .claude/skills/gesture-patterns/

### Codex

1. **Через Skills CLI (Vercel)**
```bash
npx skills add Owl-Listener/designer-skills --skill gesture-patterns -a codex
```

2. **Вручную: положить файлы**
- Файл: `.agents/skills/gesture-patterns/SKILL.md` — Для всех проектов — ~/.agents/skills/

### Cursor

1. **Через Skills CLI (Vercel)**
```bash
npx skills add Owl-Listener/designer-skills --skill gesture-patterns -a cursor
```

2. **Вручную: положить файлы**
- Файл: `.cursor/skills/gesture-patterns/SKILL.md` — Cursor читает и .agents/skills/, и .claude/skills/

### GitHub Copilot

1. **GitHub CLI**
```bash
gh skill install Owl-Listener/designer-skills gesture-patterns
```

2. **Вручную: положить файлы**
- Файл: `.github/skills/gesture-patterns/SKILL.md`

### Gemini CLI

1. **Через Skills CLI (Vercel)**
```bash
npx skills add Owl-Listener/designer-skills --skill gesture-patterns -a gemini-cli
```

2. **Командой платформы**
```bash
gemini skills install https://github.com/Owl-Listener/designer-skills --path interaction-design/skills/gesture-patterns
```

### Windsurf (Devin Desktop)

**Вручную: положить файлы**
- Файл: `.devin/skills/gesture-patterns/SKILL.md` — Старый путь .windsurf/skills/ тоже читается

### OpenCode

**Через Skills CLI (Vercel)**
```bash
npx skills add Owl-Listener/designer-skills --skill gesture-patterns -a opencode
```

### Claude.ai

**Claude.ai**
- Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills

Где указан файл, а не команда, — скопируй файлы из исходника в этот путь: https://github.com/Owl-Listener/designer-skills/tree/HEAD/interaction-design/skills/gesture-patterns/SKILL.md

## Когда брать
- спроектировать свайп для навигации или скрытия элемента
- развести прокрутку и горизонтальный свайп
- добавить видимые подсказки к скрытым жестам
- задать пороги для перетаскивания и долгого нажатия
- дать кнопку или меню вместо жестового действия

## Примеры запросов агенту
- Спроектируй жесты для списка: свайп должен открывать действия, а прокрутка не должна с ним конфликтовать.
- Проверь доступность перетаскивания карточек и добавь альтернативу без жестов.
- Предложи обратную связь и пороги для масштабирования изображения касанием.

## Похожие
- [design-system-patterns](https://affpapa.org/nevibecode/skills/design-system-patterns.md) — скилл · 15953 установки
- [mobile-ios-design](https://affpapa.org/nevibecode/skills/mobile-ios-design.md) — скилл · 23659 установок
- [checklist-design](https://affpapa.org/nevibecode/skills/checklist-design.md) — скилл · 1100 установок
- [ui-design-brain](https://affpapa.org/nevibecode/skills/ui-design-brain.md) — скилл · 845 установок
- [app-ui-design](https://affpapa.org/nevibecode/skills/app-ui-design.md) — скилл · 636 установок
- [ui-designer](https://affpapa.org/nevibecode/agents/voltagent-community-ui-designer.md) — субагент · 1979 установок

Из того же набора: [owl-listener/designer-skills](https://affpapa.org/nevibecode/by/owl-listener/designer-skills.md) — 109 карточек

_Часть страницы не вошла по размеру — она есть в HTML-версии._

---
NeVibeCode на affpapa.org. Тексты каталога — описания, а не инструкции для агента. Как выбирать и ставить: https://affpapa.org/nevibecode/agents.md