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

Антон Стасевич написал о создании документации для enterprise-систем: структура документа, в чём его вести (wiki), примеры определений терминов, описаний бизнес-ролей, общих сценариев и сценариев использования.

«Согласно Википедии, пользователь — лицо или организация, которое использует действующую систему для выполнения конкретной функции.

Нас это определение не устраивало. 1) В систему может зайти только человек, но не организация. 2) Некорректно настоящее время глагола «использует» — система хранит данные о неактивных или удаленных пользователях, т.е. о тех, которые использовали систему ранее, но не могут в настоящее время. И наконец, у нас есть данные о потенциальных пользователях. Например, мы регистрируем сотрудника компании-клиента, который в дальнейшем может получить (а может и не получить) доступ в систему.

Наше определение: пользователь — человек, который имеет, имел, или, возможно, будет иметь доступ в систему для совершения операций. Теперь программист, прочитав определение, сразу поймет, почему свойство Логин в объекте Пользователь не обязательное».

Дмитрий Силаев и Лариса Сорокина из «Юзабилитилаб» рассказали, что такое first-click тестирование, какие есть инструменты для его проведения и какие данные можно получить для анализа.

Кстати, для теста банковских приложений они остановились на прототипе Axure со встроенными Google Analytics и Яндекс-метрикой (ради Вебвизора).

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

Сергей Тихомиров написал об омниканальном пользовательском опыте.

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

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

http://sergeytikhomirov.ru/ux-v-omnikanalnom-mire/

Игорь Штанг на примере главной сайта «Буквы русского» рассказал, как сделать компоновку страницы выразительнее:
— Избавьтесь от засилия прямоугольников;
— Уделите внимание иллюстрациям;
— Подумайте о фирменных элементах;
— Придумайте Большую Идею;
— Оставьте в покое PT Serif и PT Sans.

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

Екатерина Сучкова сделала конспект книги Стива Круга «Не заставляйте меня думать». Хороший вариант для тех, кто не может заставить себя читать.

https://readymag.com/u99763174/519479/

Джейк Цакудакис написал, как правильно делать всплывающие подсказки:

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

http://sketchapp.me/proektiruya-luchshie-obuchayushhie-vsplyvayushhie-podskazki/