Size: a a a

2017 November 28
UX Boost
Пост №1. О "кирпичиках" в проектировании.
Когда я помогаю младшим коллегам что-то пилить, то постоянно вижу, как они хватают  большой и сложный интерфейс (страницу, форму, несколько страниц, целый раздел в системе и пр.), пытаются его как-то одновременно продумать и нарисовать.

Прямо сегодня помогал студентке (я веду курс по UX, нет времени объяснять, просто читай) с проектом о рекламе на транспорте.  Своего рода CRM.

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

Моя функция сегодня свелась к тому, что я заставил человека сузить фокус, и заниматься ТОЛЬКО карточкой, в ОДНОМ состоянии, забив на все остальное. В результате мы пошли НАМНОГО быстрее. И вместо невнятной, непонятно, неработающей, но зато целой страницы, у нас появился четкий и толковый кирпичик, из которого можно строить все остальное.

Мораль: ищи кирпичик, сделай на его основе несколько кирпичиков, построй из них дом и подари мне биткоин.
источник
2017 November 29
UX Boost
А вот как выгладел наш кирпичик (в двух вариантах). Прототип, не дизайн.
источник
2017 December 02
UX Boost
Что отличает выдающегося проектировщика/дизайнера/юиксера от просто хорошего? Умение думать (в частности рассуждать), ставить конкретные цели, и эти ваши софт скиллы.

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

Стратегия разумная, но есть нюансы. (кто бы сомневался)

Возьмем то же целеполагание. Если ты еще в начале карьеры научишься ОЧЕНЬ ЧЕТКО И КОНКРЕТНО описывать то, чего хочешь (например, описывать желаемую специализацию) — дальше развитие пойдет СИЛЬНО быстрее. Я не один раз наблюдал такой рывок у тех ребят, которых менторил.

Нюанс второй. Хард скиллы быстро устаревают, а софт скиллы вечны.

Мораль:  учись думать, учись учиться, учись коммуницировать, учись целеполаганию. Качай вечные навыки.
источник
2017 December 03
UX Boost
Хорошая выжимка по формам. Я часто встречал у студентов ошибки, которые здесь упомянуты. Но, не стоит воспринимать как Библию, у каждого правила есть исключения.
источник
UX Boost
Как улучшить любую веб-форму

В журнале Телеграф.дизайн вышел перевод статьи «16 дизайн-правил в дизайне форм» Дмитрия Коваленко из Readdle. Он проанализировал проблемы веб-форм и рассказал как их улучшить:

http://telegraf.design/16-dizajn-printsipov-kotorye-uprostyat-zapolnenie-lyuboj-formy/

Оригинал:
https://medium.com/@justd/the-18-must-do-principles-in-the-form-design-fe89d0127c92

Я выделил 10 лучших советов и добавил примеров от себя:

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

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

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

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

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

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

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

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

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

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

Бонус не из статьи: Сохраняй введённые данные
Данные пользователя бесценны. Если после нажатия кнопки «Отправить» пользователь видит ошибку 404, о красивом дизайне формы он уже не вспомнит и в бешенстве закроет страницу. Современный фронтенд позволяет проверять, произойдёт ли успешная отправка. Если нет интернета или есть ошибки, сайт должен выводить предупреждение до того, как случилась катастрофа.

#UX  #дизайн_форм  #высушено
источник
2017 December 10
UX Boost
источник
UX Boost
На #it_subbotnik в EPAM (где я работаю), играюсь с VR. Пройдут годы, VR-интерфейсы будут везде. Интересно, как это повлияет на UX и на нашу работу?
источник
2017 December 26
UX Boost
В нашей работе критически важно убирать лишнее.

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

1. Simple and stupid
http://telegra.ph/Simple-and-stupid-12-25
источник
2018 January 01
UX Boost
С новым годом, ребят!:)
источник
2018 January 24
UX Boost
Как докопаться до сути проблемы в интервью с пользователем?

Итак, вы захотели провести интервью с потребителями. “Хочу собрать инсайты и услышать потребности клиентов” — типичная мотивация в голове неопытного продакта. Эта цель слишком расплывчата. Она ведет к расплывчатым результатам. С таким подходом из интервью мы узнаем только очевидные вещи.

Чтобы получить инсайты из интервью, мы должны “протаранить” стену очевидных ответов пользователей.

В 1963 зоолог Нико Тинберген получил нобелевку за изучение поведения животных. Он предложил рассматривать поведение с четырех сторон:
1) для чего оно нужно?
2) как оно работает?
3) как оно было выработано?
4) как оно эволюционировало?

Давайте используем это на людях…
Пример: почему мы останавливаемся на красный свет светофора?

Функция: защищаемся от травм и проблем с ГИБДД
Как работает: мозг распознает красный свет, сигнал передается в нервную систему и останавливает шаг
Онтогенез: этому учат в школе и так поступают родственники/друзья/по ТВ
Филогенез: с 1868 года красный свет используется в светофорах

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

Алгоритм разговора:
1) задаем наводящий вопрос юзеру
2) слушаем ответ
3) копаем вглубь вопросами Нико Тинбергена
4) записываем ценную информацию
5) задаем следующий наводящий вопрос

Почитать подробнее и посмотреть примеры вопросов для продуктового исследования можно в статье “Going Beyond the Obvious”.
источник
UX Boost
Хороший текст, пусть будет под рукой :)
источник
2018 January 30
UX Boost
📈🤑📱
Crpt Bank iOS UI Kit
#appdesign #sketch #uikit #figma #iOS

👁 preview:
https://goo.gl/RNY9fU

⬇️ download psd or figma file:
https://t.me/psdmockups/542
источник
UX Boost
Рекомендую ознакомиться с каналом. Выкладывают довольно много UI-китов и прочих файлов, на которых вы можете посмотреть организацию (вложенность символов и пр)
источник
2018 February 19
UX Boost
Полезно!
источник
UX Boost
#GIF  Как красить иконки через маску, задавая цвет в оверрайде
источник
2018 March 14
UX Boost
Хорошая статья о колористике. МОжет помочь, когда вы будете выбирать цвета для вашего дизайна http://deadsign.ru/design/color-glossary-for-designers-terms-and-definitions/
источник
2018 March 27
UX Boost
Недавно моя коллега, Лена Полякова, провела занятие про Value Proposition Сanvas. Я присутствовал (как организатор) и написал статью с советами по часто встречающимся проблемам.
источник
2018 March 28
UX Boost
Ребята, думаю, что вам дальше написать. Помогите :)

Какие вопросы перед вами стоят? Что вам хочется узнать о UX? Чему научиться?

Самые смелые — пишите вопросы в комментариях или мне в личку, остальных просьба проголосовать :)

1️⃣  Scenarios, workflows, personas e t.c. Как делать эти артефакты,  практические нюансы, примеры и пр.

2️⃣  Как собирать данные для артефактов. Что делать, чтобы не плодить булшит персон например :)

3️⃣  Прототипирование. Группировка и композиция, акценты, UI-elements, типографика и пр.

4️⃣  Валидация ваших UX-решений. Тестирование, статистика, и пр.
источник
2018 March 29
UX Boost
Ну что, пожелания более-менее понятны. Хочется и UX-research, и проектирования, и валидаций. Но проектирования немного больше.

Соответственно, я постараюсь вести два более-менее параллельных потока контента.

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

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

На следующей неделе будут первые посты.
источник
2018 April 09
UX Boost
Цикл работ в UX. Какие есть этапы, что делать/чему стремиться на каждом из них. Немного примеров того, как это бывает в жизни. Ничего нового для опытных UX-дизайнеров, но вполне ок тем, кто помладше.
источник