Taking A Customer From Like To Love
http://uxdesign.smashingmagazine.com/2011/08/26/taking-a-customer-from-like-to-love-the-ux-of-long-term-relationships/
Есть вещи, относящиеся к впечатлениям от пользования, которые нельзя заранее указать в прототипе. Вещи, которые необходимы для того, чтобы посетители испытывали приятные ощущения во время «общения» с интерфейсом. Об этом идет речь в статье.

Improving The Online Shopping Experience, Part 1: Getting Customers To Your Products
http://uxdesign.smashingmagazine.com/2011/09/15/improving-the-online-shopping-experience-part-1-getting-customers-to-your-products/
Как расположить пользователей к своему интернет-магазину и какими на первый взгляд обычными, но на самом деле важными элементами, должен обладать интернет-магазин.

The S.M.A.R.T. User Experience Strategy
http://uxdesign.smashingmagazine.com/2011/09/13/the-s-m-a-r-t-user-experience-strategy/
Прекрасно, когда цель достигается за счет дружбы целей посетителей с бизнес целями. Что такое S.M.A.R.T. в контексте посетителя и для бизнеса.

Веб

7 Best Practices for Improving Your Website’s Usability
http://mashable.com/2011/09/12/website-usability-tips/
Что делать с текстовым контентом на сайте, чтобы его с удовольствием читали. Советы с примерами можно найти в статье.

Business Web Application Design
http://designmodo.com/business-web-application-design/
Как создавать приложение для бизнеса: какими требованиями руководствоваться, что учитывать при создании, когда идти на компромисс и много другое.

Мобильные девайсы

Поддержка мобильными платформами и браузерами технологии HTML5
http://mobilehtml5.org/
Проектируя интерфейс не стоит забывать какждый из последующих этапов разработки. Таблица, которая определяет возможности мобильных платформ и браузеров в технологии HTML5.

This is the Magazine Grid
http://grid.asidemag.com/
Полезный ресурс, который рекомендует сетку для приложения под iPad печатного издания.

10 Mobile Usability Testing Tips
http://answerlab.com/blog/2011/02/03/10-mobile-usability-testing-tips/
Полезная информация о том, чего ожидать от тестирования приложения для мобильного устройства и как его эффективно проводить.

Инструменты

Iconza
http://iconza.ru/
Часто для прототипирования не хватает иконок. Разные иконки разного цвета можно найти по ссылке.

• Полезные ссылки выпуск №8
• Полезные ссылки выпуск №3
• Виды usability-специалистов

Бритва Оккама

«Бритва О́ккама» или «лезвие Оккама» — методологический принцип, получивший название по имени английского монаха-францисканца, философа-номиналиста Уильяма Оккама. В упрощенном виде он гласит: «Не следует множить сущее без необходимости» (либо «Не следует привлекать новые сущности без самой крайней на то необходимости»).

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

Принцип KISS

KISS (англ. keep it simple, stupid — «не усложняй, тупица» или англ. keep it short and simple — «не усложняй») — процесс и принцип проектирования, при котором простота системы декларируется в качестве основной цели и/или ценности. Также часто используется более вежливая расшифровка — keep it short and simple («делай короче и проще»).

Чем проще, тем лучше!

Утиный тест

Утиный тест — шутливый тест на очевидность происходящего. В переводе с английского выглядит как:
Если оно выглядит как утка, плавает как утка и крякает как утка, то это, вероятно, утка и есть.
Тест подразумевает, что сущность явления можно идентифицировать по типичным внешним признакам.

Привычные вещи нужно называть привычными именами!

Принцип «YAGNI»

