Юзетикс. Юзабилити-тестирование и проектирование интерфейса

UX-дизайн — это проектирование пользовательского опыта взаимодействия (User Experience), от изучения целевой аудитории до разработки логики взаимодействия с интерфейсом и тестирования прототипов;

UI-дизайн — визуализация элементов пользовательского интерфейса (User Interface), благодаря которой пользователю будет удобно с ним взаимодействовать.

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

Стоимость UX/UI-дизайна зависит от многих факторов, таких как:

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

Ориентировочная стоимость UX/UI-дизайна: 30—120 тыс. руб. за один сценарий взаимодействия. Вот примеры из статистики по стоимости наших проектов:

30 000 ₽

Минимальная стоимость

536 700 ₽

Медианная стоимость

4 238 500 ₽

Максимальная стоимость

Оценивали состав работ и стоимость проекта

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

На основе информации из вашего брифа, данных веб-аналитики, других данных выделяли основные группы пользователей и составляли портреты типовых персонажей. Анализировали ваших прямых и косвенных конкурентов, определяли ваше позиционирование относительно конкурентов и основные преимущества вашего продукта.
Генерировали идеи и концепцию интерфейса

Было важно, чтобы заказчик и исполнитель одинаково понимали, какой результат нужно получить. Для этого мы создавали концепцию интерфейса и согласовывали ее с вами. На этапе создания концепции интерфейса проводили воркшоп для сбора идей, делали недетализированный концептуальный прототип из 1–3 ключевых экранов.
Формировали информационную архитектуру продукта

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

Проектировали экраны интерфейса для ключевых пользовательских сценариев, которые позволяли решить основные задачи пользователей и бизнеса. Экраны для этих сценариев мы создавали на основе исследований бизнеса, пользователей, накопленных эвристик, знаний о психологии и доступности контента для всех пользователей, в том числе для людей с ограничениями по здоровью (accessibility). Делали прототипы нужных страниц с низкой или средней детализацией, чтобы в будущем проверить наши гипотезы на реальных пользователях.
Разрабатывали концепцию визуального дизайна

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

В несколько итераций тестировали прототип на пользователях
Проектировали детальный прототип всего интерфейса

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

В течение 6–12 месяцев после сдачи проекта бесплатно консультировали вашу команду разработчиков, чтобы они правильно и качественно реализовали предложенное нами интерфейсное решение, отвечали на вопросы по макетам.

Результат

Мы присылали вам отчет с рекомендациями UX-экспертов по итогам тестов на вашей ЦА. Реализованную с учетом этих рекомендаций логику взаимодействия с интерфейсом мы показывали в детальных макетах в формате Sketch или Figma и в интерактивном прототипе из этих макетов в InVision. Разработчики получали готовый макет в формате Zeplin или Figma.

Пример структуры веб-интерфейса системы видеоконференцсвязи (ВКС)

Пример недетализированного концептуального прототипа одного из ключевых экранов для системы ВКС

Пример прототипа экрана со средней детализацией

Пример прототипа экрана с высокой детализацией

Пример визуального дизайна одного из экранов системы ВКС

1/1

Спасибо, сообщение успешно отправлено.

Как вас зовут*

Обязательное поле

Email*

Обязательное поле

Телефон*

Обязательное поле

Ваша задача*

Обязательное поле

Я согласен на обработку персональных данных

Необходимо согласие на обработку данных

Анализ лучших практик

Мы выбирали аналоги вашего продукта и делали список всех реализованных в них функций.

Проектирование навигации

Делали так, чтобы пользователи вашего продукта легко находили то, что им нужно для решения ключевых задач.

Тестирование концепции

Проверяли перспективность идеи нового интерфейса на представителях вашей целевой аудитории. Выясняли, что и как нужно улучшить.

Итерационное прототипирование

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

Все методики