UXPUB 🇺🇦 Дизайн-спільнота

Cover image for Дизайн мобильного приложения для полетов на борту Virgin Atlantic
Редакція
Редакція

Опубліковано

Дизайн мобильного приложения для полетов на борту Virgin Atlantic

#ux

Немного контекста

Это был двухнедельный дизайн-марафон в General Assembly. Задача состояла в интегрировании полетных сервисов Virgin Atlantic в мобильное приложение. Цель - предложить пользователю комфортный полет с массой полезных опций.

Бриф

Через Virgin Atlantic летает около 5.4 миллионов пассажиров ежегодно. Успех их бизнес-стратегии требует от компании развития сервисов. Руководство делает упор на рынки бизнес-услуг и досуга, повышение комфорта и эффективности полетов.

Недостатки

Сейчас услуги на борту:

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

Virgin Atlantic хочет, чтобы сервисы на борту были доступны с мобильных устройств.

Команда UX-разработчиков и график работы

Это мы! Справа налево: Стефано, Дафна и я. Мы работали над этим проектом две недели:

  • Неделя 1: Спринт по ресерчу и постановке проекта. Этот этап включал в себя план проекта, бизнес-анализ. А также опрос, интервью пользователей, диаграмму сродства, создание персонажей, карту потребительского опыта и дизайн-студию.
  • Неделя 2: Спринт по разработке и передаче результата. Этот этап включил в себя бумажные прототипы, прототипы средней детализации, макеты и высокоточные кликабельные прототипы. Мы прошли через несколько итераций и тестов на юзабилити.

Во время этого спринта я была вовлечена в весь процесс дизайна, но также играла роль координатора команды. Я постоянно проверяла согласованность в работе команды, а также насколько точно мы следуем графику. Команда UX-разработчиков

Наш подход

Мы сформировали наш подход к задаче на основе ключевых ценностей Virgin Atlantic.

“Мы всегда выходим за рамки норм, чтобы предоставить клиентам незабываемый опыт использования наших услуг” - Virgin Atlantic

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

Ресерч

Соцопрос

Чтобы начать фазу исследований, мы провели опрос по каналам соцсетей. Мы получили 60 респондентов. Начали опрос с отборочного вопроса, спрашивая людей, был ли у них опыт длительных перелетов. Этот вопрос помог нам исключить 11% респондентов, которые не подходили под нашу целевую аудиторию.

Интервью

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

Диаграмма сродства

Мы сгруппировали данные из интервью в разные категории. Это помогло лучше понять конечных пользователей. Диаграмма сродства

Персонажи

Из диаграммы сродства мы сделали вывод, что имеем дело с тремя категориями клиентов. Мы создали три персонажа, которые их представили. Клаудиа, наш главный персонаж. Она летает часто в Нью-Йорк из Гонконга по работе, и использует свое летное время для работы и развлечений. Персонаж 1 - Клаудиа Боб - наш второй персонаж. Он ИТ-консультант, часто путешествующий по работе, а также на разные конференции. Боб любит проводить все время полета за просмотром кино и ТВ-шоу. Персонаж 2 - Боб Анна путешествует не так часто, как Клаудиа и Боб. Но когда летает, любит комфорт и отсутствие проблем в полете. Персонаж 3 - Анна Вот карта событий, сборная из главных проблем наших персонажей: Вот карта событий проблем персонажей Клаудиа в аэропорту всегда нагружена кучей вещей, с трудом находит свой билет, чтобы пройти на борт и ненавидит пользоваться пультом на самолете. Ее раздражают технические проблемы…

Решение

Решением для проблем Клаудии, Боба и Анны является создание приложения, которое решает все задачи, с которыми они сталкиваются.

“Создать приложение, которое помогает пассажирам Virgin Atlantic получить ожидаемый комфорт от перелета, полного развлечений” - команда UX-разработчиков.

Приоретизация функционала

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

Дизайн-студия

