UI/UX Case Study: Lunch Roulette Поиск компании в обеденный перерыв

Aleksandra Nosnitsina
DesignSpot
Published in
13 min readSep 18, 2019

Это статья из серии рассказов о проектах в DesignSpot School 2019.
Проект разрабатывался в рамках
летней менторинг-программы командой студентов школы и менторов из сообщества DesignSpot.
Задачей команды было разработать цифровой продукт или сервис для решения конкретных задач реальных заказчиков.
Обо всех трудностях дизайн-процесса, созданных артефактах и поиске решений вы узнаете из этого лонгрида.
! Добавьте статью в закладки, так как информации очень много и за один раз все полезное не запомнить, и не забудьте похлопать :)

Введение

Всем привет!

Мы команда Lunch Roulette (я и моя сестра Саша) и в этой статье мы хотим рассказать вам, как на протяжении почти 3 месяцев мы работали над проектом. Цель проекта: улучшение коммуникации между постоянными сотрудниками и адаптация новых сотрудников в компании. Проще говоря, совместный обед (или обеденная прогулка), — это замечательный нетворкинг!

А это мы, команда из двух сестер Юля и Саша.

Работа выполнялась под руководством менторов Марии Коковкиной и Алексеем Акимкиным в рамках программы DesignSpot School компании EPAM. Спасибо им большое за это!:)

Начало

После того как мы получили тему проекта, первой нашей активностью стала онлайн-встреча с нашими менторами. На протяжении всего проекта мы созванивались в Microsoft Teams, так как мы живем в Москве, а наши менторы в Санкт-Петербурге. Разные города нам совсем не помешали.

Итак, на первой «встрече» мы познакомились друг с другом, каждый рассказал о себе, наметили план предстоящей работы и вдохновленные приготовились к бою. Ох-ох, мы и не знали, что нас ждет сумасшедшее лето :)

Чтобы процесс работы был прозрачным и понятным для нас и для наших менторов мы использовали kanban-доску.

Пример нашей доски-стенки

Полезной активностью стало составление Personal Development Plan. Мы подумали над тем, какие способности и компетенции мы хотим прокачать и в чем мы сильны на данный момент. Нам было важно понять, какие будут ожидания от нас, как от джуниор дизайнеров.

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

Описание проекта

Lunch Roulette или поиск компании для обеда — это сервис, развивающий сотрудничество в масштабах всей компании. Он объединяет на совместный обед людей, которые хотят наладить коммуникацию с командой и найти приятные и полезные знакомства.

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

Любой проект начинается с Desk Research, что мы и сделали первым делом. Это помогло погрузиться в область коммуникации между сотрудниками крупных компаний.

Так же любой проект не начнется без kick off встречи со стейкхолдером или заказчиком. В роли нашего стейкхолдера выступила Наталья из Минска, которая работает HR в компании EPAM.

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

Результат kick off встречи:

  • узнали обстановку в коммуникации между разными подразделениями и у новых сотрудников в крупных компаниях
  • изучили область работы HR, его компетенции и бизнес-цели
  • определили цель проекта, проблему и видение продукта (высокоуровневые детали).

Проблема вливания новичков в команду оказалась самой острой.

На этом этапе мы смогли собрать дизайн бриф:

  1. Описание проекта

2. Ключевая проблема

3. Картина успеха

4. Требования

5. Целевая аудитория

6. Дизайн принципы

7. Цели пользователей и стейкхолдеров

8. Бизнес ценность

Проведенные за 3 месяца ключевые активности

Ключевая проблема:

1. Трудности вхождения в новый коллектив (сложно начать разговор)

2. Редкие знакомства друг с другом (незнание, как и где; боязнь; стеснение)

3. Нехватка времени, большая загруженность на работе.

Картина успеха:

Новые сотрудники вовлечены и легко общаются со всеми коллегами с помощью нашего сервиса на совместном обеде.

Сервис способствует быстрому развитию социальных контактов в коллективе.

HR положительно отзываются о новом сервисе и видят прогресс в коммуникации между сотрудниками.

Основная задача HR – это решение проблем адаптации новичков.

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

“Они одиноко ходят на обед. Кому-то ОК, а кому-то некомфортно”

Исследование

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

Мы проанализировали 5 конкурентов. Определились с функциями, которые нам необходимо включить в наш сервис, и выделили для себя самые интересные решения.

Интервью пользователей

Следующим важным и очень интересным этапом стало изучение наших потенциальных пользователей.

Кто же стал нашей целевой аудиторией?

Все просто и немного предсказуемо.

  1. Новые сотрудники в IT-компаниях, которые хотят легко влиться в коллектив
  2. Постоянные сотрудники, которые желают развивать нетворкинг в компании и получить приятные и полезные знакомства

И тут мы столкнулись с небольшой проблемой. Где нам найти тех самых потенциальных пользователей? Мозговой штурм, снежный ком среди знакомых знакомых, немного магии и мы пообщались с сотрудниками из Яндекс, QIWI, EPAM, Сбербанк.

