Проектирование
Омниканального контакт-сервиса
Статистика по работе каждого менеджера и канала , рассылки, омниканальный чат, аудио и видео звонки, контсруктор чат-ботов, файловое хранилище и многое другое
130 000 руб, 7 недель


К сожалению, я не могу показать всех макетов, т.к. проект для внутреннего пользования компании.
Клиент - Telescop corp
О заказчике:
Я общался с представителем компании Алексеем.
+ Человек профессионал в разработке сложных систем, четко доносит смысл того что нужно с точки зрения функционала и технических ограничений.
+ Отвечал подробно на мои вопросы каждый день практически моментально. Я задавал вопрос, через 3-15 минут обычно уже получал ответ.
+ Если я что-то спроектировал не так как хотелось заказчику, аргументировал каждый пункт почему стоит переделать.
Начало сотрудничества

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

Технического задания на старте не было. Срок ставился в 6 дней.
Заказчик предоставил наброски прототипов уже существующего решения для понимания сути сервиса (ниже часть прототипов)
Дальше в переписке по проекту я получил ссылку на сервис livetex - это был оптимальный ориентир по функционалу, удобству, красоте.

Первая сложность с которой я столкнулся - это ожидания заказчика по сроку и цене. Проанализировав функционал сервиса livetex и сравнив c предоставленными набросками прототипов я понял что там нет 80% функционала который есть в livetex. Об этом во время обсуждения по скайпу я рассказал об этом и попросил составить список того что должно быть в сервисе, так как функционал который был озвучен при общении сильно отличался по количеству и объему от того что было в прототипах заказчика.

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

После того как было составлено Техническое Задание по которому уже можно было приступить к работе, срок проекта согласовали в 1 календарный месяц и 80 тыс. руб с оплатой понедельно.

Я решил что на данном этапе хватит подобного ТЗ и так как сервис очень большой получается, лучше переходя от раздела к разделу детально уточнять ТЗ этого раздела. Эта хороший способ быстро приступить к реализации и не парить мозг заказчику, но важно заранее заложить дополнительный срок на реализацию 20-50% от первоначального.

Я этого не сделал, в итоге работал больше месяца по ставке в 1,5 раза ниже обычной чтобы выполнить свои обязательства. Поэтому все следующие проекты я буду начинать только с детально прописанного ТЗ по каждому разделу, функции, ограничению для каждой "роли" (админ/клиент/сотрудник)


Ключевая проблема
Неэффективность службы поддержки, которая компенсируется большим числом менеджеров (повышенными расходами)
У компании AirAstana миллионы клиентов по всему миру и все они обращаются в контакт центр разными способами: звонят, пишут через онлайн-чат на сайте, мобильное приложение, через социальные сети вконтакте, facebook, мессенеджеры telegram, whatsapp, viber.

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


Как этого добиться:

1
Повысить эффективность сотрудников, сократив ненужные рутинные действия

Добиться этого за счет омниканальности (когда все сообщения клиентов приходят в одно единственное окошко менеджеру) и системы шаблонных быстрых ответов
2
Перенести на чат-ботов все повторные вопросы и сценарии разговоров
Для того нужен конструктор чат-ботов с функцией обучения сотрудникам.
В идеале придти к тому что бы менеджерам занимались только уникальными нетипичными вопросами, и обучали чат-ботов.
3
Подробная статистика по работе каждого сотрудника и каналов
Для того чтобы не держать в штате тунеядцев, тех кто плохо обслуживает клиентов и оперативно реагировать на сбои каналов
4
Единая база клиентов, сотрудников
О которых можно все посмотреть - когда и с кем общались, через какие каналы. В любой момент связаться - написать по любому каналу или позвонить, заблокировать, сделать рассылку, отправить смс и тд.
5
Записи всех разговоров, истории переписок и хранилище данных
Чтобы быстро в любой момент времени найти нужный файл, забытую тему или какие-то важные данные из разговора с клиентом.
Начало работы
Погрузился в тему омниканальности
- Какую выгоду она дает бизнесу
- Какие есть решения на рынке
- Кто и как их разрабатывает
- Какие сложности с внедрением
- Кто уже внедрил и какой результат

