Дизайн сайтов

Для кого эта услуга

Дизайн сайта — это не про «красиво». Это про то, насколько быстро посетитель понимает, куда попал, находит нужное и решается оставить заявку. Мы проектируем интерфейсы, в которых каждое решение объяснимо: почему кнопка здесь, почему этот блок выше того, почему на телефоне меню устроено именно так.

К нам за дизайном обращаются в нескольких ситуациях:

• Нужен новый сайт, и вы хотите начать с сильного проекта, а разработку доверить нам же или своей команде.
• Старый сайт устарел визуально, но его структура и система управления в порядке — достаточно редизайна.
• Есть свои программисты, которым нужны аккуратные макеты, UI-кит и спецификации, чтобы собрать интерфейс без догадок.
• Сайт не конвертирует: трафик есть, а заявок мало. Здесь начинаем с анализа поведения посетителей и проектируем заново ключевые страницы.
• Нужен дизайн веб-сервиса или личного кабинета — с формами, таблицами, фильтрами и сложными сценариями.

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

Что входит в услугу

Дизайн у нас — это последовательность этапов, где каждый следующий опирается на предыдущий. Мы не рисуем макет «с чистого листа по вдохновению», а идём от задачи к решению.

• Исследование. Интервью с вами, анализ 5–10 конкурентов, изучение аудитории, при редизайне — разбор Яндекс Метрики и вебвизора текущего сайта.
• Информационная архитектура. Карта сайта, навигация, логика разделов. Определяем, какие страницы нужны и как пользователь будет между ними перемещаться.
• Прототипы. Чёрно-белые схемы страниц с реальными заголовками и блоками. На этом этапе обсуждаем смысл и порядок, а не цвета.
• Визуальная концепция. Две-три стилевые доски с вариантами настроения, шрифтов и цветов. Выбираем направление до того, как рисовать все страницы.
• Макеты страниц. Детальный дизайн всех уникальных шаблонов: главной, разделов, карточек, контактов, форм, страницы ошибки.
• Адаптивные версии. Отдельные макеты для телефонов, планшетов, ноутбуков и широких мониторов, а не автоматическое «сжатие» десктопа.
• UI-кит. Библиотека компонентов: кнопки, поля, карточки, иконки, сетка, типографика, состояния элементов. По ней сайт можно развивать годами без потери единого стиля.
• Интерактивный прототип и передача в разработку. Кликабельная версия для проверки сценариев и аккуратно подготовленные файлы для программистов.

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

Как проходит работа

1. Знакомство и бриф (1–2 дня). Обсуждаем бизнес-задачи, аудиторию, вкусовые ориентиры и ограничения — например, существующий фирменный стиль или технологию, на которой будет собран сайт.
2. Исследование (3–5 дней). Анализируем конкурентов и данные текущего сайта, формулируем гипотезы: что мешает посетителям и что поможет.
3. Структура и прототипы (4–8 дней). Согласовываем карту сайта и прототипы ключевых страниц. Обычно это 2 круга правок.
4. Концепция (3–5 дней). Показываем стилевые варианты на примере главной страницы, выбираем одно направление.
5. Дизайн всех шаблонов (7–15 дней). Рисуем внутренние страницы, состояния элементов, всплывающие окна, формы и уведомления.
6. Адаптивы (4–7 дней). Прорабатываем мобильную и планшетную версии, особое внимание — меню, таблицам, фильтрам и формам.
7. UI-кит и передача (2–4 дня). Собираем библиотеку компонентов, готовим спецификацию и созваниваемся с разработчиками, чтобы ответить на вопросы.
8. Авторский надзор (по ходу вёрстки). Проверяем собранные страницы и сравниваем их с макетами, чтобы в продакшн не ушли «почти такие же» отступы и шрифты.

Пакеты и стоимость

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

Редизайн одной ключевой страницы с анализом поведения посетителей — от 30 000 ₽. Авторский надзор во время вёрстки включён во все пакеты. Если вы потом закажете у нас и разработку, стоимость прототипов не дублируется — подробности на странице разработки сайтов.

Что нужно от вас

