Sebulan dengan Animate CC


Penjelasan pengalaman saya pindah dari Flash ke Animate CC dan membuat spanduk dalam format HTML5 mahakuasa. Banyak gambar di bawah potongan

Sedikit perjalanan dan istilah bersejarah


Secara pribadi, saya sendiri telah terbiasa dengan Flash selama lebih dari 10 tahun dan memiliki sedikit gagasan tentang bagaimana teknologi ini bekerja “dari dalam”.

Selama kira-kira jumlah yang sama tahun saya telah membuat situs web, termasuk dalam bahasa HTML5 "modern", yang, seperti yang mereka katakan, dapat melakukan segalanya. Tidak, sungguh, kadang-kadang desainer keras kepala mengirim antarmuka seperti itu yang tidak ada di alam, mereka harus diciptakan, bersembunyi di balik kalimat "Anda bisa menulis semuanya dalam HTML5!"

Saya tidak berpura-pura dengan nilai artistik khusus dari kreasi saya, tetapi jumlah spanduk yang saya buat telah melebihi seribu, dan saya terus menggambarnya hampir setiap hari.

Selama 5 tahun terakhir, flash tidak hanya menendang malas, dan, tidak benar-benar memahami masalah ini. Secara pribadi, saya belum pernah melihat rem atau lubang, dan bahkan tentang pernyataan pertama dari Steve Jobs bahwa "Flash tidak diasah oleh jari" - ini benar-benar konyol. Alasan paling jelas Apple menentang flash pada iPhone terletak di permukaan, tapi itu bukan tentang itu sekarang.

Kami sedang mendekati denouement of terminology. HTML adalah bahasa markup untuk teks dan tata letak elemen pada halaman. Dia tidak tahu bagaimana melakukan tindakan sendiri. Alih-alih Flash, mereka biasanya berarti "inovasi HTML5": memutar video tanpa Flash, animasi tanpa Flash, multi-loading file tanpa Flash, dan beberapa hal lainnya.

Terlepas dari pujian yang terdengar di mana-mana, sejauh ini tidak ada editor animasi yang waras muncul di HTML5 "mahakuasa", sementara Adobe belum mengonversi Flash CC ke Animate CC, menambahkan, pada kenyataannya, hanya ekspor ke HTML5.

Antarmuka


Antarmuka Animate CC itu sendiri tidak berbeda dengan Flash, tidak seperti Edge Animate, yang sangat tidak biasa. Tidak ada lagi yang bisa dikatakan, dan saya tidak melihat perbedaan dengan CS6, yang saya gunakan untuk waktu yang lama. Untuk spanduk, AS3 tidak diperlukan, dan ini adalah versi terbaru yang mendukung AS2. Konverter Swiffy yang dibuat Google hanya berteman dengan AS2.

* AS2,3 adalah bahasa pemrograman Action Script yang dibangun ke dalam Flash yang memungkinkan Anda untuk membuat seluruh komponen non-animasi film - sehingga tombol-tombol ditekan, film berhenti di frame yang tepat, sehingga informasi dapat dibaca, dan skrip interaktif untuk berinteraksi dengan film dapat diluncurkan. Sebenarnya, ini adalah bahasa yang cukup kuat, dan saya hanya menggunakan 0,000001% fungsinya.

Mesin rendering


Tentu saja, benda-benda itu sendiri tidak dapat bergerak di dalam roller, untuk ini perlu bahwa beberapa mesin harus bergerak, menunjukkan dan menyembunyikannya. Animate CC menggunakan CreateJS untuk proyek bergaya Kanvas HTML5, yang menyambut setiap proyek baru dengan peringatan yang luar biasa. Senang diingatkan. Rupanya, ini adalah tugas yang tidak realistis - untuk mengambil satu per satu dari bingkai yang ingin Anda tuju.

:
EaselJS 0, 1. , gotoAndStop gotoAndPlay.




Garis waktu dan ruang kerja


Karena antarmuka belum mengalami perubahan bagi saya semuanya di sini benar-benar standar. Tidak ada perbedaan. Karena sistem dikonfigurasikan dalam bahasa Rusia, paket versi Rusia diunduh. Ini tidak terlalu mengganggu saya, karena saya menggunakan tombol cepat, meskipun kadang-kadang saya menggantung pada apa yang perlu saya pilih dari menu.



Sekarang mari kita beralih ke apa yang saya selalu gunakan:

Filter standar dalam Flash


Filter adalah salah satu komponen yang paling sering dari setiap spanduk, mereka memungkinkan Anda untuk dengan cepat mencapai hasil yang diinginkan. Saya akan mempertimbangkan 3 filter yang sering saya gunakan. Dalam sekejap, filter adalah bagian dari standar, dan dalam pekerjaan saya, itu tidak berdampak pada kinerja, dan pada prinsipnya tidak bisa. Selanjutnya saya akan menggunakan ekspor ke GIF untuk memahami perbedaannya

