В карточке товара цена товара не выводится рядом с выбором свойств, влияющих на неё

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

Возникает разрыв в сценарии. Человек делает действие и не получает мгновенной и локальной обратной связи. Он прокручивает страницу, ищет цену взглядом, возвращается к опциям, повторяет попытки. Внимание рассеивается, растёт когнитивная нагрузка, копится недоверие к информации на странице.

Сравнение вариантов превращается в вычисления. Чтобы понять разницу между конфигурациями, нужно удерживать в памяти цифры, переключаться между блоками и делать подсчёты. Ошибки неизбежны, ощущение «меня вводят в заблуждение» усиливается, особенно если цена меняется вне зоны видимости.

На мобильных экранах дистанция между опциями и ценой увеличивается, часть интерфейса уходит за пределы первого экрана. В переполненных карточках с промо-блоками изменение цены визуально теряется. Симптомы: длительное время выбора, отмена действий, вопросы в чат «сколько стоит с этой опцией?», возврат в список товаров.

Когда проблема критична, а когда нет

Критична:

• Конфигурируемые товары с заметной разницей в цене по опциям: электроника (память, чип), мебель (материалы, механизмы), авто- и мототовары (комплектации), билеты и туры (классы, даты), SaaS‑тарифы с платными аддонами.
• Высокий средний чек и рациональный выбор: B2B, техники премиум, долгие циклы принятия решения.
• Преобладание мобильного трафика, длинные карточки, «плавающая» цена вне экрана.
• Маркетплейсы и мультипродавцы, где важна прозрачность и быстрое сравнение.
• Сегменты, где закон и политика требуют явного показа итоговой стоимости.

Не критична:

• Товары с фиксированной ценой, где свойства не влияют на стоимость или разница минимальна и явно несущественна.
• Одна доступная конфигурация без вариантов.
• Импульсные покупки с низкой ценой, где выбор свойств прост и редок.
• Карточки с компактной вёрсткой, где цена уже закреплена и всегда видна рядом с опциями.

Открытый вопрос для проверки

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

Возможное решение проблемы

• Разместить цену в непосредственной близости от блока с опциями. Цена и опции должны быть в одном визуальном блоке и в одном экране на мобильных.
• Обновлять цену моментально при выборе свойства. Добавить краткую анимацию изменения, чтобы пользователь заметил обновление.
• Показывать вклад каждой опции: +1 990 ₽ за цвет, −500 ₽ за упрощённую комплектацию. Рядом с названием свойства — дельта к базе.
• Отображать «Итого» за текущую конфигурацию крупно и читаемо. Рядом — информация о наличии и сроке доставки этой комплектации.
• На мобильных закрепить «плавающую» панель с ценой и кнопкой действия, которая появляется при взаимодействии с опциями.
• Обработать пограничные случаи: недоступные комбинации, разные цены у продавцов, скидки по промокодам, налоги и доставка — что включено в «Итого», что будет добавлено позже.
• Обеспечить доступность: озвучивание изменения цены для screen reader, понятные подписи и контраст.
• Минимизировать задержки: обновление на клиенте, если возможно; если сервер, — оптимизировать ответы и кэш.

Примеры гипотез для роста конверсии

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