Не удается преобразовать анимацию Flash в HTML5 в Animate CC2017

[vladas1983]

Здравствуйте! Занимаюсь созданием открыток на Flash и сохраняю их в формате swf на сайте. Сейчас возникла необходимость сохранять из в HTML5 Canvas, т.к. не все пользователи понимают, как установить или включить Flash. Хотел для начала понять, есть ли какие-то ограничения по сравнению с Flash? Все ли возможно и в должном виде? Переконвертировать из Flash в HTML5. HTML5 Canvas предназначена, в основном, для простых баннеров и открыток или можно делать насыщенную анимацию с различными скриптами (AS3)?

Спрашиваю потому, что есть, например, новогодняя открытка, где много анимации, в том числе вложенной, подвложенной и т.д. Есть анимация с наложением различных эффектов (свечения, размытия, смены цветового тона и т.д.). Есть маски. Есть скрипт падающего снега, есть скрипт анимации дыма. Присутствует звуковое сопровождение. Есть кнопки возврата к началу анимации и перехода по ссылке. При конвертировании (через Меню - Команды - Преобразовать в другой тип документа - Преобразовать документ в HTML5 Canvas). Выдается много ошибок. В итоге, все эффекты удаляются. Картинки некачественные (как в gif-формате), весь код AS3, в основном, не работает. т.е. stop(); не работает, кнопки не работают. Анимация дыма есть, но без нужного эффекта размытия. Падающего, снега вообще нет. Маски не работают.

Ссылка на исходник
Открытка.zip

По поводу того, что не работает код AS3 теоритечески понятно, т.к. для HTML5 Canvas код будет другим, но при конвертировании он должен его преобразовать в код для HTM5. Или я не совсем понимаю и нужно потом, вручную везде менять код на HTML5. А по какой причине удаляются все эффекты? Как картинкам сделать исходное хорошее качество? Как восстановить скрипт снега.

У меня два варианта.
Либо, я как-то не совсем верно конвертирую и нужно особым образом настроить публикацию после конвертации, чтобы все идеально работало, так же как на flash-открытке и не нужно было глубоко копать и смотреть все поэлементно и послойно, включая AS3. Либо, все не так просто и нужно после возится с каждым элементом, слоем, AS3, где есть проблемы. Я правда не совсем уверен том, что все удастся восстановить и в должном виде, даже повозившись, поэтому в начале письма спрашивал про ограничения HTML5 Canvas. Особенно переживаю за снег, т.к. он не работает полностью. Вручную изменить под HTML5 я не смогу, т.к. я не программист и все скрипты ищу в интернете и подгоняю под анимацию. Меняю какие-то визуальные моменты (фигуры, анимацию и т.д.). С цифрами в коде AS3 тоже можно поиграть, чтобы настроить, например, кол-во, размеры, скорость, направление и т.д., если все это запрограммировано.

Возможно, правильнее, рисовать такую анимацию с нуля, но опять же не уверен в том, что можно сделать все также, как и во flash-анимации и использовать все нужные скрипты (лучше те, что использовались).

 

[qsedftghk]

...но при конвертировании он должен его преобразовать в код для HTM5.

Никто никому ничего не должен. При конвертировании AS3 код тупо комментиться и всё.
В html5 весь код, сделанный на AS3, нужно переписывать на JS. Adobe - кол в одно место, потому что Animate CC - это лишь затычка, но, увы, ему далеко еще до нормального HTML5 редактора

 

[qsedftghk]

Самое печальное в Animate CC, касаясь вопроса HTML5 - это хелп. Если раньше, дизайнер (прошу заметить не программер), почитав F1, реально мог отдуплить как работать и писать на AS2-AS3, то сейчас - это боль. Необходимо лазить по всему инету, выцепляя кусочки знаний. Этот CreateJS... гыгы, зайдите на его сайт... Где там примеры? Где там вменяемое объяснение как это заставить работать вкупе с твоими мувиками, сделанными в Animate? Одна лишь объектная модель, и то через одно место показанная, не для простых смертных.
Например, в HTML5 работают все режимы наложения (Multiplay и т.п.), но это если делать не в Animate, а ручками. В Animate, все ваши эффекты "свечения", режимы наложение и т.п. - просто тупо не будут работать в конечном ролике, хотя в редакторе вроде и всё ок. Вот вам и HTML5 от Adobe.
Флеш был в разы доступнее и понятнее и даже на данный момент мощнее. Ибо в 35КБ можно такого запихнуть, и ничего особо проц вешать не будет, а в HTML5. гыгы
Вот вам от меня новогодняя офисная лабуда (делал от нечего делать как раз в Animate) , - тормозит капец как на слабых компах... А во флеше ничего бы не тормозило...
Эх... Я плакаю. А главное, что никакого развития за весь год этого Animate. Так... По мелочи...
Но, надо отдать должное, что кроме Animate ничего вменяемого на рынке вообще нету. Про гугловкие редакторы я молчу, это вообще нечто.

 