Итог: 5 интервью.

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

Блоки вопросов:

  1. Опыт новичка, мероприятия для новичков
  2. Общение с коллегами
  3. Тулы для общения
  4. Как проходят обеденные перерывы

Наши менторы помогли нам определиться с самыми важными гипотезами и скорректировать вопросы. Каждая гипотеза была основана не только на kick off встрече, но и на данных из различных статей.

Интервью с разработчиком из EPAM

Гипотезы для интервью:

1. Новым сотрудникам мало мероприятий для вливания в коллектив, которые проводятся в компании

2. Сотрудники компаний используют большое количество приложений и мессенджеров для общения и встреч с командой и с трудом принимают очередное приложение

3. Сотрудники редко знакомятся со своими коллегами из-за разного графика, загруженности и непонимания как и где организовать встречу

4. Компании из 3 человек помогают лучше раскрепоститься. Так легче общаться, чем 1 на 1.

Полезные инсайты:

1. “Первые дни обедала я одна.”

2. “Скайп, почта, куча всяких чатов. Иногда их бывает даже слишком много.”

3. “У всех много работы, знакомимся в боевых условиях на совместных проектах.”

4. “В слаженный коллектив сложно вклиниться.”

5. “Нельзя чтобы разная информация была в разных приложениях — это неудобно.”

Одним из интереснейших стало интервью с программистом из компании EPAM. Он поделился с нами наболевшими проблемами новичка (как это было 2 года назад) и рассказал, как сейчас обстоят дела с новыми сотрудниками.

Ему надоело постоянно всех звать на обед, поэтому он решил создать бота в Телеграмм, который вместо него будет опрашивать всех коллег, кто хочет пойти с ним на совместный обед.

Под конец нашего проекта мы снова с ним связались и смогли протестировать начальные заготовки бота и дать отзыв по его использованию.

Как итог, мы удивились, насколько у всех похожие проблемы, в особенности у новичков:

  • Не хватает мероприятий для вливания в коллектив.
  • Сложно вступать в контакт в первые дни работы.

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

MVP

На этом этапе мы пришли к решению интеграции нашего сервиса в мессенджер.

На этапе составления гипотез мы уже предполагали, что это не будет отдельное приложение. И гипотеза подтвердилась!

Мы конечно же хотели сделать приложение, и это было бы интересно для нас. Экранчики, кнопочки. Мы спрашивали себя: “Что решит проблему пользователя лучше / проще / быстрее?”. Идея интеграции в мессенджер стала лучшим решением.

Наш интерфейс — это разговорный интерфейс.

Это быстрее и проще для разработки и внедрения. Сотрудникам крупных компаний и без того хватает большого количества приложений для работы.

“Почта, куча всяких чатиков. Иногда их бывает слишком много”

“Разная информация в разных приложениях — это неудобно.”

Все нужные нам гипотезы подтвердились, и мы смогли двигаться дальше.

Персона

Встать на сторону нашего пользователя и понять его помогла карта эмпатии. Эмпатия — важное качество для дизайнера.

Что пользователи говорят, думают, чувствуют, делают?

На основании карты эмпатии мы легко составили персону. В этом нам очень помогла статья Vanilla Thunder о персонах.

Настоящий важный артефакт UX исследования — персона!:)

CJM

Составление CJM оказалось самой сложной активностью.

Тут мы смогли рассмотреть каждый этап взаимодействия с нашим продуктом:

  • действия, которые осуществляет пользователь
  • барьеры, болевые точки и проблемы при работе с сервисом
  • положительные эмоции

Далее к болевым точкам мы придумали решения, это и стало нашим функционалом!

CJM и персона выполнены в программе uxpressia :)

Приоритизация проблем и их решений

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

В Must have и Should have вошли самые важные для MVP функции. Это те функции, которые войдут в первую итерацию запуска продукта.

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

На протяжении всей работы над проектом каждый этап мы фиксировали в виде Гугл-документов. Это было удобно и для нас, и для менторов. В этом же документе менторы оставляли комментарии для внесения нужных правок.

И вот счастливые и воодушевленные мы думали: «Вот оно наше решение».

Мы всё говорим: «Сервис-сервис», что же это за сервис такой? Проще говоря — это чат-бот. Да-да, нашим решением было создать чат-бота. С его помощью наш пользователь сможет быстро выполнить все свои задачи. Решение немного специфичное и, как оказалось, совершенно непростое в исполнении.

Наш интерфейс — это диалоговый (разговорный) интерфейс Conversational UI.

Дизайн-принципы

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

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

Заработать доверие проще, если предупредить пользователя, что он имеет дело с ботом.

2.Простой и экономный. Линейная, короткая, точная беседа. Она ограничена конкретными предметами. Мы избегаем сложных путей ветвления.

3.Использование структурированного ввода. Использовать кнопки, чтобы облегчить пользователю погружение в технологию.

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

4.Учитывать человеческие эмоции. Личность бота, ориентированная на эмоции, которые мы хотим вызвать у пользователя. Использовать приятельский тон (эмоджи), чтобы пользователь чувствовал, будто он общается со своим другом или давним знакомым.

