Моя зона ответственности: полный цикл — исследование рынка → UX-карта → UI-kit → дизайн всех экранов (Desktop / Tablet / Mobile) → спецификации и поддержка верстальщиков

1. Анализ конкурентов, брифинг с пользователями и работниками компании
2. Информационная архитектура - CJM + карта сайта
3. UX-прототип - wire-flow всех страниц (каталог, карточка, корзина, POP-UP-cart, checkout, 404)
4. UI-дизайн - дизайн-система в Figma: 60 + компонентов, автолэйаут, вариативные иконки
5. Адаптивы - отдельные брейк-пойнты 360 / 480 / 768 / 1200 px
6. Передача проекта - Были небольшие правки перед стартом верстки, связанные с технической частью функционала (Не уложились в бюджет по верстке, пришлось переделать немного изначальный дизайн)

Результат
Внутренний тест показал +34 % к среднему времени на сайте.
LuxAlto получила гибкую систему: добавить новую категорию или акцию теперь < 1 час дизайнеру и 0 часов фронту.

🛠️ «С нуля» — значит буквально всё, от брендбука и иконок до правил теней; проект стал базой для дальнейшей цифровой экосистемы LuxAlto (CRM-кабинет, партнёрский B2B-прайс, промо-лендинги).

Два визуальных сценария A/B

Цель - Снизить отток на первом шаге воронки
Проанализировал аналогичные сервисы (Kinopoisk, Okko, Netflix) и выделил 3 критичных фактора:
1) нечитаемость ошибок e-mail
2) отсутствие ценностного оффера
3) «пустая» зона ожидания рядом с формой
Решил показать выгоду сразу, упростить фидбек и заполнить визуальный вакуум контентом

Цель - Визуально вовлечь в контент-вселенную
Подготовил две композиции:
▪︎ Вариант А — «постерная» сетка карточек, на которые пользователь сможет кликнуть после регистрации.
▪︎ Вариант B — полноэкранный промо-блок с УТП «7 дней бесплатно» + графический символ clapboard.
Тестировали, какой тип тизера лучше мотивирует закончить форму: яркая коллекция фильмов (вариант А) или чёткий оффер (вариант B).

Цель - Упростить форму
— только 3 поля (имя, e-mail, пароль)
— мягкий «песочный» фон инпутов для контраста
— моментальная подсветка ошибок красным текстом и иконкой
Меньше когнитивной нагрузки → выше конверсия. Цветовая пара «ультрафиолет #6500FF / песочный» дала нужное сочетание «кибер-неон + комфорт».

Результаты A/B-теста (4 дня на кликдомейне)
Вариант B (+ чёрный promo-блок) показал +12 % к завершениям формы.
Вариант A удерживал пользователей дольше (avg time +18 с) — решили оставить его как альтернативный welcome-экран после регистрации.

Итог: Cinemania получила готовый шаблон, который легко масштабируется под акции («14 дней Premium», «-50 % студентам»). А я — чёткий кейс о том, как дизайн мелкого шага ощутимо влияет на всю платёжную воронку.

Задача:
Упаковать услуги и кейсы в современном, «digital-native» стиле
Провёл интервью с фоундерами, собрал mind-map контента
Сценарий лендинга: value → кейсы → офферы → команда → CTA

Итог:
Чёткая история, которая за 1,5 прокрутки отвечает на вопросы «чем полезны?», «почему вам?», «как связаться?»

Tilda-разработка с нуля
Zero Block’и, настроенные шаговые анимации (Scroll & Appearance)
Подключил Tilda → CRM для лидов и Telegram-нотификации
Adapt layout — 1200 / 960 / 640 px
Сайт полностью без кода, но с эффектами, загрузка < 1,7 с, редактируется самим агентством

Лид-магниты & формы
Всплывающие офферы: «Узнай цену сайта» и «Скачай SMM-гайд»
В первую неделю конверсия посетитель → заявка 4,8 % (benchmark ниши ≈ 3 %)

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

Что нужно было:
Сделать продающую страницу товара (нового или б/у автомобиля), которая: моментально показывает выгоду по акции;

1. даёт два быстрых сценария заявки — «Забронировать» и «Кредит»;
2. подталкивает к дальнейшему просмотру («Похожие спецпредложения»);
3. одинаково удобна на desktop и mobile.

UX — Вывел критичные СТА прямо под ценой, чтобы сократить путь до формы.
UI — Цветовая пара соломенный #F7D76D / графит #1F1F1F — фирменный стиль + ощущение премиальности
Функциональные модули — Галерея с зумом и мини-превью, Таблица характеристик (6 ключевых параметров), На mobile цена и «Забронировать» закреплены в первом экране, чтобы не терять CTA при скролле.
Контактная форма — Заполняется < 15 сек, данные уходят сразу в CRM салона.

Итог для бизнеса
+18 % к отправленным заявкам по сравнению со старой карточкой (данные за 2 недели A/B).
Среднее время на странице сократилось на 23 сек — пользователь быстрее принимает решение.

Грамотная расстановка акцентов (цена → CTA → аналогичные офферы) и чистая модульная сетка дают реальный прирост лидов даже без глобального редизайна всего сайта.

Что нужно было
Создать полностью новый сайт магазина: от изучения конкурентов до передачи готовых макетов разработчику.

Исследование:
Побеседовал с покупателями и дизайнерами, изучил 6 сайтов премиум-мебели
Понял, что аудитория любит «чистый» чёрно-белый стиль без лишних цветов

• Составил карту разделов и пути пользователя — от витрины до оформления заказа
• Нарисовал схему расположения блоков для мобильной и десктопной версий
• Разработал сетку 8 px, выбрал шрифты Playfair Display и Inter, создал более 120 элементов интерфейса
• Чёрный фон подчёркивает фотографии, золотой акцент — только для цены и кнопок
• Подготовил файл Figma c точными размерами, описал анимации, записал видео-инструкцию для верстальщика

Итог:
+27 % глубина просмотра по сравнению со старым сайтом.
-34 % времени менеджера на приём заказа благодаря короткой форме в корзине.
Чёткая дизайн-система — новые модели добавляются без участия дизайнера.

Лаконичный, «дорогой» интерфейс, где весь фокус на продукции и удобной покупке.

Что нужно было
За 1 экран заинтересовать сервисы по ремонту и салоны связи, объяснить выгоду бизнеса «на плёнке» и собрать заявки на консультацию.

Исследование:
Провёл мини-опрос владельцев сервис-центров, изучил конкурентов и специфику ниши.

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

Итог:
Конверсия в заявку — 6,3 % в первую неделю запуска (с отраслевого трафика).
Клиент получил готовый одностраничник, который чётко отвечает на три вопроса: что за устройство? сколько заработаю? как заказать?

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

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

Исследование:
Изучил 8 сайтов конкурентов, разобрал типовые блоки «недвижимого» лендинга.

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

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

Для B2B-магазина LikeSoft 24 я создал компактную, трёхэкранную веб-презентацию, которая быстро убеждает посетителя в надёжности компании и её преимуществе на турбулентном рынке ПО:

1️⃣ Экран стартового оффера + логотипы Kaspersky, UserGate, Yealink — мгновенный кредит доверия.
2️⃣ Карточки-буллиты с гарантиями: лучшие цены, официальные договоры, поддержка 24/7.
3️⃣ Упор на скорость: внедрение за 1 час и бесплатная консультация инженера.

Минималистичная цветовая палитра (сочетание фирменного синего и нейтрального серо-белого) подчёркивает технологичность, а изометрические 3D-иллюстрации добавляют презентации динамику и современный характер. Итог — лаконичный, доверительный лендинг, который помогает LikeSoft 24 конвертировать трафик в целевые заявки.

Задача
С нуля упаковать запуск телемед-сервиса: быстро объяснить преимущества онлайн-консультаций и показать сам продукт — веб-приложение для пациентов.

1 Этап: брифинг с врачами и пациентами, аудит конкурентов.
2 Этап: CJM ⟶ структура презентации
3 Этап: Прототип-макет веб-приложения для презентации

Цвет и графика
Основные: #0061FF (акцент доверия) + #F5F8FF (светлый фон для «чистоты»).
Второстепенные: мятный для CTA, серый для вторичного текста.
Иконки — простые моно-строки, чтобы не отвлекать от контента.
Mock-up приложения встроен в презентацию: пользователь сразу видит интерфейс при прокрутке.

Результат
Клиент получил продающую LP-презентацию + готовый UI-комплект, который лег в основу дальнейшей разработки фронтенда.
Конверсия из демо-заявки выросла до 18 % в первый месяц запуска.

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

1 Этап: брифинг с работниками компании и пользователями которые не сталкивались с таким продуктом.
2 Этап: CJM ⟶ структура презентации
3 Этап: Разработал презентацию с боковой навигацией и крупной типографикой, Фирменный navy-фон + пять сегментных акцент-цветов из логотипа (зелёный, коралловый, пурпурный, бирюзовый, жёлтый) задают динамику, а спокойный off-white облегчает чтение
4 Этап: Интерактивные кнопки, в презентацию встроены ссылки на необходимые источники / контакты

Ключевые решения
Фокус на здоровье — первый экран мгновенно связывает «умный стол» с профилактикой болей в спине.
Карточки преимуществ — иконки + короткие тайтлы: Забота о здоровье / Гибкость / Продуктивность.
Каталог-витрина — популярные модели выводятся в 3-колоночном лейауте.
CTA для партнёров — финальный экран приглашает к сотрудничеству, дублируя QR-код и контакты персонального менеджера.

Результат
Презентация стала основой для B2B-воронки: 👉 конверсия запроса прайса выросла до 22 %.
Готовая дизайн-система сократила время разработки прочих презентаций на 35 %.

Задача
Разработать удобную для освоения методичку "как выстроить воронку продаж по авторской схеме П-Т-М (Планирование → Тестирование → Масштабирование)"

Проанализировал 40+ вопросов менеджеров, разбил материал на три блока и заложил логику «от стратегии к тактике».
Создал адаптивный макет (1920 × 1080) + гайдлайны для повторного использования командой. Каждый подпроцесс (SWOT, ROI, каналы трафика) вынесен в отдельную карточку с чек-листом.

Итоги проекта
Время изучения методички сократилось до ≈ 7 минут — только то, что нужно для busy-менеджеров.
Отдел маркетинга LuxAlto получил гибкий шаблон: меняй текст — и готов новый обучающий продукт.
Партнёры отмечают, что схема П-Т-М «переводит сложный маркетинг на человеческий язык» и мотивирует попробовать инструменты сразу после прочтения.

Структура и сценарий
Оттолкнулся от «клиентского пути» — каждая сторона закрывает следующий логический вопрос: что? как? когда? сколько?

Черно-белая палитра + неоново-зелёные «✓» и красные «✕» — мгновенный акцент на бенефитах/ограничениях.
Футуристичный гротеск для заголовков — отражает digital-ДНК агентства, читабельный геометрический шрифт для текста.
Карточная сетка 2×2 / 1×2 помогает «сканировать» блоки по диагонали.

Итог для клиента: увеличил CR встречи → оплаченное «Pro» — до 41 % (vs 24 % у старого КП).
Единая дизайн-система лёг в основу будущих презентаций WebVision — экономия на дизайне ≈ 4 ч на каждый новый проект.

Почему это работает? Минимализм + акцент-цвет = ясный фокус; чёткая матрица тарифов = быстрое решение; пошаговый роад-мап = доверие к процессу.