Как мы создали Unidraw — аналог Miro
Перебрали готовые варианты и развернули опенсорсное решение, а затем поняли, что придётся создать своё. Рассказываем, как подступились к задаче и каким видим сервис в будущем.
Поиск решения
В работе мы часто пользуемся виртуальными досками. Они нужны нам для проведения ретроспектив, онлайн-встреч с визуализацией, быстрых мокапов и других задач. Долгое время мы отдавали предпочтение внешнему сервису, но с 2022 года занимались поиском альтернативных инхаус-опций.
Сначала мы хотели найти готовое решение. Подходящим по функциям оказался BoardOs, но его представители ответили, что у китайского сервиса нет планов по развитию в России. Другие варианты не подходили нам по ряду причин:
Ограничения функциональности. Многие альтернативные продукты оказались узкоспециализированными и не могли полностью заменить функционал:
- решали только отдельные задачи, в то время как наши коллеги использовали подобные сервисы комплексно;
- не хватало привычных инструментов для совместной работы и визуализации идей.
Проблемы с доступом. Другим существенным недостатком стали ограничения по количеству пользователей:
- некоторые сервисы лимитировали число участников, которые могли одновременно работать на доске;
- возникали сложности с предоставлением доступа большому количеству сотрудников.
В разгар поисков наши архитекторы предложили интересное решение. Они обратили внимание на open-source-проект с P2P-шифрованием передачи данных. Это открыло новые возможности. Мы решили использовать этот проект как фундамент для создания собственного сервиса — Unidraw. Он должен был выполнять как минимум ключевые функции:
- возможность делиться ссылками на доски;
- сохранение результатов работы в личном кабинете на сервере;
- добавление пользователей к контенту доски.
Первые шаги нового продукта
На базе открытого исходного кода мы разработали личный кабинет для пользователей. В этом пространстве каждый может просматривать свои созданные доски и организовывать их по проектам. Функции включают возможность обмена досками с коллегами, настройку доступа к целым проектам. Пользователи могут гибко управлять правами, предоставляя разрешения на чтение или редактирование отдельных досок и всего набора досок в рамках проекта.
Мы запустили Unidraw в конце сентября 2022 года без намеренного продвижения внутри команды Т-Банка. Работало только сарафанное радио. Cервис оказался полезным, поэтому в первый же месяц мы получили 250 пользователей.
Пока сервис обрастал пользователями, мы решали задачи по развитию функций:
- сделали ссылки на место на доске (при передаче ссылки доска откроется на том месте, где указал ее создатель);
- добавили фреймы и стикеры;
- добавили Color Picker, расширив возможности цветовой дифференциации элементов на доске;
- добавили snap-объекты — линии, которые позволяют позиционировать элементы друг относительно друга.
После обновления Unidraw мы собрали обратную связь от пользователей — и она была положительной. Оказалось, что мы закрываем потребности тех, кто пользовался другими похожими продуктами. К нам стали переходить из других сервисов.
Сервис постепенно становился все более популярным. К февралю 2023 года мы подошли к порогу 2 000 MAU — метрике, которая показывает количество уникальных пользователей, взаимодействующих с сервисом в течение 30 дней. Примерно столько же сотрудников использовали альтернативный сервис.
Цифры внутри Т-Банка за два года:
- > 75 тысяч досок;
- > 30 тысяч пользователей;
- 3,5 тысячи уникальных пользователей в день.
Какие сложности удалось преодолеть
Unidraw приобрел популярность очень быстро, и мы столкнулись с единовременным наплывом пользователей. В то время мы были сосредоточены на улучшении визуального интерфейса и планировали позднее заняться оптимизацией серверной части, отвечающей за обмен данными об изменениях в модели. Это решение привело к некоторым техническим сложностям при росте нагрузки на систему.
Сама модель передачи данных, наследуемая от open-source-решения, была неудовлетворительной: модель доски полностью со всеми элементами передавалась по сети между получателями, работающими с этой доской. Когда на доске появлялось более пяти человек, это давало высокую нагрузку на сервер передачи данных.
Мы знали о проблеме и планировали полностью переписать сервис, как только добавим новые инструменты для клиентов. Но приложение стало активно использоваться для презентаций идей на встречах, а также на внутренних мероприятиях. После одного из таких корпоративных событий количество наших пользователей резко удвоилось. Мы достигли отметки 2 500 еженедельно активных пользователей (WAU), что к концу месяца вылилось в 5 000 ежемесячно активных пользователей (MAU). Такой внезапный рост создал существенную нагрузку на наши серверы. Это повлияло на бэклог, и нам пришлось срочно решать проблему сетевого взаимодействия. Сейчас сервис работает в штатном режиме благодаря своевременной реакции.
Кейсы использования Unidraw
Unidraw глобально можно использовать для работы в командах, обучения, планирования и других активностей. Приведем несколько примеров, которые помогут лучше представить сценарии использования.
Ретроспектива — регулярная встреча в командах, где участники обсуждают, как прошла неделя или итерация проекта. Они смотрят на то, что удалось, какие были проблемы и как можно улучшить работу в будущем.
Есть много форматов проведения ретроспективы, и для каждой подходит наш сервис. Например:
- Карусель идей. Участники пишут идеи на карточках и обсуждают их по кругу.
- Дерево решений. Проблемы записываются как ветви дерева, а решения — как листья.
- 4-Quadrant Model. Участники делят проблемы на четыре квадранта: «важно и срочно», «важно, но не срочно», «не важно, но срочно», «не важно и не срочно».
Unidraw часто используется при разработке стратегий: он облегчает общение, развивает креативность и увеличивает вовлеченность участников. Когда команда активно работает с Unidraw, процесс создания стратегий становится более динамичным и увлекательным. Существует несколько вариантов его применения в этой сфере.
Визуализация целей и миссии:
- Ментальные карты. Для мозгового штурма, чтобы наглядно показать цели компании, ее ценности и основные направления стратегии.
- SWOT-анализ. Для отражения сильных и слабых сторон, возможностей и угроз. Это помогает четко понять положение компании на рынке.
Brainstorming и генерирование идей:
- Запись идей. Удобно по очереди фиксировать мысли на стикерах и размещать на доске в Unidraw для коллективного обсуждения.
- Сценарное планирование. Можно создавать разные сценарии для развития компании и анализировать их влияние на стратегию.
Структуризация процессов и планирование:
- Kanban-доска. Наглядное отображение задач, стадий разработки и прогресса в каждом стратегическом направлении.
- Gantt Chart. Составление графика для выполнения основных задач и этапов реализации стратегии в течение заданного периода.
Командная работа и совместное решение:
- Sticky Notes. Применение цветных стикеров для выделения приоритетов, категорий или мнений по разным элементам стратегии.
- Круглый стол. Обсуждение идей, комментирование предложений и принятие совместных решений.
Визуализация результатов:
- Сводная таблица. Отображение выводов и решения, принятых во время стратегической сессии.
- Наглядные графики. Отображение данных о ключевых метриках, ходе реализации стратегии или результатах ее использования.
Unidraw часто используется при сессиях наставничества для визуализации при объяснении разных ситуаций, с которыми может столкнуться менти.
Планирование и целеполагание:
- Определение целей. Можно зафиксировать цели или задачи, которых хочет достичь подопечный за конкретный период.
- Создание Roadmaps. Визуализировать план с ключевыми действиями по его достижению, чтобы корректировать путь по мере необходимости.
Обсуждение проблем и выработка решений:
- Mind Mapping. Ментор и менти могут проанализировать проблему, разложить ее на части и сформулировать решение.
- Sticky Notes. Наставник и подопечный присваивают стикер с кратким описанием плюсов и минусов решения. Это помогает визуализировать сравнение в интерактивном формате.
Обмен знаниями и опыт:
- Sharing Knowledge. Можно записывать цитаты, ссылки на полезные ресурсы или выводы из опыта наставника. Это позволит лучше запомнить информацию и переложить ее на навыки.
Отслеживание прогресса:
- Kanban-доска. Для отслеживания этапов работы над задачами и прогресса в достижении целей наставничества.
Сбор обратной связи. Можно создать раздел для фиксирования комментариев от менти — это поможет наставнику помогать подопечным еще более эффективно.
Unidraw может использоваться в самых разных сферах деятельности:
- Обучение и тренинги. Можно создавать визуальную часть контента и постепенно открывать модули, отображая прогресс прохождения.
- Репетиторство. Unidraw позволяет рисовать карандашом, сохранять шаблоны, вставлять иллюстрации, сохранять материалы в личном кабинете и возвращаться к ним при необходимости.
- Бизнес-процессы. Есть возможность визуализировать схемы — от простых до BPMN (Business Process Model and Notation — одна из самых популярных систем для описания бизнес-схем).
- Исследования. Можно построить, например, CJM (карту пути клиента), фиксируя выводы, инсайты и проблемные места.
- Описание структуры для управления персоналом. Unidraw помогает визуализировать оргструктуру, что снижает риски конфликтов при изменениях.
- OKR (Objectives and Key Result — система постановки и мониторинга целей). Есть возможность обсуждать и фиксировать общие цели, сохраняя комментарии о трудностях, которые связаны с их достижением.
Оставим ссылку на открытую доску Kanban-метрик, где можно увидеть сервис в работе.
Наши планы
У нас в Т-Банке нет запретов на использование альтернативных сервисов, при этом MAU Unidraw постоянно растет, что вдохновляет команду на развитие продукта.
Наша цель — обеспечить максимально удобные условия для совместной работы пользователей, поэтому мы регулярно вносим изменения. В наших планах, например, добавить модуль презентации, улучшить мобильную версию, добавить реакции, сложные виджеты, доступ по ссылке без регистрации, рисование через нажатие на точку от объекта и многое другое.
Чем больше пользователей приходят к нам, тем больше обратной связи мы получаем. Мы пересматриваем наш план развития, учитывая все оценки, пожелания и вопросы. Оставить их можно в телеграм-канале нашего сервиса.
Если вам понравится Unidraw, скорее создавайте свои первые доски — на сайте сервиса.
российское айти такое
— рынок что вам нужно?
рынок: сделайте нормальный аналог гугл-документов. ну, невозможно же работать в этих документах, что есть сейчас!
с рынка уходят куча сервисов, угроза над гугл-документах.
вк такие:
— рынок, смотрите, аналог миро!
рынок: «ок, но сделайте норм аналог гугл-документам!»
яндекс такой:
— рынок, смотрите, есть аналог миро, можно испортировать доски из миро.
рынок: «ок, но сделайте гугл-документы!»
яндекс:
— да мы сами пользумся гугл-доками, норм сервис, согласен.
банк:
— а у нас круче, в нашем аналоге миро есть предустановленные шаблоны с парусником!
А Яндекс документы плохой аналог?
прикольно, конечно, не спорю. но есть идея одного сервиса, который нужен гораздо большему числу, чем аналоги миро/фигмаджема и ноушена
Я документы в Яндекс неподходят?
а аудитория готова платить за аналоги гула? или скажем так, есть ли вера, что аудитория будет платить после возможного ухода гугла, а не пользоваться всем тем, чем богаты облака яндекса и мейла?
Чем плохи гугл-документы ?
Пошла тестировать. Интересно