Принцип «YAGNI» (англ. You Ain't Gonna Need It — «Вам это не понадобится») — процесс и принцип проектирования, при котором в качестве основной цели и/или ценности декларируется отказ от добавления функциональности, в которой нет непосредственной нужды.

Согласно адептам принципа YAGNI, желание писать код, который не нужен прямо сейчас, но может понадобиться в будущем, приводит к следующим нежелательным последствиям:

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

Таким образом, если вы создаете новый продукт, подумайте, действительно ли нужны все функции.

Чем хуже тем лучше!

Чем хуже, тем лучше — подход к разработке программного обеспечения, объявляющий простоту реализации и простоту интерфейса более важными, чем любые другие свойства системы. Этот стиль описан Ричардом П. Гэбриелом (Richard P. Gabriel) в работе «Lisp: Good News, Bad News, How to Win Big» в разделе «The Rise of 'Worse is Better'» и часто перепечатывается отдельной статьей.

Гэбриел описывает подход так:

1. Простота: реализация и интерфейс должны быть простыми. Простота реализации даже несколько важнее простоты интерфейса. Простота — самое важное требование при выборе дизайна.
2. Правильность: дизайн должен быть правильным во всех видимых проявлениях. Простой дизайн немного лучше, чем правильный.
3. Логичность (последовательность): дизайн не должен быть слишком нелогичным. Иногда можно пожертвовать логичностью ради простоты, но лучше отказаться от тех частей дизайна, которые полезны лишь в редких обстоятельствах, чем усложнить реализацию или пожертвовать логичностью.
4. Полнота: дизайн должен охватывать как можно больше важных ситуаций. Полнотой можно жертвовать в пользу остальных качеств и обязательно нужно жертвовать, если она мешает простоте. Логичностью можно жертвовать в пользу полноты, если сохраняется простота; особенно бесполезна логичность интерфейса.

Ментальные модели.

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

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

• Новый дизайн главной страницы bigmir.net
• Юзабилити Украина 2010
• Cоздание мобильной версии сайта.

Общеобразовательное

UX-миф: пользователи пользуются вашим продуктом именно так, как вы предполагаете

http://uxmyths.com/post/1048425031/myth-24-people-always-use-your-product-the-way-you-imagi
Интересный ресурс, который собирает мифы юзабилити. И миф, на который ведет ссылка, очень распространен сегодня среди разработчиков и заказчиков.

Психология цвета: кнопки, призывающие к действию

http://www.paulolyslager.com/call-to-action-buttons-psychology-color
Какими должны быть кнопки, чтобы на них хотелось нажать и какой цвет этому поспособствует.

Когда обучение важнее удобства

http://www.uxbooth.com/blog/when-is-learnability-more-important-than-usability/
Все стремятся к тому, чтобы пользователю не пришлось учиться пользоваться интерфейсом. Однако, на смену обычным мобильным телефонам с кнопками пришли телефоны с тачскрином, которым приходилось учиться пользоваться. Есть и другие вещи, где пользователя необходимо научить, об этом идет речь в статье.

Веб

5 элементов, которые должен иметь каждый вебсайт

http://www.paulolyslager.com/top-5-elements-every-website-must-have
Все мы знаем, какие составляющие главной страницы. В статье можно черпнуть информацию о том, каким образом размещать те или иные элементы, как они должны выглядеть и какие функции выполнять.

Даешь читаемый текст!

http://contrastrebellion.com/
На сайте в интересной форме предоставлены примеры оформления текста на фоне (хорошие примеры и антипримеры) и объяснение, как сделать текст лучше читаемым.

Если ваша форма не дает ожидаемого результата

http://outspokenmedia.com/usability/online-form-usability/
Простые истины, о которых многие могут забыть при создании формы на сайте. Перейдите по ссылке и больше не забывайте, что пользователи ведут себя не так, как от них могут ожидать.

Мобильные девайсы

Юзабилити батл мобильных ОС: iOS, Blackberry, Windows Phone, Android.

http://www.electronista.com/articles/11/08/08/harvard.study.says.iphone.wp7.have.best.interface/
Ребята из Гарварда протестировали четыре телефона на удобство таких функций, как набор номера и звонок, добавление нового контакта, написание смс. Результаты смотрите в видео ролике по ссылке.

Долой диспетчеров такси, которые не берут трубку

http://lifehacker.ru/2011/08/08/intaxi-zakaz-taksi-dostojjnyjj-xxi-veka/
Как всегда сайт Лайфхакер радует полезными программами и выходками. На сей раз в обзоре приложение для iPhone (написано, вскоре и для Android), которое поможет жителям Москвы и Санкт-Петербурга найти себя на карте (кому-то это пригодится) и выбрать конечную точку. Читайте обзор по ссылке.

Инструменты

Приложение Prototype под Mac, которое превратит ваш макет в интерактивный прототип

http://prototypesapp.com/
Программа позволяет превратить созданный «плоский» макет в кликабельный прототип с эффектами и переходами по страницам. Этим прототипом потом можно поделиться и провести пользовательское тестирование.

• Полезные ссылки выпуск №3
• Cоздание мобильной версии сайта.
• Полезные ссылки выпуск №8

Всё начиналось достаточно хорошо.

Сообщите об изменениях на сайте

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

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

В новой версии будут отсутствовать:

• Заработанные и накопленные бонусы (коннекты)
• Загруженную информацию (фото, музыку, видео, аудио, персональные данные)
• Элементы для общения (подмигивание, микроблог, рейтинг, эмоций)
• А также разделы Новости, Ответы …

Пользователей попросили оставить только 9 фотографий, иначе они будут удаленны.

Профайл пользователя в социальной сети connect.ua

Вот как выглядел профайл в старой версии сайта:

Переход на новую версию

Лучшим переходом на новую версию является её запуск параллельно старой и постепенно завлекать на неё пользователей. Когда большая часть перейдет — установить её по умолчанию. Хорошим примером является обновление главной страницы портала bigmir.net.

В проекте connect.ua всё происходило комичней. В один «прекрасный день» пользователи вместо привычного сайта увидели надпись «Ведутся технические работы, а мы общаемся ». Потом добавился блок комментариев Вконтакте, что позволило общаться пользователям и распространять информацию о Connect на свои стены.

Потом происходили странные вещи на сайте. Появился телефон Коркина, его профайл ВКонтакте, единороги, ночь....

Всё это создало сверхожидания новой версии.

Новая версия connect

В новой версии сайта остался «голый» профайл. Новый сервис «Улица» ничем не отличался от бывшего «ЖЖОТ» (дает возможность оценивать аватарки случайных пользователей). Также появился «механизм внимания» в виде 10 сердечек, который ограничивал знакомство с новыми людьми.

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

Профайл пользователя в новой версии

Вот так выглядит профайл нового сайта, для нового пользователя:

Выводы и советы

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

Статистика посещаемости сайта connect.ua

Через день после запуска новой версии количество посетителей и просмотров сократилось в 3 раза!!!

Советы для редизайна сайта:

1. Проанализируйте вашу лояльную аудиторию.
2. Не забирайте у пользователя созданный им контент;
3. Не убирайте популярные сервисы, если им нет альтернативы
4. Внедряйте постепенно
5. Вовлеките пользователей в процесс создания новой версии

• Эволюция bigmir)net
• Новый дизайн главной страницы bigmir.net
• Регистрация на Точке

