Графики, диаграммы, блок-схемы — неотъемлемая часть работы в IT. Нужно спроектировать архитектуру приложения или смоделировать рабочий процесс — нарисуем блок-схему, нужно наглядно представить результаты для отчета — нарисуем диаграмму. К счастью, уже давно не нужно делать это от руки в блокноте: существует удобный сервис-помощник Draw.io. Рассказываем, как он работает.
Что такое Draw.io
Draw.io — это бесплатный онлайн-сервис, который позволяет создавать и совместно редактировать диаграммы, различные схемы и прочие визуальные представления данных. Он работает в браузере, поэтому доступен с любого устройства, нужен только интернет.
Чаще всего Draw.io используют для построения диаграмм: буквально за несколько минут пользователь может создать диаграмму любого типа и наглядно представить информацию. В какой-то момент сервис даже переименовали из draw.io в diagrams.net, но старое и привычное название все равно встречается часто.
В чем преимущества Draw.io
- Бесплатно: никаких «pro» и «premium» — просто заходите на сайт, выбираете, куда сохранить ваш проект, и начинаете рисовать — все функции доступны сразу.
- Просто: чтобы воспользоваться сервисом, не нужно быть дизайнером или иметь специальные навыки. Draw.io интуитивно понятен, имеет качественный и продуманный UX.
- Можно использовать по-разному: зайти на сайт, добавить расширение в браузер Chrome или установить приложение.
- Подходит для команд: можно редактировать блок-схемы и диаграммы одновременно с коллегами. Для этого нужно сохранить проект и нажать на кнопку «Общий доступ». Также, если необходимо, сервис можно интегрировать с другими популярными рабочими инструментами — Jira и Confluence, но настройка потребует некоторых финансовых вложений.
- Разнообразно и быстро: в сервисе есть множество готовых элементов, шаблонов, заготовок, которые упростят вам создание визуализаций. Пользователям доступны более 500 вариантов 2D- и 3D-объектов, также есть возможность экспорта изображений и объектов извне в различных форматах.
- Можно интегрировать с сервисами Google: диском, документами, таблицами, презентациями. Например, без лишних сложностей можно встраивать объекты из сервиса Draw.io в презентацию в онлайн-редакторе.
Но у сервиса есть и недостатки
- Общий доступ возможен только для файлов, сохраненных на Google Диске и OneDrive.
- Если вы работаете с редактором Microsoft Word, то автоматически экспортировать проект в него не удастся.
- Пользователи отмечают периодические сбои в desktop-версии сервиса, поэтому проект стоит почаще сохранять.
- Небольшая путаница с элементами: например, есть элементы, в которые по умолчанию можно добавлять текст и он становится частью объекта, а есть отдельный элемент «Текст». При редактировании и перетаскивании с непривычки можно не понять, с чем именно вы имеете дело.
У Draw.io достаточно аналогов: это и сервис Miro, LucidChart, Visio от Microsoft. Но все чаще разработчики и бизнес-аналитики выбирают именно Draw.io, потому что это быстро, просто и бесплатно.
Как работать с Draw.io
Очень просто!
1. Перейдите на сайт.
2. Нажмите кнопку «Создать новую диаграмму» или «Открыть существующую диаграмму», если уже работали с сервисом и хотите отредактировать старый проект.
3. Перетащите фигуры из библиотеки в рабочее пространство, расположите их в нужной комбинации, соедините линиями и стрелками.
4. Добавьте текст, изображения и другие элементы, чтобы создать информативную и наглядную диаграмму или блок-схему.
5. Сохраните свой проект в облаке или экспортируйте его в выбранный формат: PNG, JPEG, WebP, SVG, PDF, HTML, XML.
Какие инструменты есть в Draw.io
В веб-сервисе Draw.io три основных рабочих области. Слева расположены наборы компонентов — геометрических фигур, стрелок, специальных символов, которые нужны для построения блок-схем и различных диаграмм. Они сгруппированы в восемь разделов-списков. Чтобы просмотреть каждый из них, нажмите на название — все элементы откроются. Можно создать собственный список, добавляя наиболее часто используемые элементы в «Избранное».
Всего в сервисе более 500 самых разных объектов — хватит для решения множества задач. С помощью кнопки «Больше фигур», расположенной под списками, можно выбрать дополнительные специализированные наборы объектов и использовать их в своем проекте.
Также в сервисе есть большое количество заготовок и шаблонов — выбрать их можно при создании нового проекта: откроется окно с иконками разных типов диаграмм. Это существенно ускоряет и упрощает создание визуального контента. Например, если вы выбираете UML-диаграмму, то у вас сразу будет «под рукой» весь набор инструментов для создания проекта на этом графическом языке.
В центре находится основное поле — сюда нужно перенести необходимые элементы, чтобы составить из них комбинации. Справа располагаются инструменты для редактирования объектов, которые уже находятся в рабочем поле, и самого поля — цвета, ориентации и других параметров. А сверху — меню и основная панель инструментов. Например, открыв раздел «Дополнительно» можно изменить внешний вид редактора или выбрать тему — темную или светлую, а в разделе «Вид» — управлять отображаемыми панелями инструментов.
Проект в Draw.io может состоять из нескольких листов, переключение между ними происходит с помощью кнопок в нижнем левом углу экрана. Это удобно для сложных рабочих задач, взаимосвязанных бизнес-процессов.
Какие проекты можно создавать в Draw.io
Графики, макеты, диаграммы, любая инфографика и многое другое — функционал сервиса широк и позволяет создавать визуальные материалы для разных бизнес-целей. Вот несколько примеров.
Визуализация бизнес-процессов
Бизнес-процессы — это строгие алгоритмы действий сотрудников, которые приводят к созданию ценного для клиента продукта. В каждой компании существует множество рабочих задач, которые решаются по определенной схеме, многие из них взаимосвязаны друг с другом. Чтобы навести порядок в работе организации, все это стоит четко описать и формализовать. И здесь поможет Draw.io: в нем удобно создавать схемы, выстраивать логику процесса, последовательность действий, редактировать их вместе с командой.
Работа над архитектурой веб-сервисов и мобильных приложений
Draw.io отлично подходит для создания технических заданий, например когда аналитик готовит задачу для разработчика. В Draw.io можно выделять основной функционал, простраивать иерархию, отображать связи между элементами. Можно составить полноценный макет будущего IT-решения, а также дать доступ заказчику, project-менеджеру и другим участникам для совместного редактирования.
Создание прототипов
Да, сервис Draw.io в этом не так эффективен, как Figma или другие инструменты профессиональных UX/UI-дизайнеров, но в нем можно создавать черновики, отталкиваясь от необходимого функционала будущего сайта. Для этого в сервисе есть разнообразные значки, иконки, ползунки.
Создание диаграмм Ганта
Диаграммы Ганта — удобный инструмент для управления проектами. В такой диаграмме отображается прогресс выполнения задач с течением времени. Она также может включать исполнителей, даты начала и завершения отдельных подзадач, связи между рабочими процессами, контрольные точки.
Выглядит это как разноцветные горизонтальные полосы, расположенные в пространстве с двумя осями, и немного напоминает таблицу. Draw.io позволяет создавать такие диаграммы и вносить изменения по ходу выполнения задач — для этого можно дать доступы всем ответственным сотрудникам.
Создание UML-диаграмм
UML, или Unified Modeling Language — унифицированный язык моделирования. Он един для всего мира, и поэтому диаграмма или схема, созданные с его помощью, будут понятны любому человеку, который знает его. В UML каждый символ, геометрическая фигура, стрелка или комбинация этих объектов имеет строго определенное значение. И в Draw.io есть все необходимые компоненты для создания такой схемы.
Mindmap
Майндмэп, или ментальная карта — способ визуального представления и упорядочивания информации, который помогает установить связи между разными частями данных и найти решение задачи. Часто такая карта — результат командного мозгового штурма, когда все сотрудники «накидывают» свои мысли, варианты решения задачи, а потом вместе анализируют. Draw.io позволяет нескольким сотрудникам одновременно редактировать проект онлайн, добавлять элементы, подписи — а значит, отлично подходит для брейншторминга и создания интеллект-карт.
Проектирование интерьера
И такое возможно! В сервисе Draw.io можно выстроить планировку помещения, размещение мебели и разрешить клиенту оставить комментарии онлайн. Поэтому сервис имеет популярность среди дизайнеров интерьеров.
И это далеко не все варианты использования Draw.io. Широкий функционал и гибкость продукта позволяют применять его для решения самых разных задач — все зависит только от фантазии пользователя и его потребностей.
Подведем итог
Несмотря на большое количество аналогов, сервис Draw.io собрал большую аудиторию пользователей — его любят за бесплатный доступ и просту использования. Чтобы строить схемы, рисовать диаграммы и визуализировать данные в этой программе, не нужно никаких специальных навыков: все понятно без дополнительных инструкций.
Но на просторах интернета их достаточно, чтобы точно разобраться во всех тонкостях и сделать крутой проект!
Сервисом пользуются разные специалисты в IT-сфере и не только, например:
- разработчики;
- дизайнеры, в том числе интерьеров;
- аналитики, бизнес-аналитики;
- менеджеры.
Также Draw.io используют студенты: благодаря совместному доступу он очень удобен для создания групповых проектов, брейншторминга, выполнения различных заданий.
Если вам нужен надежный помощник для визуализации любой информации, можно выбрать Draw.io. Вы получите инструмент, с которым можно за короткое время создать майндмэп, блок-схему приложения, визуализацию структуры сайта, диаграмму для презентации или UML-диаграмму для управления процессами. Проекты можно сохранять в облако или на жесткий диск устройства. Импортировать готовую диаграмму или схему можно в PNG, SVG, PDF и другие форматы.
