UX/UI ·
UX-аудит сайта: что это, как проводится и как влияет на конверсию
Разбираем, как UX-аудит находит места, где сайт теряет клиентов: что проверяют, какие методы используют, что получает бизнес и как измерить эффект.
Дизайн
UX/UI-дизайн сайтов и сервисов
Проектируем структуру и интерфейс так, чтобы пользователю было понятно, что делать дальше. Прототипируем, проверяем решения и передаём макеты, готовые к разработке.
Об услуге
UX отвечает за логику, UI за визуальную систему
UX-часть определяет, какие шаги проходит пользователь, какой контент ему нужен на каждом экране и где размещать целевые действия. UI-часть превращает эту логику в интерфейс: типографику, сетку, цвета, кнопки, формы и их состояния. Одно без другого не работает: аккуратный экран с непонятным сценарием теряет заявки.
Мы делаем дизайн с расчётом на внедрение. Продумываем адаптив, состояния элементов, ошибки и пустые экраны, собираем компоненты в Figma. Разработчики получают полный набор макетов и спецификацию, поэтому на этапе сборки остаётся меньше вопросов и переделок.
Задачи
Какие задачи решаем
Сценарии до оформления
Начинаем с целей и задач пользователя: какие шаги он проходит, где сомневается и уходит. На этой основе строим структуру экрана, приоритеты контента и логику целевых действий.
Проверка на пользователях
Согласуем прототип и проверяем его юзабилити-тестированием: даём задачи, наблюдаем, фиксируем проблемы и дорабатываем. Это дешевле, чем переделывать после разработки.
Единые компоненты
Собираем мини-дизайн-систему: типографику, сетку, отступы, кнопки, поля, карточки, состояния. Интерфейс остаётся цельным, новые страницы собираются быстрее.
Доступность интерфейса
Закладываем читаемые размеры шрифтов и достаточный контраст текста, кнопок и форм, чтобы интерфейсом было удобно пользоваться на разных устройствах и экранах.
Состав работ
Что входит в работу
- Анализ целей, аудитории и сценариев
- Структура страниц и приоритеты контента
- Прототипы и пользовательские потоки
- Юзабилити-тестирование прототипа на пользователях
- UI-макеты для десктопа и мобильных устройств
- Компоненты, стили и состояния интерфейса
- Проверка контраста и читаемости
- Figma-файл и спецификация для разработки
- Ответы на вопросы команды разработки
Процесс
Как строится работа
Каждый этап заканчивается понятным результатом, который вы согласуете перед переходом к следующему.
- 01
Анализ
Изучаем цели, аудиторию, конкурентов и доступные данные. Формируем пользовательские сценарии и список страниц или экранов.
- 02
Прототип
Проектируем wireframes и пользовательские потоки, согласуем структуру и ключевые экраны до финального дизайна.
- 03
Тестирование
При необходимости проверяем прототип на пользователях, фиксируем непонятные места и вносим правки до начала UI-дизайна.
- 04
UI-дизайн
Делаем макеты для десктопа и мобильных устройств, прорабатываем состояния элементов, собираем компоненты и стили.
- 05
Передача в разработку
Передаём организованный Figma-файл со спецификацией по компонентам, состояниям и адаптиву, сопровождаем вопросы разработчиков.
Кейсы
Избранные проекты
Отзывы
Цена, скорость и качество - так о нас говорят клиенты
Блэнси зарекомендовали себя как надёжные и профессиональные партнёры, способные быстро и качественно решать сложные задачи.
Чистая линияМарка мороженого № 1 в России, 2020
Благодарственные письма
FAQ
Частые вопросы
В чём разница между UX и UI?
UX - логика и удобство сценариев: какие шаги проходит пользователь и что видит на каждом из них. UI - визуальная система и оформление интерфейса. Вместе они дают понятный и рабочий дизайн.
Сначала прототип или сразу дизайн?
Сначала прототип и структура, затем UI. Так согласование идёт быстрее, а дорогих правок в готовых макетах становится меньше.
Что такое состояния в дизайне?
Это варианты элементов и экранов: наведение, нажатие, неактивная кнопка, ошибка в форме, загрузка, пустой список. Без них разработчикам приходится додумывать поведение интерфейса самостоятельно.
Что вы передаёте на выходе?
Figma-файл с макетами, компонентами и стилями, спецификацию по состояниям и адаптиву, комментарии для разработчиков. После передачи отвечаем на вопросы команды разработки.
Можно сделать редизайн существующего сайта?
Да. Начинаем с диагностики: структура, сценарии, элементы доверия, формы. Затем обновляем прототип и UI с учётом найденных проблем.
Сколько экранов нужно для старта?
Разумно начать с ключевых: главная, страница услуги или карточка товара, форма заявки, личный кабинет. Остальные экраны добавляем по приоритету и на основе уже собранных компонентов.
Смежные услуги
Часто заказывают вместе
- РазработкаРазработка сайтовРазрабатываем сайты под бизнес-задачу: заявки, продажи, работа с контентом. Закладываем структуру, адаптив, аналитику и SEO-основу, чтобы сайт развивался без переделок.
- РазработкаВеб-сервисыРазрабатываем веб-сервисы и личные кабинеты с ролями, статусами, документами и интеграциями по API. Проектируем их так, чтобы продукт выдерживал рост пользователей и функций.
- ТестированиеUX/UI-аудитНаходим, где интерфейс мешает пользователям достигать цели, а бизнесу получать заявки и продажи. Передаём список проблем с рекомендациями и приоритетами.
Блог
Статьи по теме
Разработка ·
Зачем сайту мобильная версия
Почему адаптивность влияет на продажи и позиции в поиске и что проверить на своём сайте.
Маркетплейсы ·
CTR-тест главного фото на Ozon: как найти обложку, которая и кликается, и продаёт
Высокий CTR сам по себе не гарантирует продаж: бывает, что на фото кликают, а в корзину не кладут. Разбираем, как тестировать главное фото и по какой метрике выбирать победителя.
Новый проект
Обсудим вашу задачу
Опишите задачу в свободной форме. Ответим в рабочее время, уточним детали и предложим формат работы.