Приветствую всех читателей блога scriptcoding.ru. Продолжая тему графических редакторов и программирования, хочу представить на суд людской новый графический онлайн редактор под названием Spiro.
Данный онлайн инструмент предназначен не только для рисования, но и даёт возможность создавать собственные фигуры (узоры), которые можно использовать как кисти.
Давайте приступим к обзору столь молодого и ещё никем не признанного графического онлайн инструмента.
Spiro — графический редактор онлайн для рисования
Познакомится с возможностями рисования и самим графическим онлайн редактором Spiro на странице matrixblog.ru/spiro/. Данное творение является моим собственным проектом (как громко звучит 
), который я решил сделать как с целью улучшить свои навыки программирования, там и с желанием сделать что-то стоящее и практическое.
В прошлый раз я уже писал про ещё один графический онлайн редактор Flower (matrixblog.ru/flower/). Который предлагал набор из 11 кистей, выполненных в виде различных цветков. Обзор на flower есть в этой статье.
В этот раз, я решил расширить возможности первой версии, и добавить дополнительную панель для создания и генерирования различных узоров (фигурок), которые можно использовать в качестве кистей.
Учитывая тот факт, что сам редактор Spiro я описал на сайте matrixblog.ru, то тут лишь затрону процесс наиболее интересные возможности данного онлайн инструмента.
Создание и рисование в графическом онлайн редакторе Spiro
После попадания на главную страницу Spiro, перед пользователем будет находится чистый лист для рисования и две панели, которые можно свернуть, нажав по надписи Закрыть панель (эффект сворачивания реализован с помощью связки CSS+JavaScript).
В правой панели управления есть область с кнопками, которые позволяют выбрать нужную кисть (фигурку). Всего, в списке может присутствовать максимально 20 кистей, которые добавляются при генерировании или создании в левой панели. Сразу при загрузке онлайн графического редактора для рисования Spiro в списке уже присутствуют 5 фигурок. При желании, ненужную фигурку (кисть) можно удалить, нажав на кнопку с изображением корзины.
Как и прежде, я добавил группу кнопок для генерации фона различного стиля. По сути, теперь можно составить собственный набор фигурок, из которых будет состоять фон. При движению ползунков в левой панели, можно сразу видеть, как будет меняться узор фигуры в окне предварительного просмотра. Параллельно, я добавил маленькое окно просмотра в панель графического онлайн редактора рисования Spiro, которое позволит увидеть, как созданная фигура будет отображаться на кнопке и при маленьких размерах кисти.
Стили кисти остались прежними. Можно рисовать сплошной линией, с увеличением или с уменьшением размера кисти. При выборе первой кисти, можно просто вставлять фигурку в нужную точку на полотне. В целом, я постарался сделать графический редактор для онлайн рисования Spiro интуитивно понятным. Возможно, стоило бы добавить резинку, полагаю, если будет время, то добавлю некоторые дополнительные кнопки как в Spiro, так и в Flower.
Рисование в графическом онлайн редакторе Spiro – итоги
Завершая данную статью, хотелось бы уделить несколько слов лирической теме.
Изначально, я планировал сделать некое подобие инструмента для создания облака тегов, но на тот момент, мне не хватало знаний и опыта в области программирования. Почитав несколько русскоязычных и англоязычных книг, я понял, что смогу сделать, для начала, собственный онлайн графический редактор с возможность рисовать. По сути, любой инструмент рисования предлагает или разнообразные кисти, или графические эффекты, или всё вместе. Вариант кисти во многом определяется фантазией автора и возможностями языка программирования.
Теперь, я полагаю, что моих сил вполне достаточно для создания чего то более сложного, чем просто графический онлайн редактор, который позволяет создавать кисти (узоры) и даёт возможность рисовать.