Собрал всю информацию бизнесе клиента
- кем и когда основана
- цели, миссия, ценности компании
- какое место на рынке занимается, какую долю
- сколько сотрудников в компании, отзывы о работе в ней
- парк самолетов
- куда летают, какое обслуживание
- сильные и слабые стороны компании
- независимые отзывы о компании
- планы компании на будущее
Проработал "роли" пользователей системы их задачи, потребности
Администратор
Роман Богдашкин, 31 год

Основные задачи в сервисе:

1) Видеть насколько эффективно работает каждый сотрудник в компании чтобы найти и уволить бездельников

2) Иметь статистику по всем абонентам, эффективности работы сотрудников для отчетности

3) Контролировать стабильность работы всех систем, настраивать взаимодействие

4) Понять на что больше всего уходит времени менеджеров и сократить это время за счет чат-ботов, тем самым снизив расходы на з/п менеджеров

Супервайзер
Бекнияз Ахметов

Основные задачи в сервисе:

1) Контролировать работу своей группы менеджеров

2) Если менеджер не может ответить на вопрос клиента, то помочь ему подключившись к разговору/чату

3) Общение в групповом чате с командой менеджеров

4) Оптимизация работы менеджеров за счет быстрых ответов и чат-ботов
Менеджер
Маргарита Михалевич

Основные задачи в сервисе:

1) За минимальное количество времени дать полноценный ответ клиенту, решив его вопрос

2) Обслужить как можно больше клиентов

3) Общение в групповом чате с командой менеджеров

4) Обучение чат-ботов
Сотрудник
Елена Никитина

Основные задачи в сервисе:

1) Общение с командой

Проанализировал конкурентов и сделал подборку лучших интерфейсных решений
Основная проблема - это то, что по сути в одном сервисе который я разрабатываю объединено несколько сервисов (рассылки/чат-боты/онлайн-чаты/хранилище данных и тд) и у каждому такому сервису есть 10-15 конкурентов.
То есть пришлось анализировать интерфейсы порядка 120-150 сервисов как на российском рынке, так и на западном.

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

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

Это позволит сохранить структуру интерфейса единой, проще и быстрее будет сверстать и запрограммировать.
2
Инструмент проектирования - figma
Так как макеты дальше передавались команде разработчика и презентовать клиенту было не нужно, а сроки были очень сжатые и нужно было сделать как можно быстрее.

Поэтому выбор пал на figma. В Axure или Uxpin это бы делалось в 1,5-2 раза дольше.

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

Информационная архитекутра
Так как мне не нужно было этот этап презентовать заказчику и нужно было максимально быстро понять структуру сервиса и приступить к проектированию я выбрал для этого инструменты: листочки с бумагой и маркерную доску. Это дало мне понимание что на страницах будет общего, какая взаимосвязь между ними и элементами.
Меню по умолчанию - свернутое
1) Так как ширину экрана определили небольшой в 992px, то по умолчанию меню делаем свернутым чтобы на экране умещалось максимум данных. При необходимости меню можно развернуть. Контент при этом сжимается.

2) Вторая причина - это то, что сотрудники будут работать в веб-сервисе ежедневно и быстро запомнят иконки. А по ним быстрее найти нужный раздел, чем раскрывать меню и искать по тексту.
Фильтры без кнопок "Применить"
Заказчик сообщил что будет использоваться технологии когда контент на странице меняется после выбора определенного чек-бокса, списка без перезагрузки страницы. В этом случае кнопка будет лишним элементом. Необходимость в ней отпадает.
Раздел "Статистика"
Раздел статистики дает полную прозрачность работы каждого сотрудника, канала. Это позволяет находить самых неэффективных сотрудников (уволить при необходимости и сократить расходы). Либо выявить причины почему долго обслуживается тот или иной канал.

Раздел разрабатывался исходя из потребностей администраторов и супервайзеров, выгод для бизнеса.

