Видео о таком когнитивном искажении как ошибка выжившего.

— Не всегда стоит смотреть на успешный продукт и делать так же;
— Для улучшения продукта стоит опрашивать в том числе тех, кто отказался от его использования.

Кирилл Беляев написал о курсе Ильи Бирмана «Пользовательский интерфейс и представление информации».

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

«Понравился рассказ, как Илья отправлял Артёму свою первую схему челябинских троллейбусов и трамваев. Он предложил Илье убрать промежутки между параллельными линиями. Илья убрал и написал, что теперь линии плохо различимы и отступы нужно вернуть. Артём ответил, что вместо отступов, цвета подбирают так, чтобы те хорошо различались».

Психолог из Valve Майк Амбиндер рассказал о человеческом внимании, предпочтениях, когнитивных искажениях, мотивации и как это использовать при разработке игр. Хороший пример борьбы с «токсичным» поведением:

«В конце матча стали задавать 2 вопроса. Сначала просили оценить уровень командной работы. Отношение игрока к своей команде — полезные данные, но мы спросили это только ради следующего вопроса: оцените собственный уровень работы в команде.

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

Из-за конфликтующих идей возникает когнитивный диссонанс: я плохо работал в команде, но я очень хотел бы оценить себя на 5. Совсем небольшое изменение, маленький опрос, но общее число ежедневных жалоб упало на 12,5%».

Видео in English.

Эндрю Койл написал об интерфейсных приёмах, с помощью которых можно упростить работу с большими таблицами.

— Закрепление заголовка;
— Закрепление столбца с параметрами и отдельных столбцов;
— Возможность изменить ширину столбца;
— Чередование фона в строках (зебра);
— Отображение сводки по табличным данным;
— Появление управляющих кнопок при наведении курсора на строку;
— Возможность редактирования данных в строке;
— Отображение дополнительных данных, связанных со строкой (Эндрю предлагает несколько разных способов);
— Сортировка и фильтрация (разные способы);
— Настройка отображаемых столбцов и их порядка следования.

In English. #table

Рауль Гулати собрал примеры применения эвристик Якоба Нильсена для интерфейса. Несмотря на название статьи, там не только дашборды.

In English. #heuristic

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

Анимации в интерфейсе становится всё больше. Крупные компании вроде Google и IBM в своих рекомендациях уделяют ей отдельное внимание.

Часто разработчики получают от дизайнеров довольно смутное описание задачи: видео или GIF с анимацией в несколько секунд и пара комментариев. Им приходится самостоятельно анализировать происходящее на картинке, а дизайнер часто получает не то, что планировал.

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

In English.

6-я серия Abstract рассказывает о графическом дизайнере Поле Шер из Pentagram — о логотипах, плакатах и работе со шрифтом.

Записал выступление Ольги Павловой на ITGM #10 о навыках и не-навыках проектировщика.

Навыки в смежных темах (начинается в 6:20):
— Компоновка текста;
— Вёрстка в базовом варианте (html&css);
— Преобразование сырого материала в таблицы и схемы;
— Создание бумажных интерфейсов (например, бланков);
— Понимание сырых данных.

Второй блок полезных навыков (начинается в 16:00):
— Проработка концепции решения;
— Создание интерактивных прототипов;
— Использование реалистичного контента в прототипе;
— Работа ручкой и бумагой (оставаться в этом режиме как можно дольше);
— Повышение скорости работы (клавиатурные сокращения);
— Использование библиотек;
— Автоматизация работы (скрипты для рутинных операций);
— Изучение новых форматов взаимодействия (VR);
— Командная работа (как минимум признавать необходимость команды);
— Вытягивать вводные по задаче;
— Умение внимательно читать;
— Участвовать (не вести его, а только участвовать) в мозговом штурме;
— Презентовать свою работу.

В какие области лезть не стоит. Или если вы этим занимаетесь, стоит задуматься о смене профессии (с 32:10):
— Написание текста, который читает пользователь (включая микротекст);
— Бизнес-анализ и решение бизнес-задач. Проектировщик не должен решать бизнес-проблемы. Он зачастую не способен их даже понять. Лучше учиться пользоваться результатами труда аналитиков;
— Исследование и анализ пользователей (социология);
— Управление проектами;
— Внедрение UX-процессов в компании.

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

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

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

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

Сокращённый отрывок из 35-й главы «100 новых главных принципов дизайна» Сьюзан Уэйншенк.

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

Есть решения, которые подойдут и без тонкой настройки:
— Показывать время доставки вроде «закажи сегодня до 18, получи уже завтра» (было на Озоне);
— На какую сумму положить товаров в корзину, чтобы была бесплатная доставка или скидка;
— Остатки товара (было на Юлмарте);
— Высокий спрос на товар вроде «этот товар просматривает ещё 3 человека» (было на Букинге);
— Понятные условия возврата в карточке товара;
— Наличие пунктов самовывоза.

https://vc.ru/p/25-ecommerce-personalization-samples

Николай Бабич для блога Adobe написал большую статью о формах: о структуре, полях ввода, подписях, кнопках действий и обратной связи.

