Подсказки в эпоху прикосновения

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

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

Знаете ли вы, существует ли подмена концепции подсказок для сенсорных устройств? Они фактически не имеют одной степени свободы в ui взаимодействии: позиция указателя. Как эффективно восстановить этот канал связи?

Ответ 1

В зависимости от того, кого вы спросите, они могут даже сказать вам, что интерфейс, который нуждается в подсказках инструментов, который должен быть понятным, нуждается в перепроектировании, плохо (см. Jef Raskin: Humane Interface).

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

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

Итак, я думаю, что не столько нехватка подсказок, сколько проблема здесь, а скорее то, что мы не изучали много новых способов взаимодействия с компьютером за последние 30 лет (в основном не с тех пор, как исследование, проведенное Doug Engelbart и Xerox PARC в 60-х и 70-х годах).

Сенсорный ввод достаточно похож на него, что он подходит для большинства целей. Но он не только не обладает компонентом location-without-touch, но и точностью. В принципе, все сенсорные входы хороши для того, чтобы что-то прикоснуться и что-то перетащить. Даже двойное нажатие затруднено, поэтому нам действительно нужно какое-то фундаментальное изменение в том, как проектировать и создавать пользовательский интерфейс специально для сенсорного интерфейса.

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

Поэтому я бы посоветовал вам просто немного подумать о том, как вы разрабатываете свой интерфейс. Как уже говорилось (и можно прочитать в Alan Cooper About Face), подсказки для инструментов предназначены для маркировки элементов управления, которые не имеют меток или где пространство не будет Достаточно разместить их. Ключевым сценарием использования здесь являются панели инструментов. Но интерфейс, предназначенный для прикосновения, сделает все элементы управления более крупными. Многие маленькие значки, тесно сгруппированные вместе, являются болью для использования с сенсорным вводом, даже если у вас есть подсказки для инструментов, просто потому, что ему не хватает точности.

Ответ 2

Чтение здесь заставило меня задуматься. Подсказки обычно используются для придания ярлыкам текстовых кнопок, но также являются отличным способом предоставления дополнительной информации в сокращенном пространстве, доступном в интерфейсе. Иногда он использовался для предоставления контекстной помощи или подробного объяснения одного виджета.

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

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

Those ? buttons were popular in the Win 95 days, but have largely dissapeared now.

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

Я бы использовал его только для предоставления дополнительной помощи, когда вы столкнулись с маленьким экраном, в противном случае сделайте область помощи видимой в любое время в нижней части "окна" (отбрасывая любые квадратные формы -interface), который изменяет его содержимое, чтобы предоставить подробное объяснение и/или помощь для выбранного виджета, как это делается в некоторых окнах настроек при наведении.

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

Ответ 3

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

Ответ 4

Я могу придумать пару решений этой проблемы

1) Создайте приложение, чтобы оно не нуждалось в всплывающих подсказках. Поместите текст на кнопки (пусть и маленькие), используйте простые значки или покажите "подсказку" на "первом использовании кнопки" (с возможностью "не показывать это снова", как только пользователь узнал, для чего предназначена кнопка)

2) Отвечайте на события при касании, а не на касание. Ответьте на касания, которые были проведены в течение 0,5-1 секунды, показывая пузырь "помощи". Если появляется пузырь справки, нормальное событие кнопки не срабатывает при касании (поэтому пользователи, которые ищут помощь, не вызывают срабатывания).

3) Используйте парадигму перетаскивания "вопросительный знак", предложенную @voyager. Или сначала попросите пользователя "коснуться" вопросительного знака, затем нажмите элемент, в котором ему нужна помощь.

Ответ 5

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

Ответ 6

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

Просто, чтобы дать вам некоторую идею...

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

