Справочник жестов

В данном справочнике собраны самые распространённые жесты, которые используются на мобильных устройствах.

Жесты

Руки являются прекрасным инструментом для коммуникаций с людьми и окружающей средой.

Руками мы можем создавать что-то прекрасное, проявлять свои эмоции (поднятый большой палец вверх), решать судьбы других людей (опущенный большой палец вниз, в Римской Империи) и даже посылать не симпатичных нам людей куда подальше (да, тот самый жест).

Некоторое время назад технологии позволили нам управлять информацией при помощи наших рук. И это совершенно новый опыт, и возможности, которые необходимо развивать.

Использование жестов для управления мобильными устройствами стало повсеместным. Мобильные устройства без сенсорных экранов уходят в прошлое. Теперь вся сила коммуникаций лишь в ваших двух руках.

Но, чтобы раскрыть максимально потенциал мобильных устройств с сенсорными экранами, мы должны изучить способ общения с этими устройствами. А он достаточно прост: жесты.

В этом справочнике мы рассмотрим все основные жесты, которые используются на мобильных устройствах: Tap (Тап), Swipe (Свайп), Long Press (Долгое нажатие), Long Press и Drag (Нажал и потянул), Pinch и Spread (Стягивание и растягивание), Double Tap (Двойное нажатие), Force Touch (Сильное нажатие).

Tap (Тап)

Тап — это клик в мире мобильных устройств. Однократное непродолжительное нажатие на элемент. Позволяет взаимодействовать с любыми доступными обьектами на экране.

Это наиболее распространённый жест в мире мобильных устройств. Позволяет запускать приложения, открывать страницы, передвигаться внутри приложений и т.д.

Swipe (Свайп)

Свайп — это второй по распространённости жест после тапа. Он знаком каждому, кто когда-либо заходил в интернет с мобильного устройства.

Его использование интуитивно и достаточно ограничено: свайп для того, чтобы прокрутить страницу вверх/вниз (скролл), или, чтобы перемещаться между экранами (главный экран на iOS, свайп влево / вправо позволяет перемещаться между страницами главного экрана).

Также свайп позволяет отображать и скрывать спрятанные панели (например, меню навигации), вызывать уведомления (свайп сверху вниз на iOS), вызывать панель управления (свайп сверху вниз на Android), перелистывать фотографии и производить множество других действий.

Свайп иногда используется в качестве защитного дизайна. Когда необходимо защитить пользователей от случайного нажатия. Например, для разблокировки в iOS необходимо сделать свайп.

Long Press (Долгое нажатие)

Долгое нажатие является аналогом правого клика. На большинстве мобильных платформ долгое нажатие позволяет вызывать контекстные меню либо дополнительные действия связанные с нажимаемым обьектом.

На операционной системе Windows долгое нажатие работает точно так же, как правый клик — вызывает контекстное меню элемента.

Для пользователей Android, данный жест прекрасно знаком. Долго нажатие на любом элементе списка вызывает контекстное меню, которое позволяет проводить массовые манипуляции с элементами списка (удаление, перемещение).

На iOS долгое нажатие используется гораздо реже, чем на других операционных системах. Поэтому, если вы создаёте дизайн для iOS устройства, лучше избегать использования долгого нажатия. Потому как знают о задаче данного жеста только наиболее продвинутые пользователи.

На iOS есть аналог длинного нажатия — сильное нажатие (доступно начиная с iPhone 6S), которое позволяет вызывать дополнительные действия в зависимости от силы нажатия. Подробнее мы рассмотрим далее или же можно почитать в нашем обзоре 3D Touch.

Нажми и перетащи

Данный жест является анлогом функции drag and drop, которая знакома всем на стационарных компьютерах. Долгое нажатие на перемещаемом обьекте активирует возможность перемещать его путём перетаскивания.

Периодически встречается на всех платформах (например для смены расположения иконки на рабочем столе, смены порядка и расположения элементов и т.п.).

Pinch и Spread (Стягивание и растягивание)

Данные жесты в основном используются для увеличения/уменьшения изображений, приближения/отдаления карт, увеличения/уменьшения веб страниц. Представляет из себя сьезжание и разьезжание двух пальцев на экране.

Данный жест позволяет сразу видеть результат взаимодействия с обьектом.

Также, в iOS данные жесты позволяют открывать/закрывать фотографии и выходить из альбома.

Двойное нажатие

Двойное нажатие позволяет увеличивать и уменьшать масштаб (точно также как pinch и spread). Некоторые приложения позволяют при помощи данного жеста проводить дополнительные манипуляции (выделение текста, сохранение записи в закладки).

Сильное нажатие

Данная технология используется в последних версиях продуктов компании Apple. Их экраны позволяют различать силу нажатия и, в зависимости от этого, предлагают различные варианты взаимодействия с обьектом.

Например, сильное нажатие позволяет предпросмотреть обьект, не открывая приложения, либо вызвать меню дополнительных действий.

Детально данная технология рассмотрена в статье о 3D Touch.

Плюсы и минусы жестов

Жесты открывают колоссальные возможности для управления мобильными устройствами. Можно создать огромное количество различных вариаций, которые будут вызывать различные действия. Это позволяет избавиться от лишних кнопок в интерфейсе и добавить интерактивности.

Самым основным минусом жестов является их неинтуитивность. Вы можете рассчитывать, что люди знакомы с 7 перечисленными выше жестами, но они совершенно не знакомы с остальными жестами.

Если вы решаете добавить в своё приложение дополнительные жесты для управления, то пользователей придется учить использовать новый жест. Это потребует создания специального обучающего блока или же дополнительных подсказок.

Люди не любят учиться чему-то новому, особенно в приложениях. Много новой информации приводит к непониманию и отказу от приложения. Поэтому имеет смысл вводить жесты в интерфейс постепенно, по одному за раз.

Также, достаточно высок риск непонимания того, как работает ваше приложение, если вы скроете кнопки основных действий и замените их жестами.

Поэтому, если вы планируете дополнить приложение своими жестами, необходимо решить следующее:

• Насколько востребованы дополнительные жесты вашим пользователям
• Не конфликтуют ли они с жестами операционной системы
• Как вы будете обучать новым жестам пользователей

Любые замечания и предложения по поводу справочника можно писать в комментарии, мне на email или в twitter.

Если вы начинающий или практикующий дизайнер, советую ознакомиться с справочником по дизайну приложений для iOS и справочником по дизайну приложений для Apple Watch