Apl Awan Kreatif Adobe Edge

• April 27, 2024

HTML5, JavaScript dan CSS3 telah menjadi hampir sama popular dengan Flash untuk mewujudkan animasi interaktif untuk web, tablet dan telefon. Adobe^R Edge Animate dan apl Edge lain adalah perisian yang mesra pengguna dengan banyak pratetap untuk memudahkan kerja anda.

Animasi garis masa masih menjadi cara yang paling popular untuk bernyawa dan Adobe menjadikannya mudah dengan jalur pergerakan Edge Edge yang baru, yang dapat meniru gerakan dunia sebenar dan dengan pelonggaran terbina dalam. Anda boleh menambah animasi sepanjang garis masa dengan butang Pin yang menambah penanda animasi pada garis masa atau dengan menyeret dan menggugurkan kedudukan objek di atas panggung yang Edge Animate secara automatik menukarkan kepada laluan gerakan. Anda juga boleh menggunakan butang Rekod yang menyenaraikan perubahan yang anda buat pada objek di atas panggung dan menukar perubahan ini menjadi animasi keyframe. Edge juga mempunyai versi panel Tindakan sendiri, yang tidak berselera dengan setiap tindakan yang mempunyai tab sendiri dalam panel. Menguji animasi anda adalah mudah dengan gabungan Adobe Edge dan penyemak imbas Google Chrome.

Sekiranya anda sudah biasa dengan animasi Flash, anda akan mendapati bahawa menambahkan interaktiviti di Edge menyerupai aliran kerja Flash di mana anda boleh menggunakan tempoh masa bersarang untuk setiap elemen animasi dan memohon coretan kod yang diprapasang untuk interaksi dan animasi yang paling biasa. Potongan kod ini mengendalikan kedua-dua animasi main balik seperti main, jeda, resume dan berhenti serta mencipta kawasan panas untuk tindakan butang asas seperti klik, hover dan bahkan hiperpautan. Untuk menambah kod tersuai pada coretan kod ini, anda boleh menaip terus ke dalam panel Tindakan. Sudah tentu, anda boleh memasukkan kod HTML5, JavaScript dan CSS3 anda sendiri dalam panel Actions. Kerana jenis pengaturcaraan web dan animasi sering bergantung pada Perpustakaan JavaScript luaran, anda juga boleh menambah pautan ke sumber luaran ini.

Animasi hanya sebahagian daripada apa yang boleh anda lakukan dengan kumpulan aplikasi Edge. Salah satu aspek yang paling penting dalam reka bentuk web ialah membuat laman web yang responsif atau fleksibel untuk semua jenis skrin dari desktop ke telefon bimbit. Ini dilakukan dengan pertanyaan media dan susun atur grid berasaskan peratusan, yang kedua-duanya adalah sebahagian daripada alat yang terdapat di Edge Reflow. Edge Reflow adalah persekitaran kerja WYSIWYG yang menghasilkan kod untuk projek anda. Kod ini adalah terkini untuk piawaian web terkini, terutama WebKit yang semakin disokong oleh segala-galanya dari halaman web ke pembaca ebook.

Membina susun atur di Edge Reflow adalah semudah melukis bekas div HTML ke grid dengan alat Peti dan kedudukan mutlak div ini membolehkan mereka mengubah saiz atau mengubah seperti yang diperlukan untuk setiap saiz skrin. Bagaimana ianya berfungsi? Rahsia itu adalah Pertanyaan Media yang boleh anda sesuaikan dalam Pengurus Kueri Media dengan menetapkan parameter minimum dan maksimum untuk tiga atau lebih resolusi skrin. Parameter ini akan menentukan apabila reka bentuk akan berubah naik atau turun untuk saiz skrin terdekat. Saya sangat suka penanda visual berkod warna untuk setiap saiz skrin di bahagian atas ruang kerja yang membantu anda memvisualisasikan apabila perubahan ini akan berlaku.

Salah satu ciri Edge yang menjimatkan masa adalah bagaimana anda boleh menggunakan semula gaya CSS3 tersuai anda dengan lebih banyak projek dan dengan itu mengekalkan gaya yang konsisten. Ini juga membuat pengemaskinian hampir automatik. Adobe telah menjadikan ini sebahagian daripada aliran kerja anda dengan panel Edge Styling Reflow. Untuk memastikan perkara-perkara tidak rapi, setiap gaya, seperti latar belakang atau sempadan, mempunyai bahagian sendiri. Anda boleh mengawal warna dan parameter lain, serta hierarki lapisan, secara langsung dari dalam tab ini. Gaya tersuai ini secara automatik ditukar menjadi peraturan gaya CSS, yang kemudiannya boleh disalin / dipadamkan untuk digunakan semula.

Pada masa lalu, untuk mempratonton halaman web anda, anda perlu menyimpan perubahan, beralih ke penyemak imbas web dan muat semula halaman. Adobe telah mengurangkan bilangan langkah ini dengan menggunakan gabungan Edge Inspect dan penyemak imbas Chrome. Sekarang anda boleh melihat bagaimana projek anda akan dipaparkan pada berbilang peranti dari desktop, tablet ke telefon bimbit. Salah satu ciri yang saya suka adalah keupayaan untuk mengambil tangkapan skrin pratonton ini untuk e-mel kepada pelanggan dan ahli pasukan atau gunakan pada Cloud Creative untuk kerjasama.

Akhirnya, bagi kita yang masih suka bekerja dengan kod mentah, Adobe mempunyai Kod Edge. Tingkap kod tidak rapi dengan hanya beberapa kawalan di sebelah kiri dan Kod Edge digabungkan dengan Google Chrome untuk memberi anda pratonton langsung. Apabila kod anda menjadi panjang dan tidak berguna, anda boleh mengetuk ke tahap elemen individu dengan menggunakan ciri Edit Pantas yang menyenaraikan semua gaya yang dilampirkan pada elemen dalam tetingkap tindanan. Oleh kerana apl Edge adalah sebahagian daripada Awan Kreatif, anda boleh menggunakan Font Web Adobe Font, Font Web Google dan fon Typekit secara langsung dari dalam Kod Edge. Kod Edge akan menjana tag skrip header yang menarik dalam font luaran.

Oleh kerana HTML5, JavaScript dan CSS3 cepat menggantikan teknik animasi yang lebih lama kerana populariti peranti mudah alih, aplikasi Edge bersepadu ini serta integrasi mereka dengan apl Adobe yang lain adalah generasi akan datang reka bentuk peranti dan aliran kerja pembangunan berganda.

Pendedahan: Saya tidak diberi pampasan kewangan untuk artikel ini. Adobe membekalkan keahlian Cloud Creative untuk tujuan semakan ini.Pendapat saya sendiri berdasarkan pengalaman saya.

Hak Cipta 2018 Adobe Systems Incorporated. Hak cipta terpelihara. Pukulan skrin produk Adobe (s) dicetak semula dengan kebenaran daripada Adobe Systems Incorporated. Adobe Photoshop, Photoshop Elements, Illustrator, InDesign, GoLive, Acrobat, Cue, Premiere Pro, Elemen Premiere, Bridge, After Effects, InCopy, Dreamweaver, Flash, ActionScript, Fireworks, Contribute, Captivate, Flash Catalyst and Flash Paper adalah sama ada [a] tanda dagangan berdaftar atau tanda dagangan Adobe Systems Incorporated di Amerika Syarikat dan / atau negara lain.

Arahan Video: Too Many of Me Animation in PowerPoint 2016 | Motion Graphics Tutorial (April 2024).