Figma Motion logo

Figma Motion.

Desain Anda langsung hidup sejak hari pertama

Buat animasi langsung di canvas Figma. Motion menyatu dengan komponen dan variabel—desain hidup dari hari pertama.

Peringkat Mingguan
▲ #13
Suara
286
Platform
Web / Mobile
Diluncurkan
Recently
Figma Motion screenshot

Lebih Lanjut Tentang Figma Motion

Figma Motion

Figma Motion adalah fitur animasi yang mengintegrasikan timeline langsung ke kanvas desain, memungkinkan tim untuk membuat, mengelola, dan mengirimkan animasi dalam satu file yang sama tanpa perlu beralih ke alat eksternal. Dengan kemampuan untuk membuat sistem motion yang konsisten dan handoff yang mulus ke pengembang, Figma Motion menghilangkan hambatan tradisional dalam proses desain animasi.

Sorotan Produk

  • Timeline Terpadu: Kontrol penuh atas keyframe, posisi, skala, rotasi, dan opasitas langsung di kanvas yang sama dengan desain Anda, dengan kemampuan scrub dan preview real-time.
  • Komponen Animasi: Animasi yang dibuat untuk komponen akan mengikutinya ke setiap file dan layar, memungkinkan sistem desain motion yang konsisten di seluruh organisasi.
  • Variabel Motion: Buat variabel easing dengan beberapa mode dan terapkan di seluruh animasi, dengan kemampuan update global hanya dengan satu perubahan.
  • Figma Agent untuk Motion: Asisten AI yang membangun keyframe otomatis berdasarkan deskripsi teks, membantu desainer pemula maupun berpengalaman untuk bekerja lebih efisien.
  • Export & Handoff Developer: Ekspor langsung ke MP4, GIF, SVG, atau WEBM, serta salin kode animasi dalam CSS, JSON, React, atau motion.dev dari Dev Mode.
  • Komentar Berbasis Waktu: Tim dapat memberikan feedback pada momen spesifik dalam timeline, mempermudah review dan kolaborasi.

Kasus Penggunaan

  • Desain Sistem Interaktif: Bangun library komponen animasi yang dapat digunakan kembali, memastikan konsistensi motion di seluruh produk dan tim.
  • Prototipe Beranimasi Tinggi: Buat prototipe yang menyerupai produk final dengan animasi halus untuk pengujian pengguna dan presentasi stakeholder.
  • Ilustrasi Animasi: Tambahkan kehidupan pada ilustrasi produk dengan animasi yang mudah dikelola dan dapat dipublikasikan sebagai library.
  • Handoff Developer yang Akurat: Pastikan animasi yang dikirim sesuai dengan desain dengan kode yang dapat langsung diinspeksi dan disalin oleh pengembang.
  • Eksplorasi Cepat dengan AI: Gunakan Figma Agent untuk bereksperimen dengan berbagai konsep animasi tanpa mempelajari alat animasi yang kompleks.

Target Audiens

Figma Motion ditujukan untuk desainer produk, motion designer, dan tim desain yang ingin mengintegrasikan animasi ke dalam workflow mereka tanpa hambatan teknis, serta organisasi yang membangun design system komprehensif yang mencakup interaksi dan motion.