Ada sejuta cara untuk membuat presentasi, tetapi Figma adalah alat yang diremehkan untuk itu. Fitur prototipe di Figma memungkinkan banyak opsi transisi yang dapat disesuaikan. Transisi Anda tidak hanya akan memukau audiens Anda, tetapi Anda dapat memasukkan plugin untuk pizazz ekstra dan membuat audiens Anda tetap terlibat, membuat Anda merasa percaya diri dengan keterampilan Anda.
Kami akan menunjukkan kepada Anda bagaimana membuat presentasi yang mematikan menggunakan Figma; ikuti saja panduan ini.
1. Siapkan Bingkai Presentasi Pertama Anda
Membuka gambar dan klik File desain baru. Klik Alat Bingkai (F) untuk menggambar bingkai Anda atau untuk memilih bingkai prasetel di sebelah kanan menggunakan Presentasi > Geser 16:9. Kamu bisa buat template induk untuk menghemat waktu.
Ubah nama bingkai Anda dengan mengklik dua kali judul biru di kiri atas. Mengatur warna latar belakang; meskipun, Anda selalu dapat mengubahnya nanti dengan menyorot semua bingkai dan mengubah warna isian.
2. Tambahkan Teks Judul
Menggunakan Alat Teks (T) dan tulis judul Anda. Gunakan kotak teks terpisah untuk baris terpisah, dengan hanya satu atau dua kata per baris. Atur preferensi teks Anda di Teks menu di sebelah kanan. Figma menggunakan font Google, jadi Anda mungkin ingin tahu pasangan font Google terbaik.
3. Tambahkan Gambar
Kamu bisa gunakan foto stok atau ambil foto Anda sendiri yang relevan. Untuk menambahkan gambar, gambarlah persegi panjang menggunakan Alat persegi panjang (R). Gambar Anda akan berada dalam bentuk ini.
Klik persegi panjang dan pergi ke Mengisi dan klik kotak berwarna. Lalu klik Padat > Gambar > Pilih gambar. Temukan gambar Anda dan klik Membuka. Arahkan kursor ke gambar untuk mengungkapkan 4 lingkaran putih. Klik dan seret satu lingkaran ke dalam untuk membulatkan sudut gambar Anda.
Atur layer Anda sehingga gambar berada di belakang dan teks berada di layer atas. Anda dapat menyeret lapisan di panel lapisan atau dengan menggunakan Cmd/Ctrl + [ untuk mengirim lapisan kembali atau Cmd/Ctrl + ] untuk membawa lapisan ke depan.
4. Buat Transisi Pertama
Transisi pertama akan membuka gambar dan memungkinkan teks judul meluncur ke dalam bingkai. Pertama, duplikat bingkai pertama dengan memilihnya dan tekan Cmd/Ctrl + D untuk menggandakannya.
Di bingkai sebelah kiri, perkecil gambar dengan mengurangi atribut ketinggian di H kotak menjadi sekitar 150, meninggalkan celah horizontal pada gambar. Ratakan tengah dengan memilih kedua gambar di seluruh bingkai dan mengklik HAIpion + V (Mac) atau Alt + V (jendela).
Untuk menyelesaikan transisi gambar, pilih gambar sebelah kiri. Kemudian ubah kegelapan ke 0% di menu sebelah kanan di kotak di sebelah Pass Through di bawah Layer. Ini akan membuat gambar tidak terlihat sebelum transisi dan terbuka.
Klik kotak teks pertama dan tahan Menggeser. Mulai seret, lalu tahan juga Spasi dan lanjutkan menyeret teks keluar dari bingkai. Sepertinya menghilang begitu keluar dari bingkai. Tanpa penambahan spasi, transisi ini tidak akan berfungsi, tetapi jika Anda menahan spasi sebelum menyeret, itu hanya akan memindahkan bingkai Anda.
Lakukan ini lagi untuk kotak teks kedua atau berikutnya, tetapi seret sedikit lebih jauh ke kiri untuk menambahkan beberapa variasi dalam transisi. Dengan teks masih dipilih, kurangi opacity layer menjadi 0% dengan cara yang sama seperti yang Anda lakukan sebelumnya untuk gambar.
Untuk mengatur transisi, buka Prototipe. Pilih bingkai sebelah kiri dan klik tombol lingkaran biru yang muncul di tengah sisi kanan bingkai. Seret, sehingga garis menuju ke bingkai kedua Anda.
Dalam drop-down yang mengatakan Instan, Pilih Animasi Cerdas. Kemudian ubah kotak dengan stopwatch untuk 1000ms. Ini akan mengatur transisi Anda untuk mengambil satu detik dari klik mouse. Pengaturan lainnya harus diatur secara default. Pastikan Anda tidak mengganti nama judul bingkai setelah mengatur transisi, jika tidak, file tidak akan terhubung.
Klik Bermain tombol untuk menguji transisi Anda. Kembali ke Rancangan untuk melanjutkan desain presentasi Anda.
5. Tambahkan Lebih Banyak Slide
Untuk beralih dari slide 1 ke slide 2, duplikat slide paling kanan Anda (Cmd/Ctrl + D). Di bingkai baru—slide 2—pindahkan kotak teks keluar dari bingkai menggunakan teknik sebelumnya (Menggeser + Menyeret kemudian Spasi setelah Anda mulai menyeret). Pindahkan satu kotak teks ke kiri dan yang lainnya ke kanan bingkai. Atur opacity menjadi 0% untuk keduanya.
Untuk gambar, turunkan dan pindahkan sedikit keluar dari tengah, lalu atur opacity menjadi 0%. Ini, secara efektif, memberi Anda kanvas kosong untuk slide kedua Anda. Anda dapat menambahkan konten di atas aset tak terlihat dari slide sebelumnya.
Tambahkan gambar besar ke tengah bingkai. Untuk menambahkan beberapa dekorasi di atas gambar Anda, gunakan a Plugin Figma untuk GIF atau unduh stiker GIF dari Giphy dan seret di atas gambar. Pilih gambar utama Anda dan GIF apa pun, dan kelompokkan bersama-sama (Cmd/Ctrl + G), ini memastikan bahwa Smart Animate akan berfungsi dengan baik.
Pilih grup dan salin (Cmd/Ctrl + C). Kemudian paste ke frame slide 1 (Cmd/Ctrl + V). Kecilkan dan atur opacity menjadi 0%. Kemudian pindahkan layer ini ke belakang (Cmd/Ctrl + [). Ini memastikan transisi yang mulus ke slide berikutnya.
Pergi ke Prototipe. Pilih slide 2 dan klik lingkaran biru untuk menyeretnya ke slide 3. Default Figma di menu prototipe adalah menggunakan pengaturan sebelumnya, jadi semuanya harus diatur sesuai dengan transisi sebelumnya. Kembali ke Rancangan.
Gandakan slide terakhir (Cmd/Ctrl + D). Slide ini akan menggunakan gambar yang sama seperti yang sebelumnya, tetapi kita akan menskalakannya ke satu sisi bingkai. Pindahkan gambar ke kiri bingkai dengan menyeretnya sambil menahan Menggeser. Arahkan kursor ke tepi kanan gambar hingga panah berlawanan muncul, klik dan seret tepi kanan gambar ke kiri hingga puas.
Pergi ke Prototipe dan hubungkan kedua bingkai bersama-sama. Kemudian kembali ke Rancangan.
Tambahkan judul dan teks isi di sebelah kanan gambar yang diskalakan, dan kelompokkan menjadi satu. Salin grup teks dan tempel ke slide sebelumnya. Klik dan seret grup teks ke kanan bingkai seperti sebelumnya.
6. Tambahkan Mockup
Buat maket; lihat kami panduan membuat maket menggunakan plugin di Figma. Tambahkan bingkai baru, lalu tempel mockup Anda ke atasnya. Ubah ukuran mockup agar sesuai dengan bingkai.
Salin mockup dan tempel ke bingkai sebelumnya. Ubah ukurannya agar pas dengan bagian gambar, lalu pindahkan ke bagian belakang layer dan atur opacity menjadi 0%. Tautkan bingkai di Prototipe.
7. Tambahkan Label
Gandakan bingkai mockup. Tambahkan judul dan deskripsi untuk menjelaskan bagian dari mockup Anda. Kelompokkan teks bersama-sama dan beri nama. Maka kamu bisa buat indikator kaca buram untuk poin dan garis Anda. Kelompokkan satu garis dengan satu lingkaran. Sejajarkan indikator Anda dengan apa yang dijelaskannya dan tambahkan deskripsi Anda di sebelahnya. Tautkan bingkai di Prototipe.
Gandakan bingkai dan tambahkan indikator poin peluru lainnya dengan apa yang dijelaskannya. Prototipe ini lagi. Gandakan setiap bingkai per poin poin, sehingga setiap poin poin bertransisi sendiri.
8. Akhiri Presentasi Anda
Gandakan slide terakhir. Tulis satu atau dua kata terakhir dan letakkan di tengah. Salin teks dan tempel ke slide sebelumnya.
Kecilkan teks dengan menahan K saat menskalakannya—ini membuat teks Anda tetap diformat sambil mengecilkannya. Tempatkan teks Anda di suatu tempat di dekat bagian atas mockup dan kirim layer ke belakang, di bawah gambar. Atur opacity menjadi 0%. Kembali ke slide terakhir Anda.
Pindahkan semua objek lain keluar dari bingkai menggunakan metode menyeret. Transisi akan menggeser semuanya ke arah samping dan atas saat teks bergerak turun dari atas dan meluas. Tautkan slide di Prototipe.
9. Bagikan Presentasi Figma Anda
Anda dapat mengakses presentasi Anda di mana pun Anda dapat masuk ke akun Figma Anda atau membagikan URL dengan orang lain, sehingga mereka dapat menonton dari mana saja. Untuk mempresentasikan presentasi akhir Anda dengan transisinya, klik tombol Bermain tombol dan hadir dalam mode layar penuh.
Anda juga dapat menyimpan bingkai sebagai PDF, meskipun Anda akan kehilangan transisi animasi dengan melakukan itu.
Tingkatkan Presentasi Anda Dengan Figma
Tidak hanya presentasi ini yang minimalis, yang tidak akan membanjiri audiens Anda, tetapi transisinya juga profesional dan bersih. Tidak perlu pakar UI/UX untuk menggunakan Figma dengan cara yang menguntungkan presentasi Anda, apa pun peran pekerjaan Anda. Presentasikan dengan percaya diri, dan Anda akan dibanjiri pertanyaan tentang bagaimana presentasi Anda dibuat.