Открыть Figma, создать первый экран и начать двигать блоки кажется самым очевидным способом начать работу над дизайном. Заголовок вроде бы должен быть здесь. Кнопку можно сделать крупнее. Карточки поставить в три колонки. А может, добавить немного воздуха?... Через некоторое время уже появляется вполне симпатичный экран, и может показаться, что работа идёт. Но проблема в том, что красивый макет еще не означает хороший дизайн.

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

Сначала нужно понять задачу

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

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

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

Определить, для кого создаётся продукт

Следующий вопрос — для кого мы создаем продукт?

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

• Что он хочет сделать?
• Что для него важно?
• Что вызывает трудности?
• Какой у него уровень знаний?
• В каких ситуациях он использует продукт и т.д.

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

В первом случае интерфейс должен давать больше инструментов для самостоятельного выбора, во втором помогать быстро сориентироваться и предложить готовые варианты.

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

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

Посмотреть, что уже есть на рынке

После изучения аудитории полезно изучить конкурентов.

Нужно разобраться:

• какие решения уже существуют;
• какие сценарии используют конкуренты;
• какие интерфейсные паттерны привычны пользователям;
• что работает хорошо;
• какие проблемы встречаются у других продуктов;
• за счёт чего наш продукт может отличаться.

Конкурентный анализ помогает увидеть не только визуальные решения, но и повторяющиеся пользовательские сценарии. Это позволяет принимать решения осознанно.

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

Выстроить структуру

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

На этом этапе дизайнер продумывает пользовательские сценарии и User Flow. Затем определяется структура продукта: какие экраны и разделы нужны, как они связаны между собой, и где пользователь сможет найти нужную информацию. Ниже фрагмент User Flow ⬇️

*User flow — это путь пользователя внутри продукта. Какие шаги он проходит для достижения своей цели. Например: открыть приложение → найти товар → открыть карточку → добавить в корзину → оформить заказ.




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



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

Figma – инструмент, а не источник решений

Figma – один из главных инструментов современного дизайнера, но программа сама по себе не отвечает на вопрос «Что именно нужно проектировать?». Программа помогает визуализировать решения, создавать прототипы, тестировать идеи и собирать финальный интерфейс.

Но если открыть её слишком рано, можно легко увлечься: открыли Figma → создали фрейм → нарисовали экран → потом уже начали придумывать, зачем он нужен.

Лучше двигаться в обратном направлении: задача → исследование → пользователь → сценарии → структура → прототип → визуальный дизайн.

Тогда Figma становится местом, где решения воплощаются, а не местом, где эти решения случайно появляются.

Нужно ли всегда проводить исследование?

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

Что мы делаем? Для кого? Зачем? Какую проблему решаем? Какие решения уже существуют? Что пользователь должен сделать на странице?

Ответы могут занять всего несколько минут, но они способны сэкономить часы бесконечного перетаскивания блоков.

Хороший дизайн – это не только красивые экраны

Визуальная часть действительно важна:

• Хорошая типографика помогает выстроить иерархию;
• Цвет помогает ориентироваться;
• Сетка создаёт порядок;
• Визуальный стиль формирует характер и эмоциональное восприятие продукта.

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

Работа дизайнера – это не просто создание красивых экранов. Дизайнер исследует, задаёт вопросы, анализирует информацию, формулирует гипотезы, ищет проблемы и принимает решения. Поэтому иногда самое профессиональное решение дизайнера не открывать Figma сразу. Сначала разобраться в задаче, понять пользователя, изучить рынок, выстроить структуру и только потом переходить к визуалу.

Заключение

Хороший дизайн начинается задолго до первого фрейма. Он начинается с вопросов:

• Кто пользователь?
• Чего он хочет?
• Какую проблему мы решаем?
• Зачем вообще существует этот интерфейс?

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

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

Ведь хороший дизайн начинается не с первого экрана. Он начинается с понимания того, зачем этот экран вообще нужен.

Автор статьи: Елизавета Мордвинова, выпускница 42-го потока курса «UX/UI-дизайнер».