Проектирование ассистента и его основные поинты

Мы изучили невероятное количество информации о создании ботов от таких ведущих компаний, как Google, Intercom.

Процесс проектирования бота, составления conversational UI состоял из нескольких этапов:

Но обо всем по порядку…

1.Выбор платформы, определение функциональности и возможностей помощника

Мессенджером для нашего Lunch Roulette стал Microsoft Teams. Почему он? Это довольно новая платформа, на январь 2019 Microsoft Teams превзошел по популярности Slack.

Главный аргумент: Microsoft Teams является корпоративным мессенджером в компании EPAM. Свое решение мы проецировали на сотрудников EPAM.

Следующий этап — добавление функционала с учетом ограничений возможностей Microsoft Teams.

Так как мы были лишь «гостями» корпоративного мессенджера, доступа ко всем функциям и возможностям MT у нас просто не было.

Гугл Гугл и ещё раз Гугл. И помощь в виде скриншотов функционала от наших менторов.

Так, изучили гайдлайны Microsoft Teams и принципы создания ботов в Microsoft Teams.

Остаётся создать нашего бота, как помощника, как ассистента с гордым именем Lunch Roulette.

2. Что же такое личность бота и зачем это все?

Мы ответили на 9 важных вопросов. Кто такой LunchRoulette, какие цели он преследует? Вопросы помогли четко определить нашего чат-бота как персонажа.

Ключевой точкой во взаимодействии является наш ассистент, мы чувствовали, что предоставление пользователям привлекательного опыта взаимодействия имеет первостепенное значение. Поэтому так важно создание «личности».

Основная задача — это сделать нашего бота не похожим на автоответчик, он должен стать другом-помощником.

Как мы создали эту «личность»?

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

Ими стали: Casey Naistat, Gary Vee, Will Smith. Добавить юмора нам помог такой персонаж, как Алиса от Яндекс.

Мы поняли как наш бот будет «говорить», определили его тон общения и словарь.

Эмоджи

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

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

Нужно быть осторожными. Где, как и как часто мы используем эмоджи в элементах пользовательского интерфейса, таких как меню или кнопки.

3. User flow и сценарии

Наступил этап составления User Flow, и мы окончательно запутались.

И тут как супер-герои, нас пришли спасать менторы. Леша посоветовал нам написать подробнейшую историю взаимодействия новичка с нашим продуктом. Это очень сильно помогло! Получился интересный и полезный артефакт.

Если интересно прочитать, проглядеть ее всю, вот ссылочка:)

Только после пройденных ранее этапов мы смогли составить наше симпатичное User Flow. Стало понятно, как наш пользователь будет шаг за шагом взаимодействовать с нашим сервисом.

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

Написание диалога — сложная вещь. Большинство из нас много пишут тексты и разговаривают в течение дня, но написание целенаправленного диалога — это другая история.

Каждое сообщение должно приближать к цели. Каждый сценарий — это отдельный разговор.

И тут пришло время проявить творческий подход.

Мы очень хотели сделать классный и интересный диалог, чтобы наш Lunch Roulette стал помощником новичкам и постоянным сотрудникам. Пришло время выпускать харизму и дружелюбность.

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

Ассистент точно знает, кто поможет новичку быстрее влиться в коллектив, поэтому каждый подобранный для обеденного перерыва человек не случаен. Первые важные встречи пройдут с HR и ресурсным менеджером. Постоянный сотрудник сможет сам выбирать отдел для встреч.

4.Прототипирование и тестирование

Тестировали мы наш продукт двумя способами:

  1. Сыграли роль бота
  2. Предоставили кликабельный прототип

Для первого способа тестирования подходит любой мессенджер. Мы «играли роль» ассистента Lunch Roulette и вели диалог так, как мы бы хотели, чтобы отвечал наш помощник.

Скриншоты экранов, где мы играем роль Lounch Roulette.

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

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

Далее мы поместили «разговор» бота в интерфейс MT в Фигме и снова начали тестировать.

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

Когда мы протестировали нашего «помощника», мы приступили к визуальному дизайну.

Визуальный дизайн? У Бота? Да-да. Это редактирование архитектуры под гайдлайны, лого и цветовая гамма.

Финишная прямая Юху!

Брендбук

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

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

Знаете, душа в нем есть!

Заключение

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

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

DSS и все все все!)

Спасибо большое DesignSpot School за знания и умения, которые вы нам дали.

Спасибо вам, что дочитали до конца.

P.S.: мы не станем говорить, что нам будет очень приятно, если вы похлопаете!

Наша команта:

Юлия Носницина:

Александра Носницина:

Читайте другие статьи из серии UX Сase Studies проектов DesignSpot School 2019

Сообщесво и школа в сети:
- DesignSpot на Medium
- Сообщество DesignSpot на Facebook
- Бесплатная школа дизайна от DesignSpot на Facebook
- DesignSpot в Telegram
- DesignSpot в Instagram #dsgnspot

--

--