Новая главная страница bigmir.net

Первые впечатления

Первые впечатления от просмотра новой главной страницы портала bigmir.net— положительные. В первую очередь заметны огромные изменения  в дизайне.

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

Наконец-то ядреный синий цвет логотипа заменили на более спокойный и избавились от «колхозного» белого свечения. А вот расположение и размер девиза вызывает вопрос: «Чем больше, тем лучше?!»

"Шапка" сайта

Позиционирование шапки, которая ранее была ярко выражена и являлась логическим и визуальным центром страницы, изменилось. Он стала более «легкой» и приятной, но менее акцентированной. Большое внимание привлекает желтая плашка поиска.

Вывод: красивая, стильная, но не совсем внятная шапка получилась. Несколько усугубит ситуацию появление верхнего баннера.

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

Вот еще интересная вещь :

Подозрительное название кнопки. Будем считать. Что это баг.

Сервисы

Строка кнопок сервисов тоже потеряла свою четкость:

Кнопочки стали аккуратнее, приятнее визуально, но менее заметны.  Старые иконки гораздо лучше цепляли взгляд, а ICQ вообще «поставили в угол».

Блок новостей

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

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

Не так постно стал смотреться блок новостных ссылок

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

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

Учитывая его расположение, не спасает даже цветовое кодирование динамики изменения валюты.

Регистрация и почта

Очень интересное решение с кнопкой почты:

Двойная кнопка с подсвеченной секций «ВХОД» по-умолчанию. Смотрится незатасканно и свежо.

Сервисы

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

Дизайнеры решили обойтись одним блоком «Рекомендуем»:

Он смотрится более менее понятно и логично. Но потом начинаються вопросы: «Видео, описание к видео справа? В чем разница между фотографией, приколом и статьей из Корреспондента? Где чье название?»   Эти все и вносит повод для легкого недоумения.

Итог

Сайт, как и следовало ожидать, стал более современным по дизайну и морально свежим. Все за счет графики и упрощений. Правило KISS (keep is simple, stupid) использовали по максимуму и даже перестарались.

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

