Workspace Digital Awards — приём заявок открыт! Успейте номинироваться по самой низкой цене. Повышение цен с 1 октября.
Дизайн

UX/UI vs Product Design: почему бизнесу нужен новый подход?

92 
 

В разговоре о дизайне легко дойти до большой красной кнопки. С размером и цветом всё понятно. Сложнее договориться, чего от неё ждут: чтобы пользователь быстрее нашёл оплату или чтобы магазин получил больше заказов. Во втором случае придётся проверить ещё и цену, доставку, наличие товара. У кнопки и так довольно насыщенная жизнь.

UX/UI и Product Design пересекаются. Оба направления связаны:

- с потребностями пользователей;
- удобством сервиса;
- результатами

Разница проявляется в том, какие решения принимает дизайнер, какие данные ему доступны и что команда делает после запуска.

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

Разберём эти форматы на примере интернет-магазина.

Что стоит за названием роли

UI отвечает за визуальную часть интерфейса:
- расположение элементов
- шрифты
- кнопки и их состояния.

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

Nielsen Norman Group проанализировала ответы 372 специалистов по UX и управлению продуктом. Участники по-разному распределяли ответственность за исследование задачи и первые этапы дизайна. Это исследование посвящено взаимодействию UX и продуктовых менеджеров; оно показывает, почему обязанности стоит согласовывать внутри конкретной команды. Должность специалиста сама по себе не ограничивает его одним из форматов работы.

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


Два брифа на одну корзину

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

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

Сначала команда проверяет аналитику и проходит путь покупателя на разных устройствах. Затем выбирает, какое изменение тестировать. (Красной кнопке пока можно отдохнуть)

Гипотезы здесь ещё нужно расставить по приоритетам. Дизайнер вместе с продакт-менеджером и разработчиками сопоставляет ожидаемый эффект, трудозатраты и сроки проверки. В примере с корзиной подтверждённый сбой прокрутки на Android потребует исправления, а идею новой компоновки сначала можно проверить на прототипе. Так команда выбирает, что делать сейчас, что отправить на тест и что пока отложить.

Baymard Institute включил в исследование оформления заказов за 2025 год более 41 000 оценок качества интерфейсов. Среди изученных крупных сайтов США и Европы 64% десктопных и 63% мобильных версий получили оценку UX «посредственно» или ниже. Baymard также оценивает потенциал роста конверсии среднего крупного интернет-магазина за счёт улучшения оформления заказа — до 35%. Для отдельного проекта эту цифру нельзя считать прогнозом. Она даёт основание проверить, на каких шагах магазин теряет покупателей.

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

В кейсе СберМаркета, опубликованном продуктовым дизайнером в 2023 году, команда описала эксперимент 2021 года. Чтобы сократить оформление заказа, детализацию цены спрятали под значок информации, а поле промокода заменили текстовой кнопкой. Двухнедельный A/B-тест показал ухудшение показателей. Последующее исследование выявило, что пользователям важно видеть состав цены, а ввод промокода они перестали находить. Команда вернула оба элемента, сохранив удачное изменение — выбор доставки в виде карусели. Вместо полного отказа от нового дизайна собрали следующую версию из проверенных решений.

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

Как организовать продуктовую работу с вендором

Вендор участвует в развитии продукта вместе с командой клиента. Работа объединяет discovery — исследование задачи и проверку предположений — и delivery: реализацию, тестирование и выпуск решения. Этот цикл повторяется по мере развития сервиса; сотрудничество может продолжаться несколько итераций, кварталов или лет. После релиза команда возвращается к данным и выбирает следующие изменения. Поэтому участие вендора и доступ к результатам стоит согласовать ещё до начала работы.

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

  • Стороны определяют доступ к аналитике и пользователям вместе с перечнем работ.

  • Для каждой гипотезы команда фиксирует исходную метрику, критерий успеха и показатели, которые нельзя ухудшить.

  • В план входят наблюдение после релиза, разбор результатов и следующая итерация.
    Клиент принимает финальное решение, а вендор обосновывает рекомендации данными и предлагает варианты.

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

Зачем нужен PRD до отрисовки экранов

После первых исследований команда собирает рабочую версию PRD — Product Requirements Document, документа с требованиями к продукту или отдельной функции. В нём фиксируют, для кого создаётся решение, какую задачу оно должно решить и по каким признакам команда оценит результат. Это помогает сохранить выводы discovery, когда обсуждение переходит к конкретным экранам.