Это говорит о том, что всплывающие подсказки чрезвычайно полезны в ситуациях, когда

  • как конструктор , который вы не хотите/не можете объяснить каждую деталь о некоторых функциях графического интерфейса в пределах определенной области пользовательского интерфейса
    • из-за удобства использования, доступного общего пространства и т.д.
    • например. взяв приведенные выше примеры, это может быть полезно даже по простому сценарию мобильных вызовов для пожилых людей.
      • Это может быть не знакомо с множеством вещей, которые мы "уроды";-) находим тривиальными.
      • И их следует поощрять к тому, чтобы щелкнуть без страха, чтобы случайно вызвать какую-то горячую линию для покупок и, наконец, убедиться, что они не могут жить без пылесоса 1000 EUR.
      • поэтому в этом случае парадигма подсказки с одним щелчком может иметь смысл
        • обычно я бы не рекомендовал его, но
  • как пользователь вы не уверены в значении некоторых предоставленных действий/кнопок и т.д.
    • снова придерживаясь предыдущих примеров, даже опытный пользователь Adobe Premiere может не помнить всех деталей об определенной функциональной области всех доступных модулей/плагинов
      • например. если большую часть времени вы снимаете видео и редко настраиваете настройки звука.
      • тогда как другие могут иметь проблему наоборот.

Теперь вернемся к ограничениям и возможностям сенсорного интерфейса...

  • :-) Hover. Я недавно видел где-то, что некоторые устройства могут распознавать палец, прежде чем он на самом деле касается сенсорной панели, или он отличается от интенсивности (например, только очень мягкое касание). Это, казалось бы, идеальный кулон для установленной функциональности всплывающих подсказок на интерфейсах WIMP для меня
    • Конечно, это будет зависеть от возможностей сенсорного оборудования.
  • :-) Масштабирование UI: я действительно , как Концепция масштабирования интерфейса. Джои также
    • концепция использования только двух пальцев уже довольно распространена для масштабирования, и идея довольно интуитивная, например. отображая более подробную информацию, такую ​​как типичная информация о подсказках, при масштабировании на кнопке
    • но он, по общему признанию, вводит проблему дифференциации между тем, что мне нравится иметь всплывающую подсказку для этой кнопки, и мне нравится масштабировать всю область в/из, не имея подсказки кнопки возле моих пальцев
      • хотя я бы подумал, что типичные области с поддержкой всплывающих подсказок сильно отличаются от масштабируемых областей вообще
        • например. некоторые области содержимого PDF-считывателей, как правило, визуально отделены от, например, некоторая панель инструментов (кнопка)
      • всплывающие подсказки для областей без действия, например, некоторая текстовая область снова не тривиальна для обработки или потребует еще более "соглашения о дифференцировании жестов".
    • с точки зрения развития, кажется, также довольно надежным
  • :-) QM: вопросительный знак или функция перетаскивания может быть хорошей альтернативой
    • когда многие из них повсюду на экране кажутся глупыми, особенно когда им приходится приобретать определенное пространство для клики/перетаскивания.
    • наличие одного для перетаскивания везде кажется лучше, но снова потребуется пространство для него на экране
    • с точки зрения развития я бы счел это, по крайней мере, немного сложным, как общее решение, потому что drag'n drop - это общая функция, и дифференциация в пользовательском интерфейсе между ними приносит некоторую всплывающую подсказку, которую я должен обрабатывать, и вот какой-то файл drop, который я должен обрабатывать (например, в области загрузки файлов), может быть нелегким или, по крайней мере, общим для существующих фреймворков.
  • : - | Удерживайте: идея запуска всплывающей подсказки, если пользователь не освобождает нажатие через определенный промежуток времени, например. 1s, кажется, является вторым лучшим решением для меня
    • это уже обычная функция в некоторых сценариях, так как упомянутые всплывающие окна на экранной клавиатуре (например, опираются на "o" и получают список избранных альтернатив, таких как oóòô).
    • снова требуется определенное доверие от пользователя, что он не выполнит действие с областями в релизе
    • на некоторых кнопках может быть трудно отличить то, что пользователь хочет сделать, например. нажатие кнопки "+" для увеличения количества и удержания ее для увеличения или увеличения может противоречить этой функциональности всплывающей подсказки.
    • для областей без действия, действие push-hold может показаться интуитивным
    • с точки зрения развития это может быть довольно легко, хотя могут существовать некоторые противоречия в отношении поведения, упомянутые выше.
  • : - | SCT/DCA: решение с одним щелчком мыши показывает всплывающую подсказку, дважды щелкните действие. Я мог представить, что полезен в ограниченных сценариях
    • например. мобильный вызов для некоторых пожилых или фиктивных людей, упомянутых выше, или где действие должно быть защищено от бессознательного или неуверенного использования
    • снова перспектива развития снова выглядит здесь.
  • : -/SCA/DCT: решение однократное нажатие выполняет действие, двойная щелчка показывает подсказку кажется мне очень странной
    • Если вы не уверены в какой-либо функциональности, вы, возможно, не захотите нажать кнопку на всех, и, конечно, не дважды, особенно если вы не можете быть уверены, можете ли вы ожидать этого поведения.
    • перспектива развития может быть проблематичной:
      • после чего дважды щелкните два клика по одному клику?
      • что, если второй клик не распознается или не может быть распознан, например. потому что появляется какое-то другое всплывающее окно, макет пользовательского интерфейса изменяется внезапно, пользователь не тщательно нацелился,...
  • : -/Другие жесты: использование других жестов, о которых я упоминал, или я мог подумать, например рисовать вопросительный знак над областью, находящейся под прикрытием, каким-то образом прокручивая область.
    • потому что это, похоже, не является общей предпосылкой, мне это не понравится, потому что оно также может заблокировать другие функции, доступные в противном случае