[qsedftghk]

Резюмируя всё выше сказанное: переделка флешки в HTML5 - нетривиальная задача, особенно, если флешка содержит не простой код на AS3 (Я уж молчу, про AS2, который может быть еще и расположен в разных кадрах ролика). И очень печально, что на данный момент времени, вменяемых книг, хелпов и форумов по HTML5 в Animate CC нет. В основном - это хипстерские видеоуроки как нарисовать какую-нибудь лабуду в Animate (но тот, кто рисовал во Флеше, уж, ясень пень, нарисует и в Animate, гыгы, редактор-то не изменился). А вот как кодить, не какое-то там "gotoAndPlay", а что-то реально "вкусное" это ещё поискать и мозг поломать нужно.

 

[vladas1983]

Из всех ответов, которые пока здесь появились, я пониманию, что преобразовать в нужном виде не удастся.
Я пробовал создать анимации в новом ролике HTML5 Canvas с различными эффектами (свечениями, размытиями, цветовыми эффектами). И они не работают.
Вставлял градиентную картинку jpg и делал ее анимацию от прозрачного до полного непрозрачного и выходит какая-то графическая ерунда, даже при качестве jpg 100%.
Если это не получается, то какой же смысл в этом HTML5 редакторе Animate.
Скачал пример баннера, и не совсем понял, почему у него в библиотеке нет элементов анимации. При создании любой анимации создается элемент анимации, при удалении которого из библиотеки, анимация не будет работать.
Может быть что-то я не так делаю. Неужели нельзя пользоваться эффектами, тогда зачем их настройки видны и активны?
Также попробовал различные AS3 скрипты со снегом и т.д. Работает только бенгальский огонь, причем идеально, который написан на AS2, он и на AS3 работает, что странно. Выходит, что нельзя преобразовать в HTML5 даже готовые анимации и скрипты, которые делали другие люди и выкладывали на сайта исходники.

Почему в интернете пишут, что HTML5 вытесняет Flash, если он такой ограниченный в плане дизайна эффектов и классной анимации, которую можно сделать на Flash.

Есть еще программа от Гугл. Она такая же ограниченная по возможностям или вообще относится ко всему понятию HTML5, что пока он не способен полноценно создать качественную классную анимацию.

Выходит, чтобы решить проблему с запуском flash в браузерах пока оптимально сохранять в mp4 формате (только сначала из flash в mov, а потом, например, через Premiere Pro сохранить в mp4?

 

[_MBK_]

Почему в интернете пишут, что HTML5 вытесняет Flash, если он такой ограниченный в плане дизайна эффектов и классной анимации, которую можно сделать на Flash.

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

 

[vladas1983]

Все таки из того, что я говорил про невозможность добавления эффектов и т.д. действительно невозможно сделать или я что-то не так делаю и какие-то эффекты можно сделать и как. Почему стандартным образом, как обычно это делается на flash они работают, а на HTML5 Canvas-шаблоне они не работают. Хотя, при этом в свойствах анимации можно эти свойства добавить. Пробовал сделать маску в новом файле и она работает, но когда я ее преобразовывал flash в HTML5, то маски тоже удаляются, хотя сделаны обычным образом. Маска - это маска, как ее по-другому можно сделать? Ил из-за большого кол-ва масок, программа радии уменьшения размера файла их игнорирует.

 

[~RA~]

Почему в интернете пишут, что HTML5 вытесняет Flash

Потому что OpenNews: Adobe прекращает поддержку Flash

 

[qsedftghk]

Почему стандартным образом, как обычно это делается на flash они работают, а на HTML5 Canvas-шаблоне они не работают. Хотя, при этом в свойствах анимации можно эти свойства добавить.

Потому что Animate CC не только для HTML5, но и для Flash. Во flash-шаблонах всё будет работать как надо. А для HTML5 -шаблонов пока эти фичи не задействованы. Они есть, но их нет.