DUMP-2012 - Проектирование интерфейсов - "Опыт...

Опыт проектирования

пользовательского

интерфейса SmartNUT

Котельников Илья для DUMP-2012

Этот доклад про:

• Этапы создания удобных

интерфейсов, которые мы прошли.

• Проблемы, возникшие у нас при создании

удобного интерфейса.

• Выводы, которые мы сделали, и

решения, которые мы приняли.

• Советы тем, кто еще только думает, как

сделать свой сервис или приложение

удобнее.

"Как мы придумывали интерфейс

SmartNut" или "ПОЕХАЛИ"!!!

Как мы придумывали интерфейс

SmartNutэто SaaS система класса

service desk, предназначенная для

поддержки пользователей ИТ-услуг.

Как мы придумывали интерфейс

SmartNut

Как мы приняли решение делать удобный

интерфейс. Если коротко:

Как мы придумывали интерфейс

SmartNut

Анализ конкурентов:

•"Ярко, модно, современно«

•Гид, стартовый помощник и

всевозможные подсказки

•Интуитивно понятная навигация в

интерфейсе

•Максимальное использование

стандартных паттернов

•"Веб 2.0" - социальные элементы

etc...

Как мы придумывали интерфейс

SmartNut

Важные особенности b2b SaaS:

• Обезличенная продажа в отличие от b2b

"коробки". Не продавец знакомит

покупателя с продуктом, а сам покупатель

исследует продукт.

• Использование требует ознакомления.

Продукт сложнее, чем b2c SaaS.

• Выигрывает, тот, кто сделает продукт

понятнее для пользователей ВСЕХ

уровней.

Как мы придумывали интерфейс

SmartNutВторой этап: выбор метода разработки

интерфейса.

Наверное нам нужен:

дизайнер, юзабилист, проектировщик

интерфейсов? Как он выглядит?

может так?или так? или вообще так?

Как мы придумывали интерфейс

SmartNut

• Как выглядела схема без привлечения

специалистов по юзабилити:

Постановка

Экраны и их

элементы

Верстка и

разработка

Согласование

Как мы придумывали интерфейс

SmartNutКак мы представляли себе работу над

интерфейсом:

Постановка

Экраны и их

элементы Юзабилити и

дизайн

СогласованиеВерстка и

разработка

Как мы придумывали интерфейс

SmartNut

Что мы не учли:

• неточная постановка задачи

• неправильное представление о процессе

создания интерфейса с помощью

"юзабилити-эксперта"

• согласование на основании интуиции и

логики проектной команды без каких-либо

внешних данных

Как мы придумывали интерфейс

SmartNut

Как на самом деле выглядела работа:

Постановка

Экраны и их

элементы

Юзабилити и

дизайн

СогласованиеВерстка и

разработка

Как мы придумывали интерфейс

SmartNut

Проблемы:Изменение постановки

"удаление задачи":

предлагается записывать

причину.

Изменение механизмов

навигации между экранами

Предложенные

элементы управления

имею высокую

трудоемкость при

выбранных технологиях

Как мы придумывали интерфейс

SmartNut

Как выглядело согласование:

Как мы придумывали интерфейс

SmartNut

Итоги. Плюсы:

• Пользователям нравится интерфейс.

• Интерфейс понятен - минимум

обращений "а как сделать ...?", "а где

настроить ...?"

Итоги. Минусы:

• Срок работы с интерфейсами более 6

месяцев.

• Срок на разработку интерфейса - 3-5

месяцев.

Примеры из других проектов

smartube.ru – это автоматизированный

сервис организации звонков и их

последующей обработки.

Примеры из других проектов:

Smartube

Проблемы при наполнении интерфейса

реальными данными:

как выглядел макет:как выглядит в

системе:

Примеры из других проектов:

Smartube

Предложение

дизайнера:

Как сделали в итоге:

Проблемы с высокой трудоемкостью

разработки предложенных виджетов:

Выводы

• Забота об удобстве пользователей -

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

• Аутсорсинг - не всегда лучший вариант.

Иногда лучше использовать аутстаффинг

или иметь собственного специалиста в

команде.

• Нужно изучать и применять практики по

оценке юзабилити.

Советы

• Четко определите полномочия

специалиста по интерфейсам.

• Если у вас есть интерфейс – вам нужен

графический дизайнер, а не

интерфесолог.

• Выбирая способ работы, уделите особое

внимание срокам.

• Заранее решите, как вы будете

валидировать результаты работы.

Спасибо за внимание!

Регистрируйтесь на SmartNut.ru

и оцените наши интерфейс! ;)

Котельников Илья

ikotelnikov@naumen.ru