Hype 1.0.3 memungkinkan Anda membuat animasi HTML 5 tanpa coding

click fraud protection

Dengan Tumult's Hype 1.0.3, Anda dapat membuat animasi HTML 5 interaktif tanpa mengetik satu baris kode pun. Ini cukup sederhana untuk digunakan bahkan pemula pun akan mendapatkan hasil yang terlihat bagus dengan cepat, meskipun masih ada ruang untuk perbaikan. Alat desain yang terbatas dan antarmuka yang tidak fleksibel dapat mengganggu proyek pembangunan yang kompleks.

Rancang adegan Anda

Proyek hype terdiri dari satu atau lebih adegan, yang berfungsi seperti slide dalam presentasi Keynote. Adegan dapat berisi teks, gambar, video, dan elemen lainnya, meskipun pengimporan file audio belum didukung. Sangat mudah untuk mengatur dan menyesuaikan elemen dengan tepat berkat panduan snap-to dan perintah penyelarasan otomatis. Hype's Inspector memungkinkan Anda menyempurnakan properti seperti sudut, warna, dan opacity sambil mengingatkan Anda akan potensi ketidakcocokan dengan daftar browser yang dapat disesuaikan saat Anda bekerja.

Alat desain seperti iWork Hype mudah digunakan, tetapi tidak memiliki banyak fitur yang sudah dikenal. Elemen tidak dapat dikunci pada tempatnya atau dikelompokkan, dan kotak adalah satu-satunya bentuk bawaan yang tersedia untuk ditambahkan ke pemandangan (walaupun dapat disesuaikan untuk membentuk aturan atau lingkaran). Tidak ada menu kontekstual, tidak ada alat pengeditan gambar atau masking, dan tidak ada cara untuk memperbesar atau memperkecil tampilan ruang kerja Anda, sehingga sulit untuk membuat dokumen besar di Mac dengan layar kecil. Masalah-masalah ini belum tentu merupakan pemecah masalah, tetapi merupakan kelalaian yang tidak menguntungkan dalam aplikasi yang dipoles.

Menambahkan gerak dan interaktivitas

Untuk menganimasikan elemen, Anda memilih satu atau lebih propertinya (posisi, misalnya), lalu menambahkan kerangka kunci mulai dan berhenti ke garis waktu Hype dan membuat status berbeda di setiap titik. Hype menciptakan bingkai "di antara" untuk Anda. Fitur rekaman praktis menyederhanakan proses dengan memantau tindakan Anda dan secara otomatis membuat bingkai utama dan mengubah properti dengan cepat. Anda juga dapat membuat beberapa animasi untuk memberikan tampilan berbeda pada elemen dalam adegan animasi, seperti gambar yang bersinar atau memudar saat diarahkan mouse. Animasi, transisi adegan (dengan efek larut atau dorong opsional), dan bahkan tindakan JavaScript dapat terjadi secara otomatis, atau sebagai respons terhadap aktivitas pengguna seperti klik mouse, overs mouse, dan tombol menekan. Anda dapat mempratinjau proyek di Hype atau browser Anda kapan saja untuk melihat dengan tepat bagaimana animasi akan muncul.

Untuk menyempurnakan waktu proyek, keyframe dapat diposisikan ulang secara bebas, dan animasi di antaranya diperpanjang atau diperpendek, di timeline. Mengklik dua kali animasi di sana memungkinkan Anda memasukkan waktu mulai keyframe yang tepat, mengatur durasi animasi, dan memilih apakah animasi masuk atau keluar saat diputar. Namun, mengelola banyak animasi dalam garis waktu bisa jadi sulit dalam proyek dengan banyak elemen. Properti elemen muncul dalam daftar di samping garis waktu, dan melihat banyak di antaranya secara bersamaan mengharuskan Anda memiliki layar besar—itu atau Anda harus memperbesar panel garis waktu, mengaburkan ruang kerja Anda. Elemen dapat diseret lebih dekat satu sama lain dalam daftar untuk perbandingan yang lebih mudah, tetapi hal itu juga memengaruhi apakah elemen tersebut muncul di atas atau di bawah elemen lain dalam pemandangan.

Hype dapat membuat animasi untuk situs yang sudah ada, tetapi Anda juga dapat menggunakannya untuk membangun situs web mandiri yang berorientasi visual.

Ekspor dan bagikan

Saat proyek Anda selesai, Anda dapat mengekspornya ke folder publik Dropbox Anda untuk berbagi dengan dunia, atau ke folder dokumen dan sumber daya HTML 5. Ini dapat ditambahkan ke situs yang ada dengan memilih beberapa baris kode yang ditandai dengan jelas dari file HTML yang diekspor, menempelkannya ke dalam dokumen HTML yang ada, lalu mengunggah sumber daya. Pemeriksaan kompatibilitas opsional saat ekspor memungkinkan Anda mengetahui browser mana, jika ada, yang akan mengalami masalah dalam memainkan proyek akhir Anda.

Ini dia situs yang saya buat dengan Hype, diekspor ke Dropbox.

Saran pembelian Macworld

Terlepas dari penghilangan dan keterbatasan fitur, Hype 1.0.3 memudahkan dan bahkan menyenangkan untuk membuat animasi Web HTML 5 atau seluruh situs. Tetapi pengguna yang mencari alat desain yang kuat harus menunggu untuk melihat pembaruan apa yang akan datang.

[Adam Berenstain adalah seorang penulis lepas di bagian utara New York.]

  • Apr 19, 2023
  • 40
  • 0
instagram story viewer