• Цели сайта в измеримом виде: заявки, звонки, регистрации, продажи — и что сейчас мешает их получать.
• Фирменный стиль, если он есть: логотип в векторе, брендбук, шрифты, цвета. Если стиля нет, предложим разработать его параллельно.
• Контент или его черновик: хотя бы тезисы ключевых страниц. Дизайн под реальные тексты всегда точнее, чем под «рыбу».
• Фотографии продукции, команды, объектов. Если их нет или они слабые, подскажем, что снять и как.
• Референсы — 3–5 сайтов, которые вам нравятся, с пояснением, что именно цепляет. Это экономит неделю поиска стилистики.
• Один ответственный за согласование, который отвечает в течение 1–2 рабочих дней.

Типичные ошибки

• Оценивать дизайн «нравится — не нравится». Правильный вопрос — решает ли макет задачу пользователя. Мы всегда объясняем логику решений и предлагаем проверить спорные места на тестах с 5–7 людьми из целевой аудитории.
• Пропускать прототипы. Без них дизайнер одновременно решает и что показать, и как это выглядит. В итоге правки по смыслу приходят на этапе финального макета и стоят втрое дороже.
• Рисовать только десктоп. Если мобильную версию «додумывает» верстальщик, сайт на телефоне выглядит как случайный набор блоков. А именно оттуда приходит большинство посетителей.
• Гнаться за трендами. Модные эффекты через полгода выглядят устаревшими, а тяжёлая анимация замедляет загрузку. Мы используем их, только когда они помогают смыслу.
• Не передавать UI-кит разработчикам. Без библиотеки компонентов каждая новая страница рисуется заново, и через год сайт превращается в лоскутное одеяло.
• Забывать о служебных состояниях. Ошибка в форме, пустая корзина, ничего не найдено, загрузка — это тоже интерфейс, и его нужно проектировать.

Гарантии

• Фиксированная стоимость и сроки прописаны в договоре и не меняются без изменения объёма.
• До трёх кругов правок на каждом этапе включены в цену.
• Исключительные права на макеты и все исходные файлы переходят к вам по акту.
• Только лицензионные шрифты, иконки и изображения — никаких рисков претензий от правообладателей.
• Макеты реализуемы. Перед передачей их проверяет наш ведущий разработчик: всё, что нарисовано, можно сверстать без костылей и потери скорости.
• Если концепция не подошла совсем — бесплатно сделаем ещё одну. За всю практику это понадобилось в единичных проектах.

Вопросы и ответы

Можно ли заказать только дизайн, а сверстать своими силами?

Да. Мы подготовим макеты, UI-кит и спецификацию так, чтобы ваша команда собрала сайт без лишних вопросов, и проведём созвон-передачу. По желанию подключим авторский надзор — от 15 000 ₽ за проект.

В какой программе вы делаете макеты?

В Figma. Вы получаете ссылку на проект с первого дня и можете оставлять комментарии прямо в макете. После завершения работ передаём файл в вашу команду или аккаунт.

Почему нельзя сразу нарисовать красивый макет, без прототипов?

Можно, но это дольше и дороже. Прототип за 2–3 дня отвечает на вопросы о структуре, которые иначе всплывут на этапе финального дизайна и потребуют перерисовки нескольких страниц.

Вы делаете дизайн на основе нашего брендбука?

Конечно. Брендбук задаёт рамки — цвета, шрифты, характер графики, — а мы переводим его на язык интерфейса. Если в брендбуке не хватает веб-элементов, дополним его.

Сколько времени занимает редизайн?

Редизайн среднего корпоративного сайта на 8–10 шаблонов занимает 4–6 недель. Если структура остаётся прежней, срок сокращается на 1–2 недели.

Можно ли проверить дизайн до запуска сайта?

Да, и мы это рекомендуем для сложных сценариев. Собираем интерактивный прототип, даём его 5–7 людям из вашей целевой аудитории и смотрим, где они спотыкаются. Такой тест занимает 3–4 дня и стоит от 25 000 ₽, а ошибки, найденные на макете, исправляются в разы дешевле, чем на готовом сайте.