Первая страница

Draw.io

для создания деловой графики
Онлайн: РИСОВАЛКИ | ИГРЫ | РЕЛАКС программы

Предназначение

Draw.io - проект, в который входят бесплатные векторные редакторы деловой графики для работы в Windows, Linux, MacOS, web. В редакторе можно создавать блок-схемы, планы помещений, UML и Venn диаграммы, BPMN схемы, диаграммы связей, схемы компьютерных сетей, макеты интерфейсов программ, таблицы, инфографику и многое другое. Для вышеназванных тем предустановлены графические элементы, которые просто перетаскиваются мышкой на рабочий холст. Между элементами можно прокладывать соединительные линии по самым замысловатым траекториям. Линия-связь прочно прилипает к смежным элементами, так, что при перетаскивании элемента в другое место, конец связи будет следовать за ним. Результат работы экспортируется в разные форматы: свой собственный формат проекта, векторный формат SVG, растровые форматы PNG, JPG, WEBM, а также в HTML с удобным интерактивным просмотрщиком графики на странице браузера.

Draw.io

Как тут

В левой панели редактора находятся наборы элементов сгруппированные по областям знаний. По умолчанию открыт набор General, в котором находятся общие универсальные фигуры, которые перетаскиваются на рабочий холст мышкой. Сразу оговорюсь, что язык интерфейса я предпочитаю не менять с родного языка программы. Но тому, кто хочет русский интерфейс, может нажать кнопку глобуса [🌐] вверху справа и выбрать его.

При выделенном объекте в правой панели редактора вы увидите параметры элемента, разделенные на три закладки Style, Text, Arrange. Настраивать различные параметры можно с точностью до пункта, градуса, процента. Это важно для перфекционистов. Обычный пользователь может манипулировать размерами, положением, поворотом, прозрачностью с помощью мыши.

При совершении двойного клика по элементу или нажатии клавиши F2 при выделенном объекте, вы окунаетесь в режим редактирования элемента. Этот режим отличается тем, что редактор начинает рассматривать объект как контейнер и предлагает дополнительные возможности - поместить в контейнер изображение или таблицу, например.

Отличительной особенностью всех редакторов деловой графики является работа с соединительными линиями, олицетворяющие логические связи между объектами. Чтобы прикрепить линию к элементу надо его перетащить из набора General. Или сделать так: навести курсор мыши на элемент без клика > по периметру элемент покроется маленькими крестиками > схватить крестик и потянуть в сторону > будет сформирована линия, которую можно "приклеить" к другому элементу. Вместо крестика можно с таким же успехом кликнуть по одной из четырех синих стрелок вокруг объекта, появляющихся при наведении на него мыши.

Работа с таблицами

Мне кажется, в любой программе деловой графики должна быть налажена функция создания таблиц. Но, например, в стандарте этого класса программ и, действительно, мощном продукте MS Visio, с таблицами работать полноценно нельзя. Самым удобным табличным инструментом обладает MyDraw. А в Draw.io - средний вариант по удобству. Поэтому, хотелось бы на этом остановиться.

Почему-то таблица помещается только в контейнер, которым может выступать фигура. Перетащим слева на холст обычный прямоугольник. Совершим по нему двойной клик для перехода в режим редактирования. В правой панеле появится кнопка [▦] (Table). Кликнуть на нее и мышкой обозначить количество строк и столбцов. Таблица создана, но пока не видна. Еще раз совершите двойной клик по центру прямоугольника. В правой панеле появятся дополнительные кнопки по работе с таблицей. Нажмите кнопку [Border Color] и выберите цвет решетки. Таблица станет видна, ее ячейки будут узкими. Поместите курсор мыши в первую ячейку и набейте текст. Перемещайтесь по таблице клавишами-стрелками и заполняйте ячейки. Размер контейнера можно менять независимо от размера таблицы. Можно сделать заливку цветом таблицу и контейнер независимо друг от друга. Редактор также позволяет добавлять/удалять строки/столбцы специальными кнопками. Кнопка [Spacing] служит для задания расстояния текста от краев ячейки - этот атрибут сразу повышает смотрибельность таблицы.

Draw.io - работа с таблицами

Кроме того, таблицу можно быстро открыть из набора Tables с уже сформированными и видимыми строками и столбцами.

И последнее про таблицы. В режиме редактирования контейнера с таблицей будет активизирована кнопка [</>] на верхней панели - это вызов редактора HTML-кода прямо в теле контейнера. Человеку, знакомому с HTML, это серьезное подспорье в деле быстрого создания таблиц из готовых заготовок кода. Поддерживаются основные тэги HTML и элементы CSS. Но вот мой любимый clip-path не поддерживается.

Понравилось / не понравилось

Субъективные впечатления о программе после первых дней работы с ней:

Понравилось Не понравилось
• Возможность создавать таблицы.
• Легкое дублирование элементов.
• Рисование ломанных линий.
• Богатый выбор элементов из встроенной библиотеки.
• Огромный выбор изображений из интегрированной онлайн-библиотеки;
• Продвинутое сохранение в HTML.
• Многоплатформенность.
• Scratchpad - область создания и хранения своего набора элементов.
• Изменение масштаба клавишами [+] и [–] с Ctrl;
• Стабильность в работе.
• Не очень удобно работать с таблицами.
• Нельзя редактировать элементы по узлам.
• Нельзя маскировать встроенное изображение под форму фигуры.
• Неполноценный импорт SVG (нельзя менять цвет и кривые);
• Нельзя заливать форму текстурой;
• Ручное написание шрифта, который отсутствует в редакторе, но есть в операционной системе.

Скачать

Прежде всего предложу онлайновую версию Draw.io, которую не надо скачивать, а можно работать в любом браузере.

Пользователям Windows 10 вот ссылка на скачивание портабельной версии Draw.io (пароль для разархивирования: newart.ru).

Остальные загрузки редактора находятся на сайте производителя.

Видео:
Знакомство с Draw.io - на русском.
Урок по созданию несложной схемы - на русском.
Короткие видеоуроки от разработчика - на английском.

Ещё программы векторной и деловой графики:
Affinity Designer // виртуоз векторной графики
Affinity Publisher // компьютерная вёрстка
Axure RP Pro // макетирование и прототипирование сайтов
Edraw Max // приложение для создания деловой графики
Grapholite // приложение для создания бизнес графики
Gravit Designer // многоплатформенная векторная машина
Lunacy // для макетирования интерфейсов (аналог Sketch)
MyDraw // редактор деловой графики (аналог Visio)
PhotoLine // немецкий графический комбайн, умеющий многое
Pichon // коллекция иконок в программной оболочке
RealDraw // векторно-растровый редактор
Serif DrawPlus // классический векторный редактор
Strokes Maker // преобразование фото в гравюру
Xara Photo & Graphic Designer // гибридный графический редактор
Векторные редакторы онлайн // работают в браузере без загрузки на компьютер
Дело было вечером
Делать было нечего
Объявление Творческой личности
Книга - источник настроения
Опарин. Дети вдохновляют
Книга для семейного чтения:
  • Стихотворные комментарии к детским рисункам
  • Энциклопедия абстрактных понятий
  • Загадки про животных
  • Детские стихи
PDF 250 стр. без сокращений, бесплатно
домой | живопись | графика | компьютерная графика | поделки | юные художники | темы | комментарии | перлы
конкурсы | игры | релакс | рисовалки | учиться рисовать | детские карты Москвы | детские стихи | статьи | видео | поиск | обратная связь