Десктопное веб-приложение для создания продающих email-писем с помощью нейросетей. Оно помогает менеджерам по продажам быстро готовить персонализированные письма, подбирать правильный тон общения и повышать эффективность коммуникаций. Это происходит за счет интеграции сервиса с LinkedIn или веб-сайтом.
Роль
Продуктовый дизайнер
Сроки
3 месяца
Команда
Продуктовый дизайнер, заказчик
Заказчик хотел получить инструмент, который упростит процесс, с современным и понятным интерфейсом по гайдлайнам Material UI
Анализ конкурентов
Созвонились с заказчиком, обсудили мои и его предложения, побрейнштормили. Обсудили план работ и я пошел создавать структуру будущего сервиса. Упор делал на простоту и степ бай степ подход, чтобы избежать «потреянности» пользователей.
Плюсы
Чистый, современный визуал
Простая таблица с отправленными письмами, открытыми письмами
AI создает подробное письмо на основе шаблона или короткого описания
Интеграция с LinkedIn
Персонализация сообщений или групповая рассылка
Минусы
Перегруженный UX, новичок сращу не разберется
Нет онбординга для новых пользователей
Не все платформы интегрирутся с соц. сетями или только с одной
Нет продвинутой персонализации: компания, новости, профили получателя
Не везде есть прямой доступ к продукту
Процесс работы
После долгого созвона структура и концепция были согласованы заказчиком. Я приступил к прототипированию MVP для того, чтобы протестировать на конечных пользователях перед продакшином.
План
Обсуждение проекта, цели, задачи, сроки, ожидания от продукта
Анализ конкурентов — сбор плохих и хороших решений для интеграции в наш продукт
Составление структуры и разработка первых экранов
Проработка остального функуционала, подготовка к тестированию
Тестирование MVP на реальных пользователях
Заверение последних штрихов и сдача проекта разработчику
Сопровождение верстки, чтобы полностью был учтен макет
Регистрация и небольшой онбординг вначале (короткое видео)
Процесс написания писсьма
Настройки сервиса (шаблон сообщений, тарифы, информация и т.д.)
Результат
Провел тестирование MVP на реальных пользователях, устранил незначительные замечания, доработал макеты до передачи в разработку и отдал проект заказчику.
Итог
Простой интерфейс
Онборлинг и пошаговая регистрация
Свежий и современный визуал
Пользователь может создать готовое продающее письмо за 3-5 минут, вместо 20-30
Новички осваивают интерфейс за 10-15 минут без обучения
Заказчик получил продукт, который можно легко масштабировать и дополнять новым фичам благодаря компонентному подходу MUI
На тестах прототипа пользователи отметили дизайн «удобным, понятным и визуально привлекательным»
Страница кейса
август 2024
B2C
редизайн продукта
Zoom App
Всеми нами знакомое со времен пандемии мобильное приложение для беспроводного взаимодействия и организации видеоконференций, вебинаров, созвонов. Платформа позволяет общаться посредством видео или аудиосвязи.
Роль
Продуктовый дизайнер
Сроки
1 месяц
Команда
Продуктовый дизайнер
Сделать приложение более удобным и современным, сохранив айдентику. Улучшить сценарии быстрого переключения к созвону, управления встречами и навигации внутри приложения
Анализ продукта
Перед редизайном я провёл сравнительный анализ популярных сервисов видеоконференций (Google Meet, Slack, MTeams и понял, что у них перегружен функционал. Провел аудит текущего интерфейса. Выявил основные проблемы, на которые буду фокусироваться.
Проблемы и решения
Составил Путь Пользователя и подтвердил свои гипотезы: сложно и много сценариев для создания конференции, неудобно звать на созвоны других, пользователь теряется, не проработы Контакты, в созвоне функции разбросаны.
Проблема
Создание конференции. Я создал story flow пользователя и выявил, что есть 6 сценариев создания конференции. Когда достаточно всего двух. Отсуствие простоты мешает новым пользователям быстро ориентироваться в приложении
Решение
Сократить выбор пользователя. Самые популярные и простые сценарии: через вкладку Контакты и кнопку «Организовать». Остальные поместил подальше или вовсе избавился. Получилось 2 сценария вместо 6
Проблема
Приглашение в конференцию. Приходится кидать каждому человеку ссылку на конференцию или её ID. Бывало некоторым приходилось копировать ID, так как ссылка не всегда работала. Встречал ситуации, когда кидали скриншот идентификатора
Решение
Систематизация контактов. Упростил способ приглашения контактов внутри приложения: через кнопку Плюса в карточке созвона или внутри контакта на кнопку «Созвон»
Результат
Редизайн сделал приложение более современным, интуитивным и удобным для ежедневного использования.
Улучшения
Сократил время создания конференции на 30%
Добавил возможность создавать «Группы», для быстрого создания созвона с нужными пользователями
Пользователи стали меньше ошибаться и «теряться» в приложении
Почти все респонденты отметили интерфейс «чище, понятнее и приятнее»
Уменьшил когнитивную нагрузку во время звонка
Упростил навигацию по приложению
Страница кейса
сентябрь 2024
B2C
дизайн продукта
MyCar App
Приложение для владельцев современных автомобилей и мотоциклов. Оно позволяет управлять транспортом с телефона: запускать двигатель, открывать/закрывать двери, проверять уровень топлива, температуру в салоне, просматривать характеристики, даже ставить задачи.
Роль
Продуктовый дизайнер
Сроки
1 месяц
Команда
Продуктовый дизайнер
Сделать простой и понятный интерфейс в стиле «технологичный минимализм», где 80% действий будут выполняться в 1-2 клика
Анализ конкурентов
Провел ревью сценариев в Tesla, BMW, Mercedes, Volvo. Почти все ставят во главу «статус ТС + быстрые действия», но перегружают главный экран виджетами и терминологией. UX хорош, но путь до базовых действий ≥ 3 кликов и много «переходов по карточкам».
Плюсы
Основные функции (замки, климат) доступны сразу, интерфейс современный (Tesla)
Доступ к расширенной информации об автомобиле: сервисные данные, давление шин, маршруты (BMW)
Информация о машине подана ясно и структурировано, показатели легко воспринимать (Volvo)
Плюсы
Главный экран перегружен деталями, часть действий уходит в меню, что замедляет UX (Tesla)
Простые сценарии занимают несколько шагов, а второстепенные кнопки оформлены так, что их легко не заметить (BMW)
Быстрые действия разнесены по разным экранам, приходиться скроллить и переключаться
Вывод
Сосредоточиться на «быстрых действий по месту», упростить термины, объединить статусы в один экран без вложенностей
Процесс работы
Составил Путь Пользователя и подтвердил свои гипотезы: сложно и много сценариев для создания конференции, неудобно звать на созвоны других, пользователь теряется, не проработы Контакты, в созвоне функции разбросаны.
Путь юзера
Собрал сценарии владельцев авто и мото, выделил топовые задачи — открыть/закрыть, запустить двигатель, климат, где находится машина, трекер задач на день
Прототип
Вайфреймы, интерактивный прототип, быстрые тесты на пользователях
UI-дизайн
Темная тема, минимализм, премиальная типографика, конмпоненты с вариантами состояний
Детали
Доработка, продумывание состояний
Передача
Готовые спеки, автолэяуты и токены в Figma, дизайн система
Экраны
Главный
Крупный рендер машины и быстрые действия вокруг (замки, запуск)
Климат и запуск
Управление в 1-2 клика, подтверждение через свайп для безопасности, статусы синхронизации
Замки
Большой замок с четким состоянием (закрыто/открыто), вид сверху — нативный UX
Таскер
Можно составлять планы на день, с дедлайнами, маршрутами и приоритезацией в виде чек-листа
Карта
Маршрут до машины и нужной точки
Телеметрия
Пробег, средняя скорость, данные в аккуратных карточках
Профиль
Информация о владельце, истории, монетизация приложения за спец подписок
Результат
Приложение стало простым и удобным инструментом управления. Главные сценарии выполняются мгновенно, дизайн выглядит современно и технологично.
Улучшения
Сократил путь ключевых действий (замки, запуск, климат) до 1-2 кликов
Объединил статусы в единый блок, избавившись от лишних экранов
Сделал единые компоненты и токены
Добавил оффлайн и ошибочные состояния
Сохранил состояние «премиального продукта» через темную тему и скево-элементы
Реализовал таскер с маршрутом
Страница кейса
декабрь 2023
B2B
редизайн продукта
Irimall
Маркетплейс, который доставляет заказы бесплатно по всему городу.
Роль
Продуктовый дизайнер
Сроки
2 месяца
Команда
Продуктовый дизайнер, заказчик, маркетолог
Сделать интернет-магазин более современным, удобным и простым для пользователей, чтобы процесс выбора и покупки товаров был интуитивным и быстрым
Анализ конкурентов
Провел аудит популярных маркетплейсов и сделал выводы:
Сайты имеют современный и чистый интерфейс, без лишних акцентов и цветов, продуманную фильтрацию и быстрый поиск.
Многие используют яркие карточки товаров и промо-блоки, что увеличивает конверсию.
Крупные карточки товаров, понятная корзина, хорошие рекомендации (Wildberries)
Сильная система рейтингов и отзывов, информативная карточка товара (Яндекс Маркет)
Легкий и минималистичный интерфейс (Usmall)
Минусы
Иногда перегруженные страницы, много текста (Ozon)
Избыточная визульная информация на главной (Wildberries)
Интерфейс кажется слишком формальным, не всегда дружелюбен с пользователем (Яндекс Маркет)
простота иногда ведет к недостатку информации о товаре (Usmall)
Процесс работы
Анализ
Определил боли и выстроил гипотезы по улучшению сайта. Получал обратную связь от маркетолога от бывалых пользователей
Пути юзера
Составил ключевые пользовательские истории: поиск, фильтрация, оформление, корзина
Прототип
Собрал верхнеуровневые прототипы интернет-магазина и согласовал их с заказчиком и маркетологом
Дизайн
Обновление визуального стиля: цвета, типографика, иконки, эффекты. создание дизайн системы
Тест
А/Б тестирование ключевых страниц, финальные корректировки и передача макетов в разработку
Улучшение интерфейса
Главная
Сделал более чистой и структурированной, добавил промо-блоки с актуальными акциями, чтобы увеличить выручку
Категории
Переработал фильтры, чтобы они были нативными, добавил возможность сортировки и быстрой навигации по разделам
Карточка товара
Полностью переработал карточку. Улучшил типографику, оставил самое важное (фото, описание, цена, скидка, отзывы и CTA)
Корзина
Доработал Корзину и Избранное, теперь можно выделять все
Результат
Редизайн сделал Irimall современным и визуально привлекательным, удобным и нативным, как привыкли пользователи популярных маркетов, быстрым в навигации и поиске товаров.
Итог
Снизился средний показатель отказов на 20%
Увеличилась конверсия в оформление заказа на 15%
Улучшена читаемость карточек и фильтров
Создана дизайн система для будущих улучшений сайта
Страница кейса
ноябрь 2024
B2С
дизайн продукта
Система мониторинга (NDA)
Внутренний продукт для компаний, которые управляют строительными проектами. Приложение аккумулирует данные по бюджетам, срокам, договорам, рискам и показателям. Формирует из них удобные отчеты и помогает руководителям и исполнителям принимать управленческие решения точнее и быстрее
Все данные о проектах заполняются вручную сотрудниками в PPTX или WORD и хранятся в разных документах Excel (не в одном месте). Поэтому бывают искажения (намеренные или случайные). Данные хранятся оффлайн и доступны не сразу
Создать продукт с фокусом на простоте и понятности интерфейса, где одинаково комфортно работают разные грпуппы пользователей: строители на площадке, офисные сотрудники, топ-менеджмент
Анализ конкурентов
Прежде чем приступить к реализации такого крупного проекта, я озучил, как это сделано у других. Исследовал 1C, SAP, Power BI и несколько специализированных решений для стройки.
Плюсы
Широкие возможности и гибкость
Развитая аналитика и кастомные отчеты
Интеграции с другими корпоративными системами
Минусы
Перегруженные интерфейсы, сложные для «несистемных» пользователей
Высокая стоимость внедрения и адаптации
Долгое обучение сотрудников
Процесс работы
После долгого созвона структура и концепция были согласованы заказчиком. Я приступил к прототипированию MVP для того, чтобы протестировать на конечных пользователях перед продакшином.
Ресерч
Провел интервью со строителями и офисными сотрудниками, выявил типичные сценарии: «посмотреть риски», «сформировать отчет по бюджету», «отследить сроки и нарушения»
Структура
Разделил систему на ключевые блоки: «Метрики», «Отчеты», «Риски и замечания», «Документы», «Сроки и бюджеты»
Прототип
Сделал прототипы, проверил сценарии на реальных данных. Провел А/Б-тестирование на сотрудниках
Итерации
По итогу тестирования и выявленных замечаниях — упростил таблицы, ввел быстрые фильтры, сделал дашборды и графики читаемыми
Визуал
Привел все к единой визуальной системе: фирменные цвета, аккуратная типографика, иконки, индикаторы
Экраны
Главная
Собрал ключевые метрики: бюджет, сроки, риски, замечания. Руководитель видит общую картину за пару секунд
Отчеты
Добавил графики и план-факт сравнения, экспорт в PDF для того, чтобы у пользователей была возможность просматривать офлайн
Таблицы
Ввел цветовую кодировку статусов и фильтры по критичности
Документы
Структурировал по датам и статусам, чтобы не терялась история
Результат
Дизайн сделал систему удобной для разных ролей — от инженеров и офисных работников до топ-менеджмента, Данные стали прозрачными, а создание отчетов — быстрее и понятнее.
Бизнес-польза
Более 1000 сотрудников сегодня используют мою систему для принятия решений, мониторинга
Компания экономит ~100 млн ₽ / мес и время на создание отчетов, которые раньше делались ручным способом
Сотрудники теперь могут заниматься более полезными делами
Заложил основу для развития и поддержания сервиса
Продукт может выйти на внешний рынок для продажи другим команиям
Отчеты теперь выглядят современно, дорого понятно
Отчеты хранятся онлайн, информация передается за секунды
Будет меньше ошибок и интуитивных решений
Страница кейса
февраль 2025
B2B
дизайн сервиса
Конфигуратор презентаций (NDA)
Это внутренний сервис для автоматического формирования отчетов по срокам, бюджетам и т.д. руководителей проектов. Он интегрируется с другими скервисами компании для обеспечения прозрачности и актулаьности данных и превращает их в красивую, минималистично стилизованную презентацию.
Ежемесячные презентации готовились вручную в PPTX, сотрудники тратили по 10 часов в месяц для сбора информации и оформления. Презентации могли отличаться стилем и моги быть расхождения в цифрах намеренно или случайно
Создать сервис, который автоматически формирует презентации в едином стиле с актуальными данными на основе интеграций с другими сервисами компании. Сокращает время подготовки к отчетам и обеспечивает прозрачность данных
Анализ конкурентов
Перед стартом изучил, какие вообще есть и есть ли вообще иные решения проблемы, кроме как создавать отдельный сервис.
Внутренние отчетные панели компании (Система мониторинга)
Стандартные Bl-системы (Power Bl, Qlik, Tableau)
Шаблоны PowerPoint с макросами
Плюсы
Данные в реальном времени, прозрачность
Мощные инструменты визуализации, гибкая аналитика
Простота внедрения, быстрый старт
Минусы
Формат неудобен для защиты проектов перед руководством, требуется доработка быстрой навигации
Требуют навыков работы, отчеты не в презентационном виде, платные
Отсутствие гарантии актуальности данных, риск ошибок остается
Процесс работы
Материалы
Проанализировал данные проекта и блоки отчетов. Выделил типовые разделы — «О проекте», «Сроки», «План/факт», «Бюджет», «Риски» и т.д.
Юзер-стори
Прописал путь пользователя: указать время и дату мероприятия → указать период → отметить нужные проекты → выбрать нужные разделы → сохранить шаблон → сгенерировать презентацию и т.д. Стало ясно какие шаги важны, какие вспомогательны
Прототипы
Собрал экраны: конфигуратор и презентации и продемонстрировал стейкхолдерам. Собрал фидбек
Визуал
Исправил недочеты и докрутил визуалку, собрал прототип и снова отдал группе тестировщиков.
Передал в разработку
Подготовил макеты к передаче в разработку. Сопровождал процесс разработки: сравнивал интерфейс с макетами, проверял взаимодействия, логику, отклики
Тест
Отдали сервис тест-группе (сотрудникам одного из руководителей), провели тестовую презентацию проекта. После успешного теста, выпустили в продакшн и собирали обратную связь
Экраны
Конфигурат.
Фильтрация проектов по времени, выбор: проектов, разделов отчета, настройка таймера слайдов и даты мероприятия. Возможность сохранить шаблон встречи или создать новый. Можно менять порядок проектов через drag and drop
Преза
Готовый слайд-дек с данными напрямую из первоисточников. Возможность переключать проекты через панель Админа. Можно скачать презентацию в PDF для печати или рассылки
Результат
Бизнес-польза
Экономия трудозатрат отдела — от 10 часов в месяц
Сотрудники теперь могут заниматься более полезными делами
Заложил основу для развития и поддержания сервиса
Продукт может выйти на внешний рынок для продажи другим команиям
Отчеты теперь выглядят современно, дорого понятно
Отчеты хранятся онлайн, информация передается за секунды
Будет меньше ошибок и интуитивных решений
Ошибки в данных устранены полностью
Время подготовки мероприятия сократилось в 6 часов до 15 минут
Юзер-польза
Гарантия корректных данных без ручной правки
Удобство — отчет можно собрать в пару кликов
Простота освоения интерфейсом
Возможность скачивать и использовать единый шаблон, соответствующий фирменному стилю
Продумываю логику продукта, строить CJM / US / UF, создавать дизайн систему / UIkit, проектировать и визуализировать интерфейсы
Figma • Miro • Xmind
Насмотренность
Использую Pinterest для визуальных референсов, Mobbin — для UX-паттернов, а Awwwards — для вдохновения топовыми решениями
Pinterest • Mobbin • Awwwards
Нейросети
Помогают мне с проблемой «белого листа», поиском информации и для быстрого создания / доработки иллюстраций
ChatGPT • Recraft
Графика
Работаю с векторной и растровой графикой (баннеры, логотип, наружная реклама, РСЯ). Делаю несложные 3D объекты и короткие видео
Ae • Ps • Ai
Верстка
Применяю для быстрого создания адаптивных сайтов и лендингов без глубоких знаний кода. С анимацией, работающим функционалом
Tilda • Webflow
Планирование
Дружу с Jira и Confluence для планирования задач и ведения документации и комуникации с командой. Работаю по Agile-подходу
Jira • Confluence
Эмпатия, Понимание пользователя
Начинаю с выявления проблем и потребностей людей. Умею находить баланс между интересами бизнеса и удобством пользователя
Коммуникация, Презентация
Четко доношу решения до команды и стейкхолдера, объясняя логику и ценность элемента / фичи. Могу оформить в красивую презентацию
Приоритезация, Гибкость
Быстро адаптируюсь к новым вводным, меняющимися условиями и дедлайнами. Могу работать как в одном проекте, так и быстро их менять
Развитие
Для меня важно постоянно чем-то заниматься помимо работы, чтобы не наскучило. Поэтому я участвую в марафонах, прохожу курсы. Если ты не развиваешься — ты катишься вниз
Telegram • Статьи • Марафоны • Курсы
Хобби
Люблю активные виды спорта, настольные и компьютерные игры в приятной компании, играю на гитаре, читаю художественные рассказы или саморазвивающие. Увлекаюсь инвестициями
Книги • Игры • Гитара • Инвестиции
Процесс работы над продуктом делю на шаги
Я формулирую четкую проблему пользователя и бизнес-цель. Фиксирую гипотезу решения и ценности для бизнеса. От них буду отталкиваться я и команда при создании продукта
Провожу интервью, анализирую конкурентов и описываю ключевые сценарии (JTBD), чтобы понимать примерно как будет выглядеть MVP
Формирую идею продукта и пользовательтские истории — какие шаги проходит и что получает в итоге
Создаю прототипы, тестирую их на пользователях или стейкхолдерах, дорабатываю какие-то замечания и собираю MVP
Собираю дизайн систему: токены, варианты, стили, компоненты на автолэяутах, далее собираю блоки и страницы
Дорабатываю продукт по результатам метрик, фидбека пользователей
ХОРОШЕГО ДНЯ
Пиши сюда
Я отвечаю в течение часа в будни. В выходные — по возможности. Готов обсудить твой проект :)