Существует множество редакторов для рисования, компьютерной графики и анимации.
Когда я задумал сделать свой собственный, то не ожидал, что по многим параметрам он превзойдёт программы профессиональные. Тем более такие, как CorelDRAW, Крита или Фотошоп.
Но это случилось. Маленькая программа DM_Paint ( чуть больше 1 Мбайта) оказалась весьма удобной, многофункциональной, а по части выбора цвета и оригинальности кистей - не имеющей аналогов.
Проект развивался на протяжении полутора лет, и в настоящее время он полностью завершён.
Функционально в программе можно выделить следующие её части – интерфейс, простое рисование, художественное рисование, преобразования, векторная графика, анимация и раздел Help.
ИНТЕРФЕЙС
Интерфейс программы составляют две панели, левая и верхняя. Справа и снизу поле рисунка свободно. Видимая область рисунка может перемещаться с помощью стрелок в нижней части левой панели.
В программе используется минимальное количество выпадающих меню. Все кнопки на панелях имеют непосредственный доступ, однако функционирование их может быть разным, в зависимости от режима работы программы.
Быстрота обращения к кнопкам, а также то, что они светлые, а не чёрные, то, что они разнообразные и легко визуально различаются – это большое удобство. Соображения удобства и простоты при максимальной широте функционирования – это те соображения, которым я старался следовать.
РАЗДЕЛ «HELP»
Удобен и подробный раздел Help программы. Обычно программы такими разделами не снабжаются, и приходится искать какие-то руководства, чтобы работать с ними. В программе DM_Paint есть не только исчерпывающие инструкции по работе в различных разделах, но и возможность распечатать все инструкции в один текстовый файл, с тем, чтобы можно было читать их все вместе.
ПРОСТОЕ РИСОВАНИЕ
Раздел простого рисования, с дополнительными режимами рисования карандашом и растушёвкой, мало чем отличается от работы в обычной программе Paint, но уже здесь имеется огромный плюс от быстроты и точного подбора цвета путём смешения его с любым другим.
Для этой цели активно используется правая кнопка мыши. Левая кнопка управляет рисованием, а правая – выбором цвета. Что касается палитры, то она всегда присутствует в верхней части левой панели. Причём, цвета на ней соответствуют цветам естественных красок и расположены с подсказкой на те участки спектра, которые они занимают. Данная схема позволяет модулировать цвета одним касанием стилуса, делать это в широких пределах, тонко и безошибочно.
Ни одна другая из имеющихся программ такими возможностями не обладает.
РИСОВАНИЕ КИСТЯМИ
В разделе рисования кистями предусмотрена одна обычная кисть с мягкими краями и шесть других кистей (в том числе мастихин), работающих по своим собственным оригинальным алгоритмам со многими опциями, перестраивающими их работу. В частности, кисти могут работать в гуаши или в нескольких режимах акварели, обладая разной степенью прозрачности, разными законами смешения красок, разными характеристиками перетекания цвета по пикселям, с выбором направления стекания, а также с управляемым размытием красок, положенных на рисунок ранее.
Такая акварель работает совершенно естественным путём, иногда даже более интересным, чем при работе натуральной акварелью.
Опять же – это такое «ноу-хау» которого нигде в мире пока нет.
Имеется также седьмая оригинальная кисть, с однотонным избирательным закрашиванием в разных вариантах, и отдельно – кнопка, реализующая функцию быстрой заливки замкнутого контура.
Для пары кистей имеется возможность создавать фоны, имитирующие работу по холсту или по шершавой бумаге. Одна из кистей специально приспособлена к рисованию прядей волос, и использует паттерны, которые пользователь может создавать сам.
Любопытна также возможность рисования простых прозрачных объектов – слёз или капель дождя на стекле и на листьях. В разделе векторной графики эта возможность реализовалась в создании прозрачных предметов. Можно например, в качестве паттерна, сделать изображение прозрачной бутылки, используя её растровую цветовую модель.
ПРЕОБРАЗОВАНИЯ
К разделу преобразований можно отнести многочисленные опции копирования разных видов, а также изменения цвета – точечное темнение, светление и зацвечивание, отдельные кнопки для проведения этих же операций с более широкими выделенными областями, и кнопки для изменения выбранного цвета в сторону его темнения, светления или изменения степени его белильности.
Имеются методы для повышения контраста и изменения цветового тона областей.
Одних ластиков в программе имеется 3 вида. Первый ластик – сиреневый, просто рисует цветом фона. Второй – синий, удаляет только что нарисованное, но ещё не закреплённое. Третий – розовый, переносит изображение с поля_2 на рисунок_1. Поле_2 это второе поле, часто используемое для хранения промежуточного изображения, или изображения, запоминаемого «на всякий случай» - кнопки возврата к предыдущему изображению в программе нет, поэтому изображение нужно запоминать, если боишься испортить его своими действиями. Кнопки 1=>2 2=>1, передающие изображение, находятся на верхней панели на самом видном месте.
Программисты, когда увидели такой «дизайн» кнопок, попеняли мне – зачем тут знаки больше, меньше и равно? Неужели нельзя было сделать кнопки с красивыми иконками?
Я попробовал. И решил, что нельзя. Именно такая архаичная надпись на кнопках бросается в глаза и делает их заметными.
Отдельной интересной находкой проекта стало «копирование кругами» - http://proza.ru/2019/10/20/1299 позволяющее быстро и очень просто деформировать растровое изображение. Этот приём, а также «синий ластик» помогли мне создать эту анимацию - http://yadi.sk/i/E5ss7oTjyOsENA
ВЕКТОРНАЯ ГРАФИКА
Векторная графика, это, как говорится, отдельная песня.
На иллюстрации, поверх художественных рисунков, вы можете видеть объекты разных типов, сделанные средствами векторной графики.
Вначале я старался строго следовать формату SVG, но затем расширил возможности некоторых элементов. Так, структура фигуры Безье позволяет использовать её не только как контур, заливаемый краской, но и как контейнер для произвольно расположенных кривых, разного цвета и конфигураций, изображающих, например, усы, бороду, нос, рот и даже глаза, зрачки которых можно перемещать.
Фишкой является предельно простое представление векторной графики как внутри программы, так и вне её. Элементы описываются строками из целых чисел, по 12 чисел в каждой строке. В этом виде графика хранится в обычных текстовых файлах, где её тоже можно править.
Титульная строка начинается с логотипа элемента, за логотипом следуют X,Y координаты начальной точки элемента, затем – ссылка на начало дополнительных строк и на число дополнительных элементов, если они предусмотрены данным логотипом. Так, например, выглядит Фигура 37 – гриб с глазами (третья строка) и ножкой (пятая строка).
1> 37 312 69 2 5 32 312 99 5338 703 4
2 0 312 69 312 69 456 152 374 165 0 0
3 0 315 139 314 135 351 133 352 137 32416 -92
4 0 374 165 374 165 289 159 256 182 0 0
5 0 347 294 326 277 369 180 303 170 6710 -78
6 0 256 182 256 182 171 173 312 69 0 0
А вот Паттерн (элемент 16) – рыба, изображается одной единственной титульной строкой. Число 80 в этой строке это отсылка к месту массива с растровым изображением рыбы.
1> 16 298 350 -2 -94 1000 0 80 351 5050 11
В режиме Показа, после клика правой кнопкой мыши, начальные точки элементов обозначаются маленькими кружочками, после чего элемент можно выбрать, кликнув по кружочку правой кнопкой, а затем – перемещать, используя левую кнопку.
Вы видите, правая и левая кнопки мыши и в этом режиме активно используются. Кстати, при перемещении паттерна, сам паттерн до момента его закрепления не рисуется – вместо него мы видим перемещающуюся ножку.
Так же упрощённо, при перемещениях показываются заливаемые цветом фигуры – мы видим только их контуры. Делается это для того, чтобы убыстрить перемещения. С аналогичной целью, для прорисовки графических элементов в программе используются два блока, очень похожих друг на друга. Один блок отвечает за перемещения и вносит в объект сделанные изменения, но не заполняет объекты цветом. Второй блок ни о каких изменениях знать ничего не знает. Он «по-быстрому» и тщательно прорисовывает элементы в их окончательном виде.
Разделение редактирования векторной графики на эти две стадии позволяет существенно экономить общее время счёта.
По мере развития раздела векторной графики я столкнулся со многими проблемами, связанными, главным образом, с предполагаемой анимацией движения объектов графики. Движение вручную, с помощью указателя мыши, для целей анимации мало подходит, поскольку очень трудно таким способом делать дозированные перемещения – одинаковые от кадра к кадру.
Поэтому для дозированных, шаговых перемещений я сделал небольшое квадратное поле, управляющее ими. Поле выдвигается вправо - на рисунок, со стороны левой панели. Вы можете видеть это поле на иллюстрации.
Клики по полю между чёрным и красным кругами передвигают выбранный объект. Направление передвижения и его величина определяются по тому месту, где был сделан клик, а также по цифре над кнопочкой «w» - там величина перемещения задаётся в пиксклях.
Клики по правым углам, за пределами красного круга, поворачивают объект в ту или в другую сторону, а клики по левым углам меняют размер объекта.
Пошагово передвигать можно не только объекты целиком. Можно редактировать отдельные сегменты графических фигур, перемещая их края и изменяя их очертания. Для этого, клавишами < и > мы выделяем нужный сегмент выбранной фигуры, и вносим в него изменения, используя клавиши со стрелочками в правой части клавиатуры. Изменения закрепляются нажатием на Пробел. Обычно для изменений в очертаниях контура используют указатель мыши, но мы с вами это уже обсуждали – для последующей анимации такой способ редактирования не очень хорош.
Передвигая графику дозировано, легко создать нехитрые движения гриба. Эта анимация сделана на пяти кадрах - https://yadi.sk/i/CF7NyMMpEmqRhQ
Не только одиночные объекты могут быть перемещены. Объекты могут перемещаться и группами, в зависимости от номера включённого ластика и номера той группы, в которую объекты входят. Вы видите – кнопка ластика активно используется и в этом режиме, хотя при рисовании её назначение совсем другое. Такая эргономика с использованием одних и тех же кнопок по разному назначению, оказывается в итоге удобной. К ней нужно привыкнуть, но зато и внешний вид, и расположение кнопок запоминается – их не приходится долго искать.
Между тем, основные команды, управляющие векторной графикой, расположены компактно – они находятся в строках выпадающего меню в левом верхнем углу окна рисунка. Если покажется, что это меню чем-то мешает, то рисунок всегда можно передвинуть вправо.
АНИМАЦИЯ
Также компактно, справа от верхней панели, расположено поле управления анимацией – панель АНИ. Эта панель вначале и не видна. Чтобы она появилась, нужно кликнуть по пустому месту справа от верхней панели.
Файлы bmp с рисунками кадров анимации находятся в папке 0 текущего каталога. Среди программистов бытует мнение, что кадры, при работе с анимацией, лучше располагать в оперативной памяти, а не на жёстком диске. Поскольку считывание больших рисунков требует некоторого времени, то чтение кадров с диска будет замедлять анимацию. Однако мой опыт показывает, что замедление это не столь существенно, и даже использование рисунков формата в два раза большего того, который может поместиться на экран ноутбука, вполне возможно.
Ещё раз подчеркну, я делал программу простую, в том плане, что средства, используемые ею, должны быть простыми, а не громоздкими. У меня имеется и первый вариант программы – MA_Paint, и вы можете скачать его, если захотите. Там тоже есть Help, и вы во всём разберётесь. Работа в этой программе идёт с 42-мя кадрами, находящимися в ОЗУ, а более длинные мультфильмы располагаются в нескольких папках. Удобно это или нет? В чём-то удобно, а в чём-то не очень. В конце концов, длинные мультфильмы всё равно читаются с диска. Возникающие во время смены папок паузы приходится вырезать. Если мы не хотим сделать «стоп-кадр» на этом месте.
Там нет векторной графики, зато есть некие «штучки» вроде морфинга, копирования дорожкой или движения объекта по заданной траектории. Обе программы в плане анимации совместимы между собой, поэтому некоторые фрагменты мультика можно делать и в MA_Paint.
В программе DM_Paint управлять анимацией существенно легче, а привлекая к этому делу векторную графику – работать особенно успешно.
Опять же, и для вектора, и для растра, и для их совмещения имеются «примочки». О них рассказывается в разделах Help «В помощь аниматору» и «Реконструкция записи». Наложение анимации на движущийся задний план, или Наложение одних кадров на другие с учётом прозрачности фона, или Копирование кадров анимации в обратном порядке – всё это в программе имеется.
Нет только перевода анимации в видеофайл. Но для этого я использую программу Free Cam – программа, позволяющая осуществлять видеозапись с экрана компьютера. Программа экспортирует результирующий файл долго, приходится подождать, но пользоваться ею в принципе удобно.
_____
О работе с панелью АНИ можно прочесть тут - http://proza.ru/2020/05/19/1989
ВИЗУАЛ БЕЙСИК КАК СРЕДА ДЛЯ РАЗРАБОТКИ ПРОЕКТА
Среда Визуал Бейсик оказалась очень подходящей для проекта художественного рисования по той причине, что в ней весь интерфейс создаётся в режиме онлайн, и он настолько разнообразен, что не нужно долго мучиться именно над этой задачей. Я был полностью сосредоточен на другом. Я стремился использовать возможности, которые предоставляет Бейсик, по полной программе. В частности, он позволяет чертить тонкими линиями в форме пунктиров и штрих-пунктиров, и я сделал соответствующие опции зачерчивания для фигур Безье. На иллюстрации вы можете видеть такую фигуру с красивым голубым зачерчиванием. То же относится и к заливкам – многоугольник (звезда) залит с использованием тонкого пунктира.
К сожалению, Визуал Бейсик, в его первоначальном варианте, уже не поддерживается разработчиками программного обеспечения. Они перешли на Бейсики новых вариантов и на Питон, однако и то, и другое, более рассчитано на профессионалов, и всё более удаляется от практики обычных инженеров, занимающихся прикладным программированием.
Оно понятно – новое программное обеспечение продаётся и приносит доход. А какой может быть доход, если каждый, вроде меня, как оказывается, может не покупать навороченных программ, а сделать по своему разумению программу свою собственную. И работающую ничуть не хуже, а в некоторых аспектах даже лучше, чем те, что продаются и покупаются.
__________
17.11.2020
скачать программу можно тут - http://yadi.sk/d/suZ-qnFu4YOdYw
и тут - http://cloud.mail.ru/public/2kUs/UMkHhsNL7