Для той же корзины содержание PRD можно показать на условном примере. Допустим, проверка выявила, что покупатели узнают полную стоимость заказа только перед оплатой. Тогда команда фиксирует следующее:

  • Пользователь должен видеть стоимость товаров и доставки до перехода к оплате.

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

  • В этой итерации меняется показ стоимости в корзине; тарифы доставки и платёжный провайдер остаются прежними.

  • До запуска команда согласует способ проверки, целевую долю оплаченных заказов и показатели, которые нельзя ухудшить, например число отмен.

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

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

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

Сколько исследования нужно задаче

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

*Схема показывает ориентир, но не обязательный набор методов

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

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

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

Как оценить результат дизайна


Разместите
тендер бесплатно

Наша система сама подберет вам исполнителей на услуги, связанные с разработкой сайта или приложения, поисковой оптимизацией, контекстной рекламой, маркетингом, SMM и PR.

Заполнить заявку 13744 тендера
проведено за восемь лет работы нашего сайта.


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

Удобнее - не всегда значит «больше продаж»


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

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

Как распределить ответственность за результат

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

Команда ВкусВилла в разборе 2025 года описала тест нового отображения товарных категорий. За 14 дней в нём участвовал 139 451 пользователь. По данным команды, число добавлений в корзину из товарных тизеров выросло на 10%, но конверсия перехода в подкатегории снизилась на 40%. Несмотря на рост первого показателя, команда сохранила прежний вариант списка подкатегорий.

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

Конверсия и осознанный выбор пользователя

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

В обзоре британского Competition and Markets Authority, ведомства по конкуренции и рынкам, описан эксперимент: агрессивная комбинация тёмных паттернов повысила принятие предложения с 11,3 до 41,9%. Тёмными паттернами называют приёмы интерфейса, которые запутывают человека или подталкивают к невыгодному для него действию. Федеральная торговая комиссия США относит к ним, в частности, скрытые платежи и затруднённую отмену подписки.

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

Когда нужен редизайн

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

  • Если люди доходят до оформления заказа, но ошибаются при заполнении формы, команда проверяет поля, подсказки и сообщения об ошибках.

  • Если пользователи понимают предложение, пробуют продукт и не возвращаются, команда исследует ценность сервиса, качество и ожидания.

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

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

Как согласовать ожидаемый эффект

Прогноз «редизайн поднимет продажи на 20%» требует расчёта и условий проверки. Пока идёт проект, меняются трафик, цены, ассортимент и работа сервиса. Чтобы выделить эффект дизайна, команда планирует измерение заранее. Например, A/B-тест сравнивает поведение сопоставимых групп пользователей в двух версиях интерфейса. Для достоверного вывода нужны достаточная выборка и подходящие метрики.

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

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

Что меняет ИИ в работе дизайнера

Быстрая генерация сокращает путь от идеи до варианта для обсуждения. Дизайнеру по-прежнему нужно выбрать задачу, учесть ограничения и проверить, подходит ли решение пользователям. У кнопки теперь может быть двадцать вариантов до обеда. Какой из них помогает завершить покупку, команда выясняет на проверке.

ИИ ускоряет подготовку текстов, графики и прототипов. В исследовании Figma State of the Designer 2026, которое Figma провела вместе с NewtonX, участвовали 906 цифровых дизайнеров. 91% сообщили, что ИИ помогает улучшать дизайн, 89% — работать быстрее, 80% — лучше взаимодействовать с коллегами. Это оценки самих участников опроса; они не измеряют рост качества или скорости каждого проекта.

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

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

Вопросы для тендера

Для проработки согласованного сценария нужен UX/UI-дизайнер с подходящим опытом. Если причину снижения показателей ещё предстоит найти, в работу входят исследования и аналитика. Регулярное развитие сервиса после запуска требует команды, которая проверяет гипотезы и участвует в следующих релизах. Состав команды зависит от того, какие из этих задач входят в проект.

О реальном содержании роли больше говорят ответы на конкретные вопросы:

  • В каких решениях участвует дизайнер и кто принимает финальное решение?

  • Как команда получает доступ к аналитике, пользователям, поддержке и разработчикам?

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

  • Что входит в работу после релиза и кто планирует следующую итерацию?

  • По каким критериям команда завершает исследование или возвращает предыдущую версию решения?

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

Как выбрать формат работы

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

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

Лучшее
Выскажите мнение
Авторизуйтесь, чтобы добавить свой комментарий.




107

Лучшие статьи

Поделиться: 0 0 0
Лайки за кейсы:  134 Подписчики:  0

Оцените статью
Спасибо за оценку