Для удобства весь раздел разбит на 4 составляющих (табы):
- каналы
- супервайзеры
- менеджеры
- клиенты
Фильтр для точной сортировки, чтобы лишняя информация не отвлекала
Возможность сделать отчет
для начальства
Для повторяющихся фильтров -
шаблоны для экономии времени
Этот график наглядно покажет какие каналы самые нагруженные и куда нужно направить больше менеджеров чтобы клиенты долго не ждали ответов
Здесь можно увидеть каналы где дольше всего отвечают клиентам
Можно во время заметить увеличение кол-ва недовольных клиентов по
выбранному каналу
КАНАЛЫ
Раздел "Клиенты"
Этот раздел используют все сотрудники для того чтобы найти быстро по имени или телефону клиента, посмотреть его историю запросов и при необходимости связаться с ним
Таблица со всеми клиентами и фильтром для быстрого поиска конкретного человека
При клике по строке с клиентом всплывает правый блок, где можно посмотрю всю информацию о клиенте: с кем, когда и через какие каналы он обращался, кто его обслуживал, все его переписки.
Можно написать, позвонить, отправить sms или заблокировать клиента
Раздел "Команда"
Основная цель - быстро найти сотрудника и связаться с ним
Таблица со всеми сотрудниками и фильтром для быстрого поиска конкретного человека
При клике по строке с сотрудником всплывает окно где можно в зависимости от уровней доступа отредактировать данные, доступы, назначить менеджеров, указать навыки сотрудника
Раздел "Чаты"
Главное требование - чтобы все чаты, как клиентские, так и командные были в одном окне.
При этом необходимо, чтобы все функции по переписке (добавление файлов, записи голосовых сообщений, быстрые ответы), созвоны (аудио, видео), информации о пользователе, история обращений и действиях (отправить смс, заблокировать), поиск по чатам и внутри переписки были в одном единственном окне.

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

Это окно переделывалось и дорабатывалось несколько раз практически с нуля. Итоговый вариант вы видите ниже
Переключение между чатами с клиентами и
командой
Групповой видеозвонок при параллельной переписке в чате
Список чатов с отдельными сотрудниками и групповые
Открытый чат
Раздел "Записи звонков"
Этот раздел создан для того чтобы в любом момент можно было найти нужную запись, быстро ее прослушать или просмотреть, а не вспоминать или придумывать факты разговора, что сказал клиент или коллега.
фильтр для быстрого поиска нужной записи
Все записи, которые можно прослушать, просмотреть, скачать, перейти на тот момент где был этот разговор в чате, позвонить клиенту или сотруднику
Раздел "Каналы"
Этот раздел необходим только администраторам для отслеживания работоспособности каналов, настройки.
Раздел "Автоуведомления"
Этот раздел необходим для повышения сервиса и заботы о клиентах в зависимости от их местанахождения.

Например если клиент подъезжает к аэропорту и у него сегодня рейс - приходит смс с номером стойки регистрации его рейса.

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

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

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

В системе администратор указывает при каких сбоях, какие сообщения, кому и когда отправляются.
Раздел "Хранилище данных"
В этом разделе можно найти любой файл который загрузил клиент или коллега. При большом потоке клиентов хранить и находить все у себя на компьютере сложно. А здесь с помощью фильтра это можно сделать за пару кликов
Все файлы которые когда-либо загружались клиентами или сотрудниками в чаты
Ссылка для отправки коллеге или клиенту
Возможность предпросмотра, прослушивания файлов
Раздел "Рассылки"
Рассылки позволяют сократить рутинные действия на отправку писем, смс и сделать все быстрее, красивее и проще.

Основная задача была - сделать простой удобный пошаговый способ сборки и отправления писем, где минимизируется риск отправить письма не тем людям, не то письмо.
Подменю где можно отправить рассылку, отредактировать шаблон, сформировать группы для рассылок, посмотреть статистику по рассылкам, отложить отправку рассылок
Настройки выбранного элемента
Визуальный редактор письма
История действий, предпросмотр, сохранение шаблона
В итоге разработано 350+ макетов только для роли "администратор"
Бесплатная оценка вашего проекта
This site was made on Tilda — a website builder that helps to create a website without any code
Create a website