Bayangan


Bayangan adalah salah satu opsi termudah untuk membuat bagian spanduk lebih besar dan fokus pada blok yang tepat. Tentu, saya mengambil bayangan terlalu kuat untuk menggambarkan perbedaan
dibandingkan:
FlashBuat

Ya, animasi bayangan tidak mungkin. Apalagi, jika videonya lebih panjang dari yang saya kirimkan untuk tes, bayangan berubah menjadi hal yang tidak diketahui.
Perlu juga disebutkan di sini bahwa dalam editor dan html5 selesai, bayangan (dan memang semua efeknya) terlihat sangat berbeda.
EditorHasil

Saat mengekspor dalam jejak, Anda dapat melihat tulisan berikut:
, , . (4)
Ya, terima kasih atas setidaknya peringatan ...

Kinerja spanduk dengan bayangan meninggalkan banyak hal yang diinginkan, tetapi mereka memperingatkan. Menghapus bayangan dari media ini, saya mengurangi beban hingga 40%. Flash melukis semua ini dengan 23% dari beban bersama dengan bayangan, tentu saja



Bersinar


Salah satu cara termudah untuk menyorot teks pada latar belakang beraneka ragam adalah dengan menambahkan goresan padanya, ini cukup dilakukan dengan menggunakan cahaya dengan persentase intensitas tinggi.
FlashBuat

Pada saat yang sama, editornya masih sama, "Visibilitasnya nol, saya berjalan menggunakan perangkat":



Ada satu solusi yang mungkin untuk masalah ini, jika perlu, saya akan membagikannya, substrat surat digunakan sangat sering dan Anda tidak bisa hidup tanpanya.

Selain itu, cahaya itu tidak hanya goresan huruf, tetapi hasilnya mengisyaratkan bahwa itu tidak akan terjadi
FlashBuatDi editor


Kabur


Tidak ada komentar Blur hanya tersedia untuk objek statis, jadi menggunakan filter ini untuk tampilan teks tidak mungkin
FlashBuat


Bagaimana gangguan di atas bisa ada dengan penetrasi luas dari filter dan filter SVG yang sama di CSS - Saya tidak bisa membayangkan.

Masalah ekspor dan pengemasan


Semua orang terbiasa dengan fakta bahwa klip dalam flash adalah file yang lengkap. Ekspor HTML5 menghasilkan banyak file, bukan satu. Proyek Swiffy, yang diciptakan oleh Google untuk mengonversi SWF ke HTML, mengemas semuanya dalam satu file HTML. Rupanya, tugas ini merupakan beban yang luar biasa bagi pencipta Animate CC. Anda dapat membaca artikel terperinci tentang menjejalkan "segalanya" di dalam satu file untuk Doubleclick di sini . Saya membuat konverter saya dengan cepat, menghalangi pembangunan sepasang fungsi di php, tetapi masih jauh dari ideal, bahkan konsep. Memecahkan tugas saya - dan oke.

Spanduk karet


Secara default, Animate tampaknya mendukung "kenyal" spanduk, tetapi biasanya spanduk karet berarti spanduk yang merentang secara horizontal, dan tidak proporsional di sepanjang kedua sumbu. Dalam templat ekspor, ini disebut penskalaan responsif, dan dalam kasus spanduk yang hanya membentang di sepanjang sumbu X, ini menyebabkan gangguan lucu hingga saya memotongnya dari templat tersebut.



Secara umum, Anda dapat benar-benar meninggalkan ide meregangkan spanduk, cukup ambil ukuran maksimum tempat spanduk, dan tentukan lebar klip sama dengan ukuran minimum tempat spanduk dan potong bagian tanaman menggunakan limpahan: disembunyikan, lalu pusatkan elemen CANVAS (menunjukkan lebarnya sama dengan ukuran maksimum tempat spanduk) dengan garis horizontal di dalam tautan, yang menempati 100% dari lebar, bahkan lebih sederhana di sini daripada di FLASH dan tidak memerlukan skrip tambahan di dalam video, hanya css.


Total


Anda bisa hidup, Anda bisa menggunakan, Anda tidak bisa menahan rem. Pembatasan diperkenalkan untuk klien utama saya dengan mensubkontrakkan - tidak lebih dari 5 adegan per spanduk, jika tidak semuanya mulai melambat secara liar di situs berita besar dengan banyak tempat spanduk. Flash telah diambil untuk waktu yang sangat lama dan sangat cepat dengan kartu video dalam bentuk apa pun, dan Holy Grail dalam bentuk singkatan magis HTML5 dan CSS3 sejauh ini dibuat dari kertas-kertas dalam hal animasi dan elemen interaktif. Termasuk, pada perangkat seluler tempat Flash seharusnya dikubur, kinerja video tersebut menimbulkan keraguan serius. Tidak ada satu standar pun yang akan sobek sampai flashdisk akhirnya dikubur.

Source: https://habr.com/ru/post/id397131/


All Articles