Иконки сервисов стали меньше, тусклее, незаметнее.

Ситуацию спасает большой новостной блок: разница контрастов белого и голубого градиента — она не дает сайту окончательно визуально рассыпаться. На ней и держится вся композиция.

Добавились интересные элементы, такие, как кнопка почты.

Одним словом, новый дизайн и интерфейс — без сомнений — шаг вперед.

Но есть огромное «НО»

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

Акценты сделаны именно на новостях, остальные разделы остались немного в тени. Посвященный им блок «Рекомендуем» внизу страницы выглядит скорее как реклама от партнеров. Кроме того на большинстве разрешений мониторов этот блок будет скрыт.

Возможно изменились стратегические цели страницы... время покажет.

Просим вас высказать свое мнение по поводу главной страницы, а также задавать вопросы по поводу редизайна. Мы выберем лучшие, зададим их дизайнерам bigmir.net и опубликуем в блоге. )

• Принципы проектирования
• Эволюция bigmir)net
• Оптимизация показателей конверсии с помощью юзабилити.

Критика и вопросы:
1. Как смс проектируеться на окно и как будет изменяться цвет текста от того на какой фон он проектируеться. На ролике почти всегда белый цвет на голубом небе )
2. Надевая очки девушка может просматривать информацию и снова вопросы: «Куда фокусируеться глаз? Не будет ли он уставать? И как черт возьми она глазами управляет?» )
3. Когда девушка отвечает на СМС то это только смайлы ) Странно почему не показали как она набирает текст.
4. Любопытно как в таких очках можно смотреть фильм или фото.

• Юзабилити анализ сайта oceni.com.ua
• Полезные ссылки выпуск №2
• Воздушный интерфейс будущего

Джеф Раскин

Начал читать книгу Джефа Раскина «Интерфейс» в записи буду добавлять интересные цитаты и свои разсуждения.

Кратко о Джефе Раскине

Он был 31-м по счету сотрудником в компании Apple, но именно ему она обязана компьютерами Macintosh. Именно Раскин изобрел однокнопочную «мышь», он придумал и само название Macintosh, а также ввел понятие «эргономика разума».

При проектировании он руководствовался «первым законом робототехники», придуманный Айзеком Азимовым: «Робот не должен вредить человеку или своим бездействием допустить, чтобы ему был нанесен вред».

В своей книге «The Humane Interface» он последовательно описал термины и порядок создания интерфейсов, после чего эта прежде творческая дисциплина встала в жесткие рамки и приобрела четкие правила

В попытках понять, что же такое «удобный» интерфейс, Раскин пришел к следующей рабочей метафоре: все мы знаем, что физические возможности человека ограничены; никто не будет собирать автомобиль, давить на педали которого надо с силой в 500 кг (говоря физически точно, 4905 ньютонов). Точно так же людям присущи определенные ментальные ограничения: человеку требуется определенное время на реакцию, он не способен воспринять за раз слишком много информации и т.д. — Джеф Раскин

Книга Джефа Раскина «Интерфейс»

Цитаты из книги «Интерфейс»

1.  «Простое должно оставаться простым» — о настройке електронных часов по сравнению с механическими

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

3. «Компьютер не должен тратить впустую ваше время или вынуждать вас выполнять действия сверх необходимых»

4. «Система должна рассматривать все данные, вводимые человеком, как бесценные»

5. «Интерфейс являеться ориентированным на человека, если он отвечает нуждам человека и учитывает его слабости»

• Интерфейс для таблетки
• Полезные ссылки выпуск №6
• 14 советов для создания приложения для iPad

Сенсорный дисплей

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

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

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

Преимущества сенсорного дисплея

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

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

Негативные стороны

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

Интерфейс для сенсорных дисплеев

Сенсорный дисплей в действии

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

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

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

Читайте также:

• «Глупые» пользователи
• Проектировать сайт для новичков или для продвинутых?
• Eye-traсking
• Закон Фитса

• Eye-traсking
• Мобильный интернет 2009
• Проектирование или юзабилити сайта

Зачем это нужно?

На самом деле Eye-traсking называют методику по которой можно четко сказать куда пользователь смотрит и как долго. Можно полностью проследить за взглядом, нарисовать путь по которому следуют взгляд человека.
Эта методика позволяет определить какой элемент интерфейса привлекает зрение, насколько другие элементы отвлекают от выполнения задач, насколько быстро пользователь знакомится с контентом.

