Можно ли использовать Animate Canvas для разработки красивых и качественных открыток?

[VladVlad]

Я делаю периодически открытки в теперь в программе Animate(ранее Flash). Несколько лет назад начал рисовать их на HTML5 (canvas). И в этом году столкнулся с проблемой, что нужно ждать в браузере какое-то время, чтобы она появилась. Это не нормально, что браузер уже запустился, а на странице пустота. В самой анимации все начинается с первого кадра, как обычно, если что. Таких проблем с технологией Flash (на flash-плейере, формат swf) все всегда быстро открывалось. Но, т.к. технология Flash умирает и скоро ее совсем не будет, поэтому нужно переходить на другой формат. Им казался формат HTML5.

Почитав статьи им разную информацию в интернете, точно не могу найти ответ на мои вопросы, но есть предположение, что формат HTML5 не полная замена Flash. И на нем только анимировать не сложные баннеры или какую-то другую анимацию с использовании максимум одной картинки, а все остальное должно быть в векторе. А также лучше не использовать в анимации альфа-канал (с полной прозрачности в полную непрозрачность). Но, для нормальной красивой сюжетной качественной открытки без задействования альфа-канала, причем практически во всех слоях, невозможно обойтись. Не представляю как это будет выглядеть, а точнее первые мои представления, что получится полная фигня. Анимация в стиле увеличения/уменьшения, движения слоев без появления из полной прозрачности не подходит, т.к. такая анимация, на мой взгляд, подходит больше баннерам. Для открытки, где все должно быть плавно, изящно, красиво без альфа-канал не обойтись. Особенно это касается новогодней открытки.

Также обычно материалы я готовлю в виде картинок, т.е. текст также сохраняю в виде картинки. В итоге, анимация состоит из анимации картинок с появлением из полной прозрачности в полную непрозрачность. Скриптами я практически не пользуюсь, т.к. по попросту я не программист и, если смогу найти исходники для Animate и подогнать их под мою анимацию, то могу использовать, но это очень редко. Я пробовал в той же анимации убирать анимацию прозрачности во всех слоях, но особого эффекта не давало. Пробовал уменьшить качество каждой картинки в библиотеке слоев и в настройках программы уменьшение общего качества изображений, но также безрезультатно. Тогда решил, что нужно съанимировать открытку полностью с нуля, где слои, которые у меня есть в векторном формате подготовить их векторными. В одном слое убрал эффект размытия и эта значительно уменьшило задержку при появлении в браузере. Текстовые слои сделал как текст. Правда пришлось отказаться от одного векторного слоя в формате Ai, т.к. он весил больше, чем формат png. После этого у меня возникло сомнение, уменьшит ли задержку использование векторных элементов взамен картинкам. Также я уменьшил общее качество картинок. В итоге, конечно задержка стала меньше, но все равно с небольшой задержкой, а на слабых компьютерах задержка больше, в смартфонах задержка очень большая. Кому-то я показывал открытку, и он отвечал, что в файле гигантское кол-во строк, но файл формируется автоматически, в программе Animate ты работаешь, в основном, с временной шкалой. Есть альтернативный вариант - я сохранил ролик в видео-формат mp4. Он везде открывается быстро, но качеством видео тоже пришлось пожертвовать. чтобы файл много не весил. Но, отличе его от flash или html5, в том, что если есть внутренняя анимация, то когда анимация на основной шкале заканчивается и ты ставишь stop, то внутренняя будет проигрываться дальше до бесконечности - это плюс. Также есть кнопка "Повторить", которая возвращает в начало основной анимации и анимация снова проигрывается. В видео-формате, когда видео заканчивается вся анимация останавливается и по-другому и быть не может, т.к. это другой формат. Можно добавить еще физически на временной шкале еще какое-то время, чтобы в конце анимации ничего не заканчивалось, а продолжалось какое-то время и это в свою очередь приводит к увеличению объема файла и в этом случае, либо оставлять нужное качество видео с еще большим размером файла, либо еще жертвовать качеством видео, чтобы привести размер файла был оптимальным. В конечном счете, когда делаешь открытку для клиентов хочется, чтобы она быстро открывалась, проигрывалась и само качество анимации, изображений в ней или видео было пускай не отличным, но хорошим. А открытки, в основном делаются для клиентов.

Вот и возникает вопрос, может быть для анимации открыток, где обязательно должна присутствовать анимация из полной прозрачности, использовать какой-то другой продукт. Используют для разработки открыток программу After Effect. Если я правильно понимаю, то все новогодние, весенние и др. футажи разрабатываются в программе After Effect, причем, видео будет в очень хорошем качестве, даже если его увеличить и будет открываться без задержек и не зависать/притормаживать в процессе проигрывания. Но формат вывода будет уже не html5, а mp4, если хочешь залить открытку на сайт.

Есть еще программа Google Web Designer, но правильно я пониманию, что она предназначена для разработки простых анимаций типа рекламных баннеров, т.к. сохраняется в формат html5.