Product Designer · Middle

5 лет в дизайне, два года в продукте

Мобильный вебВеб-приложения
Решения сверяю с рынком117 российских приложений, 7 360 сценариев и 36 880 экранов разложены по шагам и лежат под рукой.
Лента для ассистента Для ассистента

Один адрес со всем: анкета, опыт, навыки, кейсы, договорённости. Скопируйте и вставьте в ChatGPT или Claude, ставить ничего не нужно.

prokhor.me/llms.txt
Знак ПрохораПрохор
РезюмеCV Telegram

Спросите что угодно о Прохоре

Отвечает модель по материалам сайта. Чего нет в кейсах, того она не знает.

Отвечает модель и может ошибаться. Проверяйте важное у самого Прохора.

Кейс, WB / Ozon

Карточки товара, которые читаются за секунду скролла

( А )

Два продуктовых сета: бальзам Skinis «Арктический блонд» (9 слайдов) и тушь Relouis Touché (7 слайдов + 4 варианта обложки для A/B). Реальные работы, не концепт.

( Б )

WB / Ozon · инфографика для 2 брендов

( В )

Marketplace Design, Инфографика, Retouch
2025
Клиентская работа

Карточки товара, которые читаются за секунду скролла
рис. 1, WB / Ozon · инфографика для 2 брендов

Результаты

16
финальных слайдов на 2 продукта
4
варианта обложки Relouis под A/B
150px
ширина превью, при которой заголовки читаются
2
бренд-палитры без смешивания

Референсы

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

Крутите мышью

Проблема бизнеса

Что было сломано.

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

Гипотезы

Что я предположил.

  • H1Одно сообщение на слайд: заголовок из 1-3 слов, читаемый в миниатюре, продаёт лучше чем экран текста.
  • H2Слайд «кому подходит» с сегментами аудитории снижает возвраты: покупатель сам себя квалифицирует до покупки.
  • H3Для обложки нужно несколько вариантов под A/B: угадать заранее выигрышную композицию нельзя.

Ограничения

С чем работал.

  • ·Формат маркетплейса: 3:4, безопасные зоны под бейджи WB и Ozon, текст не ближе 5% к краю.
  • ·Бренд-палитры фиксированы: сине-фиолетовая у Skinis, красно-розовая у Relouis.
  • ·Фотосессии нет: продукт отснят отдельно, окружение и модели собраны из стоков и генераций с ретушью.

Дизайн-решения

Как я это сделал.

  1. 01

    Структура сета: hero с крупным оффером → УТП → аромат или формула → «кому подходит» → способ применения → линейка → финальный кадр с CTA.

  2. 02

    Типографика по сетке: заголовок читается при ширине превью 150px, проверял скриншотами реальной выдачи.

  3. 03

    Skinis: холодная синяя гамма усиливает сообщение «анти-желтизна», продукт всегда крупнее 40% кадра.

  4. 04

    Relouis: 4 варианта обложки с разным балансом текст/продукт для A/B-теста.

  5. 05

    Ретушь и композитинг: жидкость, капли, макро-текстуры собраны послойно в Photoshop.

Пользовательский сценарий

Линейный flow.

  1. 01
    Покупатель скроллит выдачу
    миниатюра 150px
  2. 02
    Обложка: продукт + оффер в 2 слова
    клик
  3. 03
    Слайды 2-4: УТП, формула, аромат
    по одному сообщению
  4. 04
    «Кому подходит»
    самоквалификация
  5. 05
    Финал: линейка + CTA
    в корзину

Что не получилось сразу

Пришлось переделывать.

  • Первые обложки Relouis были перегружены: 4 УТП на hero-слайде. В миниатюре текст сливался в шум. Сократил до одного сообщения «термоформула», остальное увёл на слайды 2-5.

Кадры

Ключевые экраны.

рис. 2, Skinis · обложка
рис. 3, Skinis · оффер
рис. 4, Skinis · состав
рис. 5, Skinis · аромат
рис. 6, Skinis · применение
рис. 7, Skinis · эффект
рис. 8, Skinis · кому подходит
рис. 9, Skinis · линейка
рис. 10, Skinis · финал
рис. 11, Relouis · обложка A
рис. 12, Relouis · обложка B
рис. 13, Relouis · обложка C
рис. 14, Relouis · обложка D
рис. 15, Relouis · УТП
рис. 16, Relouis · объём
рис. 17, Relouis · щёточка
рис. 18, Relouis · формула
рис. 19, Relouis · стойкость
рис. 20, Relouis · финал

Результат

Итог

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

Следующий кейс

Сайт-портфолио, который сам подтягивает правки из Figma

prokhor.me · разработка и инфраструктура

2026