Закон Фиттса в эпоху осязания
Опубликовано: 2022-03-10Когда я начал писать Touch Design для мобильных интерфейсов , я регулярно находил интересную тему или касательную, которая уводила далеко вглубь, и мне приходилось останавливать себя, чтобы не зайти слишком далеко. Я не хотел стать отшельником, который умирает с так и не законченным пятнадцатитомным трудом на постоянно меняющуюся тему.
Но о многих стоит поговорить отдельно, и вам может понравиться закон Фиттса и то, как он работает с сенсорными экранами. Большинство интерактивных дизайнеров любого рода узнают это и, как правило, знают некоторые очень небольшие подмножества уроков наизусть. Как говорится, закон таков:
«Время, необходимое человеку для перемещения указателя в целевую область, зависит от расстояния до цели, деленного на размер цели».
Затем есть ряд терминов и полезных уроков из этого. Некоторые распространенные:
- Нулевая точка
Пиксель под указателем мыши или курсором можно использовать мгновенно, без движения. - Чем больше, тем лучше
Большую цель всегда легче щелкнуть, чем меньшую. - Волшебные края
Края экрана «бесконечно глубокие»; вы не можете пропустить край, так как мышь останавливается, когда достигает его. Меню вдоль верхнего края, например, легче нажимать, чем элементы того же размера, только немного смещенные. - Волшебные уголки
Эта бесконечная глубина вдвойне верна для углов, так что их легче всего выделить в областях, не находящихся под мышью.
Конечно, мы все знаем, что многое из этого не всегда верно. Есть и другие факторы, которые вступают в игру. Слишком большими кнопками на самом деле довольно сложно пользоваться, так как они перестают восприниматься как кнопки. Люди сосредотачиваются на объектах действия, поэтому попытаются щелкнуть значок или текстовую метку внутри кнопки, истощая часть силы размера.
Или, может быть, ребро не является краем. Или мы знаем, где мышь, но не руки пользователя. Или мыши нет вообще.
Следите за своими предположениями
Пол Фиттс был психологом, который во время войны был старшим офицером ВВС США. Он был убежден, что слишком много потерь самолетов и экипажей произошло из-за того, что можно было бы назвать плохим учетом человеческого фактора . Он основал Исследовательскую лабораторию авиационной психологии в Университете штата Огайо, где, помимо его известных исследований, проводилось много важных работ по безопасности полетов.
Многое из того, что мы делаем в UX-дизайне, основано на стандартах человеческого фактора, но мы должны быть осторожны в их применении. Например, они часто делали предположения о том, кто такие пользователи. Изучались только подтянутые, молодые, не дальтоники, как правило, белые европейцы, которые летали на самолетах и (по большей части) управляли сложными машинами, когда стандарты перешли в промышленность.
Но они также делают предположения об окружающей среде. Хотя самолет может быть суровым и неумолимым, мы знаем, где находится пилот по отношению к органам управления. Даже на компьютерном рабочем месте; однако мы понятия не имеем, где находится рука пользователя. Применение работы Фиттса предполагает, что рука все время находится на мыши; нулевое время или усилия, чтобы щелкнуть то, что находится под указателем. Но что, если я печатаю, или пишу на бумаге, или только что повесил трубку, или еще что-нибудь из тысячи? На самом деле речь идет о человеческом движении, а не о движении мыши, не так ли?
В дизайне мы делаем много предположений, не продумывая их. Мы размещаем элементы управления по краям веб-сайтов и приложений, но края окон просмотра очень часто не являются краями дисплеев. Веб-браузеры окружены хромом, и даже развернутые приложения в Windows не закрывают панель задач. Нижний край и углы вашего приложения теперь не бесконечно глубоки, не так ли?
Конечно, это довольно сложно так легко и плавно наносить на ощупь.
Где твои руки?
Безусловно, работа Фитта верна. Расстояние и размер цели применимы почти повсеместно. Но простота, возникающая из предположений в компьютерных системах, управляемых мышью, на самом деле неприменима к сенсорным системам.
Хотя я только что поднял вопрос о том, что, возможно, пользователь не держит мышь, в случае касания мы действительно никогда не знаем, где находится рука. Действительно, нет. Если вы не читали ни одной из моих работ, то можете подумать, что все держат телефон одной рукой и касаются большим пальцем, вот так:
Но их просто нет. У нас есть достоверная информация, подробно описанная в главе 5 «Сенсорный дизайн для мобильных интерфейсов», о том, что люди держат свои телефоны разными способами и постоянно меняют то, как они держат их. Даже для отдельных типов задач не существует какого-то одного предпочтительного способа удержания, поэтому мы не можем предсказать, что люди делают, с какой-либо степенью точности.
Итак, где ваши руки по отношению к желаемой цели на телефоне, планшете или компьютере с сенсорным экраном? Мы понятия не имеем. Компьютер не может ее обнаружить, и у нас нет указаний или вероятности того, где находится рука. Ни одна цель, и фактически ни одна часть экрана не находится ближе к указателю — руке пользователя — чем другая.
Этические принципы проектирования
За несколько поколений до Фиттса Ф. У. Тейлор создавал область научного управления с аналитическими принципами, которые будут полностью изучены Гилбретом в исследованиях времени и движения . Все это считалось управленческой практикой и предназначалось для оптимизации результатов и эффективности путем поиска «единственного наилучшего способа» выполнения задачи.
Даже в специализированных областях, таких как авиация, это оказалось чрезмерным упрощением. Люди — не машины, поэтому за последние несколько десятилетий безопасность полетов снова повысилась с помощью таких методов, как CRM. Управление ресурсами экипажа, ориентированное на человека, чтобы заставить команды работать вместе, решать проблемы — или, что чаще, избегать проблем — наряду с контрольными списками и процедурами.
Один из лучших способов мышления по-прежнему актуален и сегодня. Это даже само название набора усовершенствований процессов, недавно примененных WalMart. Я определенно вижу, что это отфильтровано до команд дизайнеров цифровых продуктов, разработчиков и даже дизайнеров. Если вы всегда начинаете со счастливого пути и вроде как не беспокоитесь о других способах, которыми пользователи могут работать с системой, сообщения об ошибках или предотвращение ошибок не имеют значения, потому что это просто пользователи делают это «неправильно».
Предполагается, что UX должен быть защитником пользователей, поэтому, по крайней мере, для моей практической области я считаю, что такое мышление почти неэтично.
Слишком много стандартов и допущений, лежащих в основе цифровых процессов и стандартов, предполагают рабочую станцию, но мы долгое время не знали, что такое компьютер и где он находится.
“
Теперь, с переходом на сенсорные и мобильные устройства, мы действительно должны признать, что для такого жесткого взгляда на мир нет места; мы можем многое предсказать, но не должны предполагать, о том, где находятся пользователи и как они работают. Как мы увидим, эти предположения в любом случае не всегда применимы, поэтому принуждение их к соответствию может привести к путанице и неудаче.
Попытка применить работу Фиттса к прикосновению
В то время как контекст исследований Фиттса и других касался авиации, машин или средств управления, фактическая математика, стоящая за всем этим, имеет дело только с одномерным движением. Сколько времени требуется не для перемещения даже по плоскости элементов управления или экрана, а для перемещения элемента управления из одного положения в другое с определенной точностью.
Хотя вы можете работать с этим, интерпретация по умолчанию для интерфейсов, управляемых мышью, делает некоторые неприятные предположения. Например, размер цели всегда измеряется как горизонтальная составляющая. Да, даже если это кнопка гораздо шире, чем в высоту, и курсор начинается ниже цели. Это проблема.
Для мобильных устройств поведение по умолчанию после касания элемента управления или прокрутки — очистка рабочей области. Иногда это означает, что палец или большой палец отодвигается от зоны фокусировки, чтобы увидеть, что произошло, но в большинстве случаев это означает, что пальцы полностью удаляются от экрана и зависают или отдыхают на некотором расстоянии. Конечно, некоторые пользователи переходят на автономную модель, в которой они ожидают, что какое-то время вообще не будут взаимодействовать с устройством. Будь то выпить, или положить телефон в карман, или отложить его, чтобы посмотреть видео. Телефон теперь очень далеко, пользователь должен предпринять другие действия, чтобы начать взаимодействовать, и выполнить несколько длительный когнитивный сдвиг, чтобы вернуться в режим взаимодействия.
Довольно быстро я понял, что пытаться применить формулу Фиттса для получения индекса сложности, а затем использовать мои экспериментальные данные, чтобы попытаться подогнать к этому наклон временных значений, было бы глупой затеей. Существует слишком много переменных, поэтому систематизация многих типов взаимодействия заняла бы всю жизнь.
Кроме того, известно, что работа Фиттса уже не является общеприменимой. Это хорошо применимо только к системам с движением конечностей. Это означает всю вашу руку, а не только движение пальцев. Подумайте о том, как вы используете мышь, трекпад, джойстик, штурвал или планшет. Вы двигаете, пусть и слегка, по большей части всей рукой.
В хорошо изученном контрпримере изометрические джойстики и другие элементы управления, использующие измерение силы вместо движения, плохо смоделированы или нуждаются в собственных модификациях или моделях. Хотя это и возможно, их сложно применить, так как вам приходится по-разному моделировать взаимодействия для разных частей ваших систем. Вы слышали о работе SK Card над этим в 1970-х и 80-х? Нет, конечно, потому что это сложно. Практикам нужна укороченная, упрощенная версия.
Проанализировав и изучив результаты исследований, я пришел к выводу, что то же самое можно сказать и о сенсорных взаимодействиях . Что в выводах есть предсказуемость и повторяемость, но они не вписываются ни в одну из существующих моделей.
И вообще, именно поэтому я даю ориентиры, а не математические модели. На портативных планшетах и телефонах с сенсорным экраном люди касаются центра быстрее и точнее, чем краев.
Существуют эти рекомендации (все они подробно описаны в книге) для целевых размеров, а также некоторые непонятные моменты, о которых следует помнить — все, что поможет вам в разработке интерфейсов и взаимодействий.
Учет скорости повседневной жизни
В моей работе на сегодняшний день, например, в книге, я специально не делился временем до касания, потому что они сильно различаются в зависимости от контекста использования. Но сейчас мы можем дать еще одно руководство о том, как использование мобильных устройств отличается от менталитета рабочей станции. Это, конечно, означает, что в большинстве проектов следует попытаться отказаться от предположения об управляемом мышью и сфокусированном внимании.
Мои любимые исчезающие элементы управления . Мы их часто видим: и в полосах прокрутки, и в хроме, и не только. Но давайте посмотрим на вездесущий видеоплеер, так как сейчас онлайн-видео — это норма. Скажем, вы нажимаете на видеоплеер, чтобы начать воспроизведение. Элементы управления исчезают или выдвигаются через короткое время, поэтому вы можете просматривать видео в полноэкранном режиме. При фокусировке и обычно с помощью мыши это работает нормально. Вы можете играть, а затем говорить «тьфу, кредиты» и мгновенно пропускать их, потому что элементы управления пропуском или индикатор выполнения находятся рядом. Кроме того, вы можете немного надавить на указатель, чтобы переместить воспроизведение на долгое время, а затем откинуться на спинку кресла и смотреть, как элементы управления исчезают.
На сенсорных экранах, хотя они также отвлекаются на обычную жизнь или случайный просмотр, применяется такое же количество времени, когда элементы управления исчезают, но этого недостаточно, чтобы их можно было использовать. Пальцы непрозрачны, поэтому мы нажимаем, а затем убираем пальцы с экрана. Но, может быть, мы соглашаемся посмотреть его, а потом понимаем, что нам нужно пропустить глупую часть. Итак, теперь нам нужно перевести свой мозг обратно в интерактивный режим . Мы ориентируемся на то, что видим, и отодвигаемся назад, чтобы действовать. Конечно, к тому времени управление — все настроено под мышь — исчезло.
Как я уже сказал, трудно дать полезные и действенные рекомендации по времени. И если бы я указал вам время для взаимодействия при касании, мне также нужно было бы указать то же самое для системы, управляемой мышью, для сравнения. Мое общее наблюдение — без проведения полного цикла тестирования специально для этого — что время будет одинаковым для аналогичных взаимодействий, но не все взаимодействия и среды одинаковы.
Вы можете попробовать это, чтобы убедиться, что вы правильно проектируете, или лучше оценить его в обзорах и демонстрациях. Просто подумайте о контексте и положите телефон в карман или откиньтесь на спинку кресла и наблюдайте за работой системы, а затем вернитесь к взаимодействию, когда придет время. Помните, что даже юзабилити-тесты могут привлечь слишком много внимания со стороны пользователя , поэтому устанавливайте нереалистичные ожидания в отношении режимов использования и ожидаемых скоростей. Следите за аналитикой, старайтесь заняться настоящей этнографией и просто наблюдайте за пользователями весь день, когда можете, и тщательно думайте о том, как люди могут на самом деле использовать ваш продукт в контексте.
Переход от WIMP к Touch
Хорошо, вы можете подумать, что это многое нужно запомнить и попытаться понять, как применить к своей работе. Я тебя прикрыл. Как и в книге, после того, как я разглагольствую об истории, погружаюсь в математику, познание, физиологию или этику, я возвращаюсь и заканчиваю простым контрольным списком.
Это было особенно трудно собрать воедино, так как мне пришлось пойти и найти все текущие советы по разработке пользовательских интерфейсов, особенно с законом Фиттса. В то время как некоторые из них хороши или стараются изо всех сил, есть и очень, очень плохие советы.
Обратите внимание : эта диаграмма не полностью переходит от лучших практик для мыши к сенсорным, поскольку она использует текущие советы — хорошие и плохие — к новым лучшим советам, которые я могу предложить.
| Обычная мудрость для мыши и рабочего стола | Лучшие практики для сенсорных и мобильных устройств |
|---|---|
| Располагайте контент сверху вниз, слева направо, самое важное в верхнем левом углу. | Люди читают и взаимодействуют наилучшим и быстрым способом в центре экрана. Поместите ключевую информацию в большую область прокрутки посередине. |
| Следите за сгибом, чтобы пользователи могли видеть всю необходимую им информацию. Не доверяйте прокрутке, так как полосы прокрутки далеко. | Все прокручивают, потому что жест простой и распространенный. Убедитесь, что пользователи знают, что есть еще контент, но ожидайте, что они обнаружат его самостоятельно. |
| Держите все параметры управления закрытыми, чтобы уменьшить движение мыши. «Отменить» и «отправить» должны стоять рядом друг с другом. | Несчастные случаи случаются, поэтому держите разрозненные и особенно разрушительные решения подальше от позитивных действий. |
| Охранные диалоги («Вы уверены?») хорошо защищают от случайного срабатывания. | Избегайте деструктивных действий вообще, а при необходимости убедитесь, что все они имеют методы отмены (или фальшивую отмену), а не защиту перед действием. |
| Люди сосредоточены на поставленной задаче и превыше всего хотят скорости. | Люди живут в мире, поэтому отвлекаются. Не отключайте уведомления по тайм-ауту и не предоставляйте ограниченное время для выполнения действий. |
| Края и углы бесконечно глубоки, поэтому размещайте там меню для быстрого доступа. | Края и углы — это области, на которые труднее всего нажимать, но они отлично подходят для того, чтобы скрыть малоиспользуемые меню и привязанные действия. Но только некоторые; сделайте их большими, чтобы пользователи могли успешно нажимать на них. |
| Всплывающие окна являются лучшими, потому что они могут появляться под мышью, поэтому требуется меньше движений по сравнению с меню и ящиками. | Всплывающие окна ужасны во многих отношениях, не в последнюю очередь потому, что они оторваны от своего контекста. Размещайте элементы в пользовательском интерфейсе или используйте ящики, аккордеоны и другие контекстные элементы для выбора. |
| Предоставьте пользователю инструменты для быстрого выбора, в том числе переключение мыши на основное действие. | Предоставьте пользователю возможность принимать обоснованные решения. Дайте им достаточно информации, чтобы сделать правильный выбор. Для последовательного выбора отсрочка перехода к действию хороша и дает время подумать, действительно ли они хотят это сделать. |
| Чем больше, тем лучше, поэтому не стесняйтесь добавлять кнопки и использовать очень длинные метки для наиболее важных кнопок. | Делайте интерактивные элементы, такие как кнопки, такими большими, насколько это необходимо для ожидаемого положения на экране. Сделайте метки четкими и лаконичными, чтобы пользователи могли их прочитать. |
| Круговые меню самые быстрые из возможных, так как все опции имеют одинаковое расстояние от начальной точки. | Радиальные меню теряют большую часть своей ценности, когда вы уходите от курсора, и они появляются неожиданно, поэтому кривая обучения мешает их теоретической ценности. |
Заключение
Во многих местах, где я работал, я вижу общее предположение, что все остальные прекрасно знают, что они делают. Мы не просто копируем Apple или Amazon или безоговорочно используем Material Design, но заимствуем «вдохновение» у конкурентов или любимых продуктов, которые мы используем, и безоговорочно верим, что все советы по дизайну верны.
Как я только что показал, стандарты и условности могут быть ошибочными . Они могут быть устаревшими, характерными для технологий, которые мы сейчас не используем, узко применимыми и чрезмерно применяемыми, неверно истолкованными и чрезмерно упрощенными или неправильно примененными.
Технологии, рабочие места и повседневная жизнь часто меняют способы, которые делают прежние предположения неактуальными. Мы вплотную подошли к одному из этих больших изменений — переходу от обычного компьютера, такого как ПК с мышью и клавиатурой, к мобильному сенсорному экрану.
Но что более важно, мы всегда должны задавать вопросы и стремиться к более глубокому пониманию . Мы должны не просто слепо следовать им, но всегда учитывать, что эти рекомендации и уроки значат для наших пользователей и наших продуктов.
Примечание редактора . В статье «Сенсорный дизайн для мобильных интерфейсов» Стивен делится своими глубокими исследованиями в области сенсорного дизайна с рекомендациями и эвристиками, которые вы можете сразу применить в своей работе. Прочитайте отрывок или получите книгу прямо сейчас.