Что пользователи помнят больше всего, положение или цвет элементов?


11

У меня есть навигационное меню с некоторыми кнопками, который выглядит немного как это (Примечание: Каждая кнопка имеет отличительный значок , которые отличают его от остальных, я не добавить их в макете , но они похожи на Wins8 иконки):

введите описание изображения здесь

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

введите описание изображения здесь

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


2
Я бы не назвал это «не по теме», но это может иметь больше смысла при переходе на UX.
DA01

@ DA01 Да, я рассматривал его. Цветная часть вещей заставила меня задуматься и, наконец, подумала: может ли принадлежать и то и другое? Я не против перенести его, хотя!
Yisela

Некоторые из ваших пользователей будут иметь сине-желтую дальтонизм. Убедитесь, что эти цвета отличаются для них!
keshlam

@keshlam Определенно! У меня есть приложение для дальтоников на панели задач, чтобы попробовать палитры :)
Yisela

Я бы сказал, нет. Запах более запоминающийся :)
Scott

Ответы:


5

Также не помогает то, что вы работаете с тремя четырехбуквенными словами, которые начинаются с буквы «S». :)

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

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

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

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


Спасибо! Просто примечание: у кнопок есть довольно четкие значки, я не могу раскрыть реальные скриншоты, и я не добавил их в макеты ... но люди, тем не менее, путают их!
Yisela

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

6

Вещи, которые можно использовать для различения кнопок:

  • этикетки (очевидно)
  • цвет
  • размер
  • приказ
  • расположение
  • близость
  • форма / стиль

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

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

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

--------  --------
| SAVE |  | SIGN |                                               DELIVER -->
--------  --------   

Здесь я использовал ряд отличий ... близость, стиль / тип кнопки и переименовал «отправить» в «доставить» (см. Ниже).

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


3

Я согласен и с Йоханнесом, и с DA01, они оба подняли вопрос, который я хотел бы сказать о позиционировании, аллитерации и т. Д.

Но то, что я хотел бы добавить.

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

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

Если ваши значки не сразу распознаются, т. Е. У вас есть диск или usb вместо традиционной дискеты для значка сохранения, тогда я настоятельно рекомендую изменить цвет, как вы предлагали, люди понимают, что зеленый означает, что уходит.

Надеюсь, что пользователи в конечном итоге счастливы;)


1

Что пользователи помнят больше всего, положение или цвет элементов?

Я не буду предлагать конкретные предложения, но краткий комментарий к заголовку: это очень индивидуально. Также как некоторые люди скажут «Я понимаю, что вы имеете в виду», а другие скажут «Я слышу вас» или что-то подобное. Некоторые люди настроены на визуальные эффекты, некоторые люди более настроены на звук.

Некоторые люди более приспособлены к форме, другие к цветам. Так же , как вам нужно , чтобы удовлетворить страдающий дальтонизмом, необходимо учитывать , что не все люди видят shape- и -colours в качестве основных ключей к навигации (некоторые люди будут идентифицировать дерево, животное, дом по форме или цвету, некоторые будут идентифицировать вождения автомобиля с помощью звука , а не формы и / или цвета и т.д.).

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

Так как вы не можете показать нам реальные кнопки с иконками, то становится трудно предположить. Один простой способ может состоять в том, чтобы просто увеличить расстояние до «вне», как предполагает @ DA01. Вроде как MailApp:

введите описание изображения здесь

Просто мысль.


редактировать

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

Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.