Чем измеряют взгляд?

Есть целый клас приборов способных следить за взглядом человека.

Например прибор Tobii  X120 Eye Tracker (показан на рисунке), устанавливается непосредственно перед испытуемым (но чтоб не мешать взгляду, например под монитором).

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

Результаты исследования.

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

На основе исследования нескольких респондентов можно построить тепловую карту (heatmap). Где красные области -  области, куда попадает взгляд всех респондентов, желтая и оранжевая — почти все, зеленая, синяя- единичные взгляды, не засвеченные области — взгляд совсем не касался этих элементов.

Heatmap — пример компании Eyetools

Как это работает?  Примеры:

1 Eye — tracking исследование разного представления размещения подписей к полям формы.

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

2 Eye — tracking исследование рекламы .

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

Использование такой методики раскрывает большие горизонты в познании того как проектировать и тестировать интерфейсы.

Читайте также:  
• «Глупые» пользователи
• Проектировать сайт для новичков или для продвинутых?
• Зачем нужны юзабилисты?
• Не слушайте пользователей (правило юзабилити)

• Iforum — форум интернет деятелей (1.04)
• UX советы для не специалистов
• Наступление сенсорных дисплеев

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

Почему?
Всему есть причина. И вероятнее всего, что глупые и нелогичные диалоговые окна («Вы хотите закрыть этот файл? Да/Нет/Отмена», «Вы точно хотите закрыть этот файл? Да/Нет/Отмена», «Вы на сто процентов уверены, что хотите закрыть этот файл? Да/Нет/Отмена») впервые появились именно после звонка разгневанного пользователя, который убил четыре часа, попиксельно рисуя цветочек в MS Paint, а потом потерял все за десять секунд. Как же так, — возмущается пользователь, — вы что, не могли предвидеть, что я закрою программу, не сохранившись?!

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

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

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

Да/Нет/Отмена, проблема намного глубже.

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

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

Но пользователю-то наплевать на список функций. Ему вообще наплевать на программу как таковую. Ему не нужна сама программа. Ему нужно решить свои проблемы. Программа для него — всего лишь инструмент, и пользователь вовсе не жаждет тратить половину жизни на изучение ее возможностей. Он хочет, чтобы все было просто, надежно и удобно. Нетрудно заметить, что ни одна из этих характеристик не является сколь-нибудь важной для Homo Logicus.

Иногда доходит до смешного — Джефф Безос, рассказывая о том, как в Amazon внедряли систему 1-Click, вспомнил о первом разговоре с программистами, которым было поручено реализовать новую модель взаимодействия с покупателями (1-Click отличается от обычной системы покупок в интернет-магазине тем, что в ней купить товар можно с помощью одного щелчка мыши). Программисты внимательно выслушали маркетологов, сказали, что технических проблем возникнуть не должно, и отправились кодировать. Когда через некоторое время они решили показать черновой вариант, выяснилось, что на покупку требуется не один, как требовали маркетологи, а два клика. Возникли непредвиденные технические трудности? В ряды амазоновских программистов затесался саботажник? Один из программистов — заика? Нет, нет и еще раз нет. Они создали двухкликовую систему потому, что так было проще, и им показалось, что один или два клика — совершенно неважно. В конце концов, два клика тоже не очень много. Ну щелкнет покупатель лишний раз, рука не отвалится.

Вместо заключения

Попробуем подытожить. Проектировщику современных интерфейсов приходится иметь дело с:

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

Даже удивительно, что проектировщикам интерфейсов удается добиться хоть каких-то результатов. Да? Нет? Отмена?

Даже если вы всё сделали правильно, нет никакой гарантии, что пользователь верно вас понял. В России принято мыть посуду под проточной водой. В Великобритании домохозяйки затыкают раковину пробкой, наливают воду и только после этого начинают заниматься посудой. Никаких концептуальных отличий между русскими и британскими раковинами, естественно, не существует. Главные отличия — в головах.

из журнала "Компьютерра Автор: Сергей Задорожный

Читайте также:
• Проектировать сайт для новичков или для продвинутых?
• Баннерная слепота. Как лечить?
• Не слушайте пользователей (правило юзабилити)

• На что люди смотрят перед тем как купить, или 10 принципов для интернет магазинов
• Используйте доступное пространство на экране
• Google хочет захватить весь мир Интернета.