Ответ 7

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

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

Если не "click-on-item-shows-tooltip-second-click-perform-action" как насчет близости? Если вам нужна информация о виджетах пользовательского интерфейса, с достаточным интервалом, вы можете коснуться рядом с виджетами и получить информацию об этом, коснуться виджета и выполнить действие.

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

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

Помимо этого, я думаю, что особенности вступают в игру. Вы говорите о планшете для ноутбука? сенсорный интерфейс телефона с очень ограниченным пространством? Я думаю, что доступное пространство играет большую роль в том, как вам нужно что-то делать с сенсорным интерфейсом.

Ответ 8

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

Ответ 9

Это может быть полезно:

подсказки материала Google

Говорят, что всплывающие подсказки

Призвано:

  • Наведение курсора на элемент с помощью курсора
  • Фокусировка на элементе с клавиатурой (обычно клавишей табуляции)
  • Прикосновением

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

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

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

Я вижу выше этого упоминания, но другой современный пример использования - игры. Они часто разработаны с учетом джойстика, что означает, что у них есть примерно 14 кнопок для работы, но большинство из них заняты игровыми функциями.

В RPG у них обычно есть сложные статусные экраны, которые гарантированно неизвестны игроку (часто они придумывают новые системы для каждой игры), наполненные числами, которые важны, но игроки не знают. Многие из них позволяют вам нажать кнопку выбора, чтобы войти в режим подсказки/объяснения.

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

Ответ 10

Чтобы перефразировать Эйнштейна, прикосновение должно быть таким простым, каким оно должно быть, но не проще.

Основная проблема здесь - не касание, а состояние. В каком состоянии находится объект, когда вы касаетесь его? Прикосновение меняет свое состояние? Как изменение состояния отразилось на пользователе?

С точки зрения дизайна, попытка охватить все действия одним касанием будет работать только в самых простых случаях. Для любого более полезного приложения первое касание может изменить состояние, и это состояние может быть отражено изменениями в изображении объекта, с помощью подсказок (даже переходных всплывающих подсказок, которые уходят после установленного времени) или другими способами. Прикосновение к выбранному объекту должно иметь другое значение, чем касаться не выбранного объекта. Это должно быть видимым аспектом интерфейса.

Ответ 11

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

Для планшетов я бы взял идею вопросительного знака, но добавил еще немного сложности:

1) Когда вы нажимаете на вопросительный знак, он переключается в режим "Справка". 2), вы можете нажать на соответствующий элемент управления и отобразить всплывающую подсказку. 3), если вы снова нажмете на тот же элемент управления, он прекратит режим справки и выполнит то, что должен делать контроль. 4) если вы нажмете на любой другой элемент управления, он покажет свою всплывающую подсказку, и режим справки будет включен. 5) можно остановить режим справки, снова нажав вопросительный знак.

Ответ 12

Мой ответ не так практичен, но...

Проблема будет решена, если приложения будут поддерживать отмену функциональности, и люди привыкли знать, что они могут ВСЕГДА отменять любые действия.

Как говорит Андреас: "Если вы не уверены в какой-то функциональности, вы бы не решались нажимать кнопку вообще".

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

Это одна из причин, почему кнопка "Назад" настолько популярна, и Android даже сделал ее операционной системой в целом.

К сожалению (вот непрактичность...)

  • Построение надежного всенаправленного отскока намного сложнее, чем подсказки
  • достаточно приложений необходимо поддерживать его, чтобы изменить мышление всех пользователей (ха!)