Структура формы:
— Просите вводить только то, что требуется;
— Последовательность полей должна быть логичной;
— Группируйте связанную информацию;
— Располагайте поля в один столбец.

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

Подписи к полям:
— Делайте их лаконичными;
— Избегайте капса;
— Для быстрого сканирования формы, располагайте подписи над полями;
— Старайтесь не отображать подпись как плейсхолдер.

Кнопки действий:
— Выделяйте основное действие;
— Не располагайте кнопку «Назад» прямо под полями формы;
— Избегайте общих слов вроде «Отправить форму»;
— Избегайте кнопок с несколькими действиями;
— Не используйте кнопку «Очистить форму»;
— Кнопка должна визуально реагировать на нажатие;
— Показывайте, что нажатие на кнопку привело к какому-то действию.

Обратная связь:
— Валидируйте поле сразу после его заполнения (принцип «награждать раньше, наказывать позже»);
— Сохраняйте введённые данные локально, пока форма не отправлена.

https://medium.com/pavljenko/3844211d1e17

Адам Сильвер написал о проблемах паттерна float label — расположение лейбла внутри текстового поля и смещение его вверх после заполнения поля содержимым.

— Нет места для дополнительных подсказок;
— Такие подписи труднее читать: по умолчанию они серые как плейсхолдеры, а после ввода содержимого — мелкие;
— Поля становятся выше, чтобы было место для смещения лейбла;
— Пользователь может посчитать, что поле уже заполнено (см. проблемы использования плейсхолдеров);
— Непоследовательность: не применить к выпадающим спискам;
— Длина поля может быть меньше длины подсказки.

http://sketchapp.me/vsplyvayushhie-podskazki-eto-problema/

Игорь Штанг дополнил рассказом о выключке по знаку свои заметки о разных вариантах выключки (ссылки на них есть в конце статьи).

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

http://nobelfaik.livejournal.com/139728.html

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

Как они группируют проблемы, ранжируют по значимости, формируют фронт работ на день шлифовки: vc.ru/p/polish-day

Высочайший приоритет у самых заметных багов. Самое неприятное — наслоение элементов, нечитаемый текст, плохие пустые страницы и отсутствие помощи при ошибках.

В статье Брейдена Ковица из Google Ventures — больше о том, зачем вообще эти мелочи надо исправлять: medium.com/rofldorf/488d08b2854d

Ксения Донская для Тильды составила подборку лекций TED для дизайнеров (почти у всех есть русские субтитры).

Первые 10 видео:
— Главный секрет хорошего дизайна – это внимание (Тони Фаделл, Apple);
— Как обрести уверенность в творчестве (Дэвид Келли, IDEO);
— Искусство первого впечатления — в дизайне и в жизни (Чип Кидд);
— Airbnb: как создать доверие в дизайне (Джо Геббиа, Airbnb и Y Combinator);
— Моя жизнь в шрифтах (Мэттью Картер);
— Простота продает (Дэвид Пог);
— Как хороший дизайн делает нас счастливее (Дон Норман, Nielsen Norman Group);
— Семь правил: как дизайнеру (и не только) стать счастливее (Стефан Загмайстер);
— Секрет счастливой работы (Шон Эйкор);
— О природе человеческого гения (Элизабет Гилберт).

Остальные собраны в альбоме: https://vk.com/videos-50773057?section=album_19

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

http://sketchapp.me/registraciya-neizbezhnoe-zlo-kak-razrabotat-krutuyu-formu-registracii/

UI / UX-дизайнер из Сан-Франциско Джесси Чен изучает, как дизайн помогает межкультурному бизнесу Airbnb. В своей статье она поделилась результатом пользовательского исследования Airbnb на китайском рынке.

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

https://medium.com/rofldorf/a26fcd750a9a

Павел Оларь написал о коридорном тестировании:
— в чём его смысл,
— какие вопросы стоит задавать респондентам,
— плюсы и минусы.

https://habrahabr.ru/post/219699/

Записал несколько интервью со знакомыми проектировщиками. Получилось довольно спонтанно, они не готовились к вопросам.

Сергей Павельчук:
— О работе в Return on Intelligence;
— Где лучше (в аутсорсере или стартапе), что нужно знать проектировщику;
— Уровень дохода стажёра и опытного специалиста.

Артём Комаров:
— Роль проектировщика и составляющие хорошего продукта;
— Нулевой интерфейс;
— Что отличает сеньора от джуниора;
— Что делать джуниору, UX-портфолио.

Александра Постовалова:
— Рынок кадров проектировщиков.

Все выпуски собраны в альбоме: https://vk.com/videos-50773057?section=album_18

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

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

Проверьте, есть ли на сайте или в прототипе будущего сайта:
— Чекбокс согласия на обработку персональных данных в форме обратной связи;
— Ссылка на политику в отношении этих данных.

Это не всё, что должно быть сделано, но это непосредственно влияет на интерфейс.

http://www.cossa.ru/152/158773/

Пример того, как AR решает реальные задачи. С приложением Measure можно не только померить стену или шкаф, но и сделать это в одиночку — не нужен человек, который придержит второй конец рулетки.

Рынок линеек и строительных рулеток скоро сильно сократится.

https://www.youtube.com/watch?v=z7DYC_zbZCM