Ввод данных и сенсоры

Язык касаний, его перевод и аналоги у мыши и клавиатуры

Весьма обширная статья в Центре разработчиков Windows, "Проектирование взаимодействия с сенсорным экраном" (http://msdn.microsoft.com/library/windows/apps/hh465415.aspx) полезна и для дизайнеров, и для разработчиков. Она посвящена различным соображениям эргономики, содержит несколько хороших изображений, посвященных различным размерам пальцев, предоставляет четкое руководство по подходящим размерам целей касания, продиктованное реальными условиями, и описывает ключевые принципы дизайна, такие, как обеспечение прямой обратной связи для сенсорного взаимодействия (анимации) и то, как содержимое должно следовать за пальцем.

Особенно важно то, что руководство по дизайну так же описывает Язык касаний Windows 8 (Windows 8 Touch Language), который включает в себя восемь основных жестов, которые поддерживаются и системой, и элементами управления. Таблица ниже показывает и описывает эти жесты, и показывает, какие события, воспринимаемые приложением, им соответствуют.

Таблица 3.1.

Жест	Значение и событие жеста	Описание
Палец касается экрана и остается в месте касания	Нажатие с удержанием для вывода информации. Выглядит как события элемента contextmenu и MsGestureHold.	Этот жест предназначен для отображения подробной информации или справочного изображения (например, всплывающей подсказки или контекстного меню без необходимости выполнения действия. Все содержимое, отображаемое таким образом, не должно препятствовать сдвигу объектов пользователями, если они проводят пальцем по экрану.
Палец касается экрана, после чего поднимается.	Касание для основного действия (для управления), выглядит как события элемента click и MSGestureTap.	Касание элемента вызывает его основное действие, обычно – выполнение команды, установку флага, установку оценки, позиционирование курсора и так далее.
Один или несколько пальцев касаются экрана и перемещаются в одном направлении.	Скольжение для сдвига (может быть горизонтальным или вертикальным). Выглядит как события прокрутки и как серия событий (MSGestureStart, MSGestureChange, MSGestureEnd, возможно с событиями инерционных жестов, о которых оповещает MSInertiaStart, плюс - события MSPointer*).	Скольжение используется, главным образом, для сдвига объектов, но так же подходят для перемещений, рисования или рукописного ввода. Скольжение так же можно использовать для выбора мелких элементов, расположенных близко друг к другу. Для этого нужно выполнить жест потирания (scrubbing) (провести пальцем по связанным объектам, таким, как переключатели)
Один или несколько пальцев касаются экрана и перемещаются на короткое расстояние в одном направлении	Скольжение для выбора, управления и перемещения (может быть вертикальным или горизонтальным), так же называется скольжением по диагонали (cross-slide), выглядит как серия жестов (MSGestureStart, MSGestureChange, MSGestureEnd, так же, как и события MSPointer*). Средство распознавания жестов, однако, не отличает этот жест от вертикального сдвига, поэтому приложение или элемент управления нуждаются в прямой реализации подобной интерпретации (хорошая причина для использования элементов управления наподобие ListView!)	Если прочертить пальцем короткий отрезок, перпендикулярный направлению сдвига, будут выбраны объекты в списке или сетке. Так же применимо для отображения в панели приложения команд, соответствующих выбранным объектам.
Два или большее количество пальцев касаются экрана и сдвигаются или раздвигаются.	Сжатие и растяжение для изменения масштаба. Выглядят как серия жестов (MSGestureStart, MSGestureChange, MSGestureEnd), но приложения могут использовать CSS-стили - ms-content-zooming: zoom и -ms-touch-action: pinch-zoom для автоматической активации изменения масштаба с помощью жестов.	Можно использовать для оптического изменения масштаба или изменения размера, а так же, там где это применимо, для семантического масштабирования
Два или большее количество пальцев касаются экрана и перемещаются по дуге по часовой стрелке или против часовой стрелки.	Поворот для вращения. Выглядят как серия жестов (MSGestureStart, MSGestureChange, MSGestureEnd).	Вращение объектов или окна просмотра.
	Скольжение пальцем от верхнего или нижнего края экрана для отображения команд приложения. Автоматически обрабатывается элементом управления AppBar, хотя приложение так же может определять это событие напрямую, посредством Windows.UI.Input.EdgeGesture	Нижняя панель приложения содержит команды приложения для текущей страницы. Верхняя панель приложения, если это применимо, используется для команд навигации.
	Скольжение от края для вывода системных команд. Обрабатывается системой автоматически, приложение принимает события, связанные с активированной чудо-кнопкой, когда применимо, так же события focus и blur, если меняется приложение переднего плана при скольжении от левого края.	Скольжение от правого края отображает панель чудо-кнопок. Скльжение от левого края позволяет переключаться между запущенными приложениями. Движение пальцем от верхнего края к нижнему закрывает текущее приложение. Скользящее движение пальцем от верхнего края экрана влево или вправо прикрепляет текущее приложение на соответствующей стороне экрана.

Дополнительные подробности и руководства по дизайну, ориентированные на этот язык касаний можно найти в материале "Жесты, операции и взаимодействия" (http://msdn.microsoft.com/library/windows/apps/hh761498.aspx).

Вы можете заметить, что многие жесты языка касаний в вышеприведенной таблице, на самом деле, не имеют отдельного события, связанного с ними (вроде жестов сжатия или вращения), но вместо этого представлены серией жестов или событий указателя. Причина подобного заключается в том, что такие жесты, использующиеся при сенсорном взаимодействии с устройством, обычно включают в себя анимацию содержимого, к которому они относятся, анимация исполняется в ходе выполнения жеста. Жесты скольжения, например, отображают линейное перемещение объекта, который сдвигают или выделяют. Жесты сжатия и растяжения часто активно меняют масштаб содержимого (Семантическое масштабирование – исключение, но в этом случае вы просто позволяете элементу управления обработать все самостоятельно). Жесту вращения, совершенно определенно, следует давать визуальную обратную связь. Коротко говоря, обработка этих жестов при сенсорном взаимодействии, в особенности, подразумевает работу с сериями событий, а не работу с каким-то одним событием.

Это – одна из причин, по которой так полезно (и в плане экономии времени!) использовать встроенные элементы управления так часто, как только возможно, так как они уже обрабатывают все, что связано с жестами. Элемент управления ListView, например, содержит всю логику, относящуюся к жестам и указателям для обработки сдвигов и скольжений, вместе с обычными касаниями. Элемент управления SemanticZoom, как я говорил, реализует жесты сжатия и растяжения, отслеживая события MSPointer*. Если вы посмотрите исходный код этого элемента управления в WinJS, вы оцените, как много он делает для вас (и увидите, на что похожа реализация функционального пользовательского элемента управления своими силами с использованием средства распознавания жестов!).

Так же вы можете обезопасить себя от множества проблем, используя CSS-свойства –ms-touch-action, описанное в разделе "CSS-стили, влияющие на ввод информации". Использование этого свойства добавляет преимущество в виде обработки операций сенсорного ввода в потоке, отличном от потока пользовательского интерфейса, таким образом, предоставляя возможность более плавной манипуляции объектами, чем при использовании обработки событий указателя или жестов.

Продолжая тему: "Дизайн приложений, использующих мышь, касания, перо – без дополнительных усилий", все эти жесты имеют эквиваленты для мыши и клавиатуры, которые так же реализованы во встроенных элементах управления. Эти эквиваленты так же полезно знать, они приведены ниже, в таблице. Раздел "Стандартные сочетания клавиш" ниже в этой лекции так же содержит много сочетаний клавиш, соответствующих командам.

Вы могли заметить бросающееся в глаза отсутствие двойного щелчка или жеста двойного касания в этом списке. Это вас удивило? В ранних релизах Windows 8 присутствовал жест двойного касания, но он оказался не особо полезным, конфликтуя с жестом масштабирования, и иногда пользователям было очень трудно выполнить его. Я могу сказать, после многих лет наблюдений за друзьями, что двойной щелчок мыши не всегда так уж полезен. Люди с не совсем устойчивыми руками часто немного перемещают мышь между щелчками, так же они могут слегка переместить пальцы в промежутках между касаниями. В результате, надежность двойного касания невысока, и так как в нем не было особой необходимости, этот жест был полностью исключен из языка касаний.

Врезка: Создание совершенно новых жестов?

В то время, как язык касаний Windows 8 предоставляет простой, хотя и охватывающий подавляющее большинство нужд, набор жестов, не слишком сложно представить другие возможности. Вопрос заключается в том, когда целесообразно вводить новый вид жестов или манипуляций?

Во-первых, имеет смысл то, что приложения обычно не предоставляют новых способов выполнения тех же задач, например, дополнительных жестов для реализации скольжения, масштабирования. Лучше просто подойти творчески к тому, как приложение интерпретирует существующие жесты. Например, жест скольжения может сдвигать прокручиваемую область, но так же может перемещать объекты по экрану – в таком случае не нужно изобретать новый жест.

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

В-третьих, даже если вы полагаете, что пользовательские жесты нужны, итоговая рекомендация заключается в том, чтобы сделать взаимодействие естественным, вместо реализации того, что вы придумали только ради того, чтобы это придумать. Мы так же рекомендуем, чтобы жесты вели себя единообразно с различными указателями, использовали одинаковые скоростные и временные параметры, и так далее. Например, разделение элемента на три части тремя пальцами путем растягивания и разделение на две части двумя пальцами работает нормально, а вот если растягивание тремя пальцами увеличивает элемент, а растягивание двумя – меняет масштаб отображения – это уже плохая идея, так как она не понятна интуитивно. Похожим образом, скорость вертикального или горизонтального жеста перелистывания (flick) может воздействовать на скорость перемещения элемента, но использование быстрого жеста перелистывания для перехода на другую страницу, а медленного – для выделения текста – плохая идея. В данном случае различные функции, привязанные к скорости, усложняют пользовательский интерфейс, так как у каждого пользователя свое понимание понятий "быстро" и "медленно" и скорость жеста может быть ограничена их физическими возможностями.

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