ШОВ Обсудить проект
ШОВ / ВЕБ-ДИЗАЙН Москва · Россия
Исследование · UX/UI · арт-дирекшен · анимация

Веб-дизайн с идеей и системой

Проектируем дизайн сайтов, которые выделяют бренд и ведут пользователя к действию. Исследование, UX, арт-дирекшен, UI, адаптивы, анимация и дизайн-система — отдельно или вместе с разработкой.

Обсудить проект
Посмотреть шоурил
Дальше
01 / 13Подход

Хороший веб-дизайн — это стильили удобство?

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

01 / смысл

Смысл

Формулируем, что сайт должен объяснить, кому и в какой последовательности.

Основа — задача бренда
02 / сценарий

Сценарий

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

Основа — логика пользователя
03 / характер

Характер

Соединяем типографику, композицию, графику и движение в узнаваемый digital-образ.

Основа — отличие от рынка
02 / 13 Состав

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

Что входит
в веб-дизайн
сайта

Дизайн — не один макет главной. Это исследование, логика, визуальный язык, адаптивное поведение и правила для развития проекта.

01/ 08

  1. Изучаем продукт, аудиторию, бренд, конкурентов, текущие материалы и ограничения будущей разработки.

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

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

  4. Находим центральную визуальную идею: типографику, композиционный принцип, графику, цвет и характер подачи.

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

  6. Пересобираем композицию и приоритеты для компьютера, планшета и телефона с учётом реальных сценариев.

  7. Проектируем появление контента, переходы, микроанимации и эффекты, которые поддерживают идею сайта.

  8. Собираем компоненты, состояния, стили и спецификации в Figma; готовим проект к разработке и авторскому надзору.

03 / 13Проекты

Избранные проекты
и дизайн-системы

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

03 / бренд-платформа

Ростикс

Фирменный digital-образ платформы экскурсий: живой бренд, понятный выбор города и сценарий записи без лишних шагов.

  • UX
  • UI
  • бренд-система
  • адаптивы
Обсудить похожий проект
02 / Комсомольская правда

Комсомольская правда / Витрина спецпроектов

Корпоративная витрина специальных проектов медиагруппы «Комсомольская правда». Платформа позволяет фильтровать кейсы по тематике, формату и периоду, изучать состав каждого проекта и его итоговые показатели.

  • каталог кейсов
  • фильтрация
  • страницы проектов
  • KPI
  • категории
  • формы заявок
  • медиаматериалы
  • SEO
Обсудить похожий проект
04 / 13Для кого

Когда нужен веб-дизайн ШОВ

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

05 / 13Почему ШОВ

Дизайн, который не ломается на этапе разработки

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

06 / 13Доверие

Клиенты ШОВ

Создаём digital-образ для больших брендов, городских программ, медиа, продуктов и компаний, которым важно отличаться не только словами.

07 / 13Инструменты

Из чего собирается дизайн-система сайта

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

01

Исследование

+
БрифИнтервьюАнализ конкурентовКонтентМетрики
02

UX-проектирование

+
Карта сайтаUser FlowWireframesПрототипСценарии
03

UI и арт-дирекшен

+
FigmaТипографикаКомпозицияЦветГрафика
04

Анимация и интерактив

+
ПереходыМикроанимацииGSAPThree.jsПрототип движения
05

Передача в разработку

+
ComponentsVariablesAuto LayoutUI KitСпецификации
design.system.fig исследование → структура → прототип → концепция → UI → анимация → передача ГОТОВО К РАЗРАБОТКЕ
08 / 13Качество

Пять критериев сильного веб-дизайна

Проверяем не только впечатление от первого экрана. Дизайн должен объяснять, направлять, отличать бренд, масштабироваться и сохранять качество в реальной разработке.

09 / 13Этапы и сроки

Как создаём дизайн сайта

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

  1. 01

    Бриф и исследование

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

    контекст
  2. 02

    Структура и прототип

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

    логика
  3. 03

    Дизайн-концепция

    Находим визуальную идею и показываем, как она работает на ключевом экране и элементах.

    характер
  4. 04

    Страницы и адаптивы

    Развиваем концепцию на весь объём, состояния интерфейса, планшетную и мобильную версии.

    система
  5. 05

    Анимация и передача

    Описываем движение, собираем UI-kit, готовим макеты и сопровождаем разработку.

    реализация

На выходе — структурированный проект в Figma: страницы, адаптивы, компоненты, состояния, логика анимации и правила, по которым команда разработки соберёт сайт без догадок.

10 / 13Стоимость

Форматы работы и стоимость веб-дизайна

Стоимость зависит от количества уникальных страниц, глубины UX, графики и анимации. После брифа фиксируем объём, команду, этапы и смету без открытого финала.

Новый проект

Дизайн сайта
с нуля

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

послеБРИФАфиксируем состав и смету
Обсудить
Обновление продукта

Редизайн
сайта

UX-аудит текущего решения, новая структура и визуальная система с учётом контента, аналитики и SEO-посадочных.

послеАУДИТАоцениваем объём изменений
Обсудить
Отдельный этап

Концепция
или UX-аудит

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

поЗАДАЧЕопределяем результат этапа
Обсудить
Что влияет на смету

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

11 / 13Направления

Другие услуги ШОВ

Можем продолжить дизайн собственной разработкой или подключить отдельные компетенции: анимацию, 3D, корпоративный сайт, промо-проект, кабинет и поддержку.

01

Корпоративные сайты

Структура, контент, CMS, интеграции и развитие.

 02

Промо-сайты и спецпроекты

Запуски, кампании, события и интерактивные механики.

 03

Веб-дизайн

UX/UI, адаптивы, состояния и дизайн-система.

 04

Motion-дизайн

Система движения для интерфейсов и коммуникаций.

 05

Интернет-магазины

Каталог, корзина, оплата, доставка и интеграции.

 06

Личные кабинеты и SaaS

Роли, процессы, данные, интеграции и масштабирование.

 07

Аналитические дашборды

Источники, метрики, роли и интерфейсы для решений.

 08

Поддержка сайтов

Развитие, мониторинг, стабильность и обновления.

 09

Сайт за 9 дней

Фиксированный процесс и быстрый запуск под ключ.
12 / 13 · FAQ

Частые вопросы

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

Исследование задачи и конкурентов, структура, пользовательские сценарии, прототип, визуальная концепция, дизайн страниц, адаптивные макеты, состояния интерфейса, сценарии анимации и дизайн-система для разработки.

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

Да. Передадим структурированный проект в Figma, адаптивы, компоненты, состояния, UI-kit и пояснения для команды разработки. При необходимости подключимся к авторскому надзору.

Стоимость зависит от типа сайта, количества уникальных страниц, глубины UX-проектирования, графики и анимации. После брифа фиксируем состав работ, сроки и смету.

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

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

Обычно сначала формируем и защищаем одно сильное направление, основанное на задаче и исследовании. Количество альтернатив и глубину концептуального этапа фиксируем в предложении до старта.

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

Да. Проектируем переходы, появление контента, микроанимации и интерактивные эффекты, описываем логику и при необходимости реализуем её вместе с frontend-командой.

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

Да. Команда ШОВ может продолжить проект: frontend, backend, CMS, анимация, интеграции, тестирование и запуск. Дизайнер и арт-директор сопровождают реализацию.