Desain
29 Agu 2025
FramerFramer loop fitur untuk membuat ikon animasi
FramerFramer의 새로운 루프 기능을 통해 간단하게 애니메이션 아이콘을 제작할 수 있습니다. 이 기능은 애니메이션을 무한히 반복하게 하여 매력적인 아이콘을 손쉽게 만들도록 도와줍니다.
Diposting oleh
Diterjemahkan oleh
Daftar Isi
Daftar Isi
Dokumen ini disusun untuk mengatasi kesulitan yang dialami pengguna domestik dalam mempelajari FramerFramer akibat kurangnya materi berbahasa Indonesia dengan menerjemahkan konten blog resmi dan menambahkan informasi bermanfaat untuk aplikasi praktis. Kami berharap ini dapat memberikan sedikit bantuan bagi Anda yang menggunakan FramerFramer.
Jika Anda menyukai animasi, Anda pasti senang mendengar tentang pembaruan fitur Loop yang baru saja dirilis oleh FramerFramer. Dengan memanfaatkan fitur ini, Anda bisa membuat animasi yang berulang tanpa henti dengan sangat mudah. Dalam tutorial ini, kami akan memperkenalkan cara membuat 3 ikon animasi menggunakan fitur loop baru dari FramerFramer.
Persiapan
Untuk membuat ikon animasi, FramerFramer harus diinstal di komputer Anda. Dapat diunduh dari situs resmi, dan pemahaman dasar tentang penggunaan alat desain dan animasi FramerFramer diperlukan.
Memulai
Setelah instalasi FramerFramer selesai, mulailah proyek baru.
Selanjutnya, buat frame baru untuk menempatkan ikon.
Tambahkan tiga bentuk ke dalam frame dan posisikan sesuai keinginan. (Dalam tutorial ini, kami akan menggunakan lingkaran, persegi, dan segitiga sebagai contoh.)
Membuat Animasi
Setelah penempatan bentuk selesai, mari kita buat animasinya.
Pilih frame dari bentuk pertama, lalu pindah ke panel animasi di sebelah kanan.
Klik '
Effects' lalu pilih putar ulang (Loop). (Dengan cara ini, animasi akan berulang terus menerus)Atur properti animasi yang diinginkan di dalam panel. Sebagai contoh, menerapkan animasi pada properti penyesuaian ukuran (
Scale) dapat menghasilkan efek bentuk yang meloncat.
Menambahkan Interaksi
Untuk membuat ikon animasi lebih hidup, mari kita tambahkan fungsi interaksi. Pilih salah satu bentuk dan atur pemicu interaksi yang diinginkan. FramerFramer menawarkan berbagai opsi seperti klik (Press), melayang (Hover), seret (Drag), dan lainnya.
Dalam contoh ini, kami akan menggunakan interaksi klik untuk memutar dan menghentikan animasi.
Penyelesaian
Berkat fitur loop baru dari FramerFramer, Anda sekarang bisa dengan mudah membuat ikon animasi yang menarik tanpa pengaturan yang rumit. Berdasarkan panduan ini, buatlah ikon Anda sendiri dan tambahkan interaksi untuk menciptakan ikon animasi Loop yang unik.
Lihat proyek efek dan remix
Artikel ini diadaptasi dan diterjemahkan dari ‘Creating animated icons with Framer’s loop functionality’ dari blog resmi FramerFramer.
