UX-дизайн начинается до макета: как думать как дизайнер

UX-дизайн начинается до макета: как думать как дизайнер

UX-дизайнер не «рисует красиво», а разбирается в людях, их привычках и страхах. Истории и советы из практики

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

1. UX начинается с вопросов

Прежде чем садиться за Figma, нужно понять, для кого мы это делаем и зачем.

  • Кто пользователи?
  • Какие у них цели и проблемы?
  • Как они сейчас решают свои задачи?

Пример: на сайте одного крупного автосалона мы заметили, что пользователи терялись при поиске машины по параметрам. Фильтры были логично расположены, но непонятно, какие значения выбирать. После интервью выяснилось: пользователи не понимали, что «объём двигателя» и «мощность» — разные вещи.

💡 Совет: перед макетом спрашивайте себя — что именно пользователь хочет найти и какие термины он использует в реальной жизни, даже 3–5 коротких интервью дают больше инсайтов, чем долгие обсуждения «а как бы мы сами хотели».

2. Сценарии и CJM — ваш навигатор

CJM (Customer Journey Map) и сценарии — это как карта перед походом: без неё можно заблудиться. Они помогают понять, какие шаги пользователь проходит, где застревает и где вы можете облегчить путь.

Пример сценария заказа такси.

1. Открывает приложение → выбирает пункт назначения

2. Ждёт подтверждения → оплачивает

3. Получает поездку

Без CJM можно забыть про маленькие, но важные моменты, вроде уведомлений о времени подачи машины.

Пример сценария покупки авто:

1. Пользователь ищет машину → фильтрует по марке, цене, году выпуска

2. Смотрит карточку машины → проверяет комплектацию, фото, отзывы

3. Решает → связывается с продавцом или записывается на тест-драйв

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

3. Дизайнер — это решатель проблем, а не рисователь

UX-дизайн — это не про красивые кнопки. Это про решение реальных проблем людей. Макеты важны, но важнее понимание, почему вы делаете именно такую кнопку, именно в этом месте, с этим текстом.

Пример хорошего UX:

Кнопка «Отправить запрос» на сайте автосалона. Без контекста пользователи не понимают, что именно произойдет после нажатия — звонок менеджера? Сообщение на email?

Пример хорошего UX:

та же кнопка переименована в «Записаться на тест-драйв». Пользователи сразу понимают, что произойдет после клика, и это снижает тревожность.

💡 Совет: перед каждым макетом спросите себя: «Как это поможет пользователю?» Если ответ «потому что красиво» — нужно переосмыслить.

4. Тестируйте и учитесь

UX — это цикл: исследование → прототип → тест → улучшение. И да, тестировать нужно не один раз. Ваше «идеальное решение» почти наверняка не будет идеальным для пользователей.

Пример:

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

💡 Совет: тесты с живыми пользователями выявляют ошибки, которых вы сами не заметите.

5. Немного юмора на десерт

Не бойтесь, что кто-то подумает: «О, дизайнер опять с CJM пришёл». На самом деле, если вы всё делаете правильно, никто не заметит, но все почувствуют: пользоваться продуктом стало проще.

Личный опыт: иногда на выходных я устраиваю «UX-день» для себя: прохожу приложения, тестирую уведомления, делаю мини-CJM для себя самой. Выясняю, где «застревают» мои нервы, и думаю: а что если пользователи тоже такие же? Чудеса инсайтов происходят без Figma.

1
Начать дискуссию