Для этой дизайн-студии мы сконцентрировались на двух главных сценариях:

  1. Гладкое летное путешествие, в котором Клаудии не нужно прерывать свой шоппинг в аэропорту. Информация по терминалам доступна в телефоне, не нужно постоянно искать на мониторах аэропорта нужные данные.Карта взаимодействия Клаудии с приложением Virgin Atlantic
  2. Первоклассный опыт развлечений на борту для Боба. Он выбирает фильм для просмотра и контролирует встроенный экран прямо со своего телефона.

Карта взаимодействия Боба с приложением Virgin Atlantic

Результаты дизайн-спринта

К концу дизайн-спринта мы получили бумажный прототип, готовый к тестированию.

  1. Прототип для комфортного перелета:Прототипы комфортного перелета Virgin Atlantic
  2. Прототип для первоклассного опыта развлечений на бортуПрототип развлечений в Virgin Atlantic

Тестирование бумажного прототипа

Мы протестировали прототип. Нашли некоторые недочеты в используемом языке и навигации. Люди немного путались, пытаясь подключить телефон ко встроенному экрану:

  • Нечеткий язык
  • Сложная навигация
  • Непонятный процесс подключения телефона к встроенному монитору на борту.

Тестирование прототипа Virgin Atlantic Мы решили сделать шаг назад и пересмотреть структуру приложения. После небольшой сессии брейншторминга мы получили новую карту приложения.

Карта навигации

Мы упростили навигацию и сократили количество страниц. Также убрали систему ручного подключения, заменив ее на автоматическую. Карта навигации приложения Virgin Atlantic

Средней детализации прототип

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

  1. Комфортный перелетКомфортный перелет Virgin Atlantic
  2. Первоклассный опыт развлечений на бортуОпыт развлечения на борту Virgin Atlantic

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

Новый прототип показал себя гораздо лучше в работе. Мы продолжали итерировать, пока не получили уверенность в том, что прототип готов к полной детализации. Тестирование прототипа Virgin Atlantic

Высокая детализация

Каждый из нас открыл Sketch. Мы экспериментировали с цветами и стилями на основе дизайна, который придумал Стефано.

Результат дизайн-спринта

Мы разработали 15 дизайнов. Покритиковали каждый и решили объединить элементы, набравшие больше голосов, в одну версию. Мы работали в рамках фирменного стиля бренда Virgin Atlantic. Virgin Atlantic v.1

Результаты тестирования

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

  • Сложно читаемый текст
  • Иконки в нижней панели навигации не выделялись из-за нехватки контраста
  • Высота нижней панели навигации слишком большая.

Финальный дизайн

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

Версия 1

В этом варианте мы попытались сохранить яркие цвета Virgin Atlantic. Мы улучшили читабельность в меню навигации, контрастируя оттенки. Выделенные элементы в меню навигации теперь красные, выступают на фоне невыделенных элементов на пурпурном фоне. Virgin Atlantic v.2

Версия 2

Мы пошли путем минимализма. Мне кажется, этот дизайн выглядит профессионально и чисто. Мы оставили ярко-красный брендовый цвет Virgin Atlantic, но разбавили его немного более темным оттенком красного на белом фоне. Virgin Atlantic v.3 Мы покопались в иконографике и решили немного улучшить дизайн. Вместо цветного фона и иконок с заливкой у нас теперь незалитые иконки по умолчанию. При выделении иконка окрашивается в красный, а текст становится жирным.

Подведем итоги

Было сложно выработать решения в такой быстрый срок при таком количестве задач. Но мы справились. Мы показали прототип людям, работающим в этой сфере долгие годы, и их отзывы были очень позитивны, как по части UX, так и по части UI. Скоро я добавлю кликабельный прототип, следите за обновлениями. А пока, оставлю вам эту цитату от Virgin Atlantic:

“Это все о следовании вашим мечтам, поиске нового опыта и воплощении ваших идей в реальность”. — Virgin Atlantic

http://ux.pub/oficialnoe-rukovodstvo-po-google-design-sprint-metodologiya-dizajn-sprintov/


Перевод статьи Chaymae Lougmani

Найстарші коментарі (0)