Веб-дизайнер, арт-директор. Пишу про дизайн и, иногда про маркетинг
9 заметок с тегом

Юзабилити

Отказ от ответственности

23 февраля 2015, 0:17

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

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

Ошибки и программисты

30 сентября 2014, 22:45

Сообщения об ошибках не должны писать и/или оформлять программисты. Когда они пытаются это делать вместо слов получаются коды: 400, 403, 404 или какой-то не внятный уродливый бред типа этого:

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

Самое плохое, что дизайнеры перенимают плохие привычки от программистов забывая, что «404» или что-то ещё нихрена не значит для людей. Нет смысла писать «Ошибка 404», как-то красиво оформлять или дорисовывать тени к цифрам. Достаточно просто написать, что произошла ошибка (можно даже не объяснять почему) и посоветовать пользователю что-нибудь сделать.

Много уже написано про «правильные» с точки зрения маркетинга 404 страницы, но это уже высший пилотаж. Для начала надо просто научиться говорить по-человечьи. К сожалению, даже у нас в «Чипсе» дизайнеры всё время пишут «404».



UPD. Ещё пара человеко-ориентированных сообщений об ошибках.
Я не успел написать письмо и поэтому сессия закончилась. Очень жаль.

Мне вместо пароля вышлют «контрольную строку». Отлично!

Отличное описание новой фичи во ВК

Анализ банковских калькуляторов по вкладам

20 октября 2013, 20:38

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

«Альфабанк»

Результат калькуляции вполне понятен. Но визуальное его оформление не впечатляет ни разу.


«ТрансКредитБанк»

Таже ситуация, но чуть лучше. Главная информация немного крупнее, но не выделена красной полоской как на Альфе.


«Траст»

У «Траста» дизайна результа чуть больше и даже есть подсветка важных полей при наведении, но что бы понять суть пришлось посидеть поразбираться. Не сразу понял, что «Доходность» это и есть то сколько я получу в конце срока. Кстати, у «Альфы» и «ТКБ» написано именно так «Сумма к концу срока», что гораздо понятнее. Зачем мне в этом же блоке выводят и другие кредитные пакеты, которые не попадают введённые мной данные для меня не понятно.


«Тинькофф»

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

«Элементы опыта взаимодействия» Джесс Гарретт. Обзор книги

14 апреля 2013, 18:58

Книга Дж. Гарретта является практически классикой жанра и потому я не мог пройти мимо. А так же хотелось наконец до конца для себя прояснить чем отличаются понятия «юзабилити» и «юзер экспириенс» («UX», Опыт взаимодействия).

В книге с первых же страниц написан пример опыта взаимодействия, который на уровне ощущений даёт понять что есть опыт взаимодействия:

«Авария на дороге. Она произошла из-за того, что водитель на секунду отвлёкся, чтобы убавить громкость радиоприемника. Ему пришлось отвести взгляд от дороги, так как на ощупь отличить ручку громкости от других невозможно.».

Хочу добавить, что читая эти строки я вспоминал про давнюю историю небольшой аварии в которую я попал со своим другом Стасом (привет Стас). Он как раз отвлёкся от дороги переключая песню. Ничего страшного не случилось, но машинка была помята и зад автобуса тоже, и группу «7Б» с тех пор мы больше не любили.

Если будете читать, то уделите особое внимание объяснению такого тонкого понятия как «контекст использования». Контекст использования это ситуация в которой пользователь взаимодействует с сайтом/объектом/системой. И действительно, в машине за рулём контекст использования даже простого телефона совершенно другой нежели дома на диване. Это очень важный момент над которым стоит думать при проектировании чего-либо.


Основой всей книги является идея 5-ти этапной разработки:


  • Уровень 1. Стратегия. Стратегия включает в себя не только то, что хотят получить от сайта его владельцы, но и то, что хотят получить пользователи.
  • Уровень 2. Набор возможностей. Перечисление функциональных возможностей образует уровень набора возможностей сайта. Некоторые сайты, торгующие книгами, позволяют пользователям сохранять адрес, чтобы не пришлось указывать его повторно. Вопрос, включена ли эта (или любая другая) функция в список функций сайта, как раз относится к возможностям сайта.
  • Уровень 3. Структура. Структура определяет, как пользователи попадают на страницу и куда они могут направиться дальше.
  • Уровень 4. Компоновка. Компановка это прототипирование. Расположение кнопок, вкладок, фотографий и текстовых блоков. Компоновка проектируется так, чтобы организация этих элементов была максимально эффектной и эффективной, то есть чтобы вы запомнили логотип и смогли найти кнопку с корзиной, когда она понадобится.
  • Уровень 5. Поверхность. Графический дизайн сайта.

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

Вышесказанное иллюстрирует следующая картинка

Для практического использования эти 5 уровней делятся на составляющие:


Не бойтесь этой на вид сложной схемы. Ничего сложного в ней нет. А ещё больше упрощает понимание то, что она очень логична и её в общем-то можно вывести самостоятельно (что мы и сделали в «Чипсе»). Но если бы мы сначала прочитали Гарретта, то сэкономили бы кучу времени. Так что смотрим и пользуемся.

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

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

В общем творение Гарретта читать обязательно стоит. Особой привлекательности ей придаёт, то что она состоит всего из 175 стр. полезной информации с минимумом воды.

Оставьте отзыв или юзабилити визиток

31 марта 2013, 23:30

На выходных второй раз ходил в кафе QLB (Квик Лав Бургер) и получил вот такую карту с целью оставить отзыв. Вроде всё хорошо и правильно, но вот сама карта мне показалась странной.

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

Вывод: накосячить с юзабилити можно даже рисуя визитку.

P. S.: рулерс был холодным.

Ctrl + ↓ Ранее