Motion design

Loyang, Dari Chat ke Toples

Video peluncuran vertikal untuk aplikasi fiktif Loyang bagi pembuat kue kering rumahan: kata-kata dari chat pelanggan terbang menjadi kartu pesanan, nastar berjatuhan mengisi toples berlabel "Bu Rina", daftar belanja tercentang di atas loyang berisi empat jenis kue, lalu rute antar tergambar di peta sebelum logo muncul di tengah cincin kue yang berputar.

Motion design · SVG, GSAP, CSS · 20 detik · 720×1280

Prompt

Buat video peluncuran vertikal 720x1280 berdurasi 20 detik untuk aplikasi fiktif bernama Loyang, asisten AI untuk pembuat kue kering rumahan menjelang Lebaran. Satu file HTML, animasi SVG/HTML dengan GSAP timeline (gsap@3.12.5), semua ilustrasi digambar sebagai SVG, tanpa gambar. Gaya: hangat dan lembut, latar gradasi krem ke peach (#FBF4EA, #F6E2CC, #F2CBA6) dengan gumpalan cahaya yang bergeser pelan dan remah kue yang melayang, judul serif (Lora) cokelat tua #2A1D14 dengan frasa miring oranye karamel #C2671E bersapuan stabilo tipis, teks UI sans-serif (Inter), kartu putih bersudut 18px dengan bayangan lembut, pil gelap #211812 untuk status. Kue kering digambar detail dan mudah dikenali: nastar bulat keemasan dengan pola kisi silang dan cengkih di atasnya, kastengel batang persegi dengan permukaan atas lebih gelap dan taburan parutan keju, putri salju berbentuk bulan sabit tebal berlapis gula halus dengan dasar krem yang mengintip, lidah kucing pipih memanjang dengan tepi cokelat keemasan. Adegan 1 (0-4,7 dtk): judul "Dari chat pelanggan, jadi pesanan rapi." di atas ponsel buram berisi percakapan. Gelembung chat tajam dari Bu Rina muncul: "Mbak, pesan nastar 14 toples ya. Saya ambil Sabtu jam 8 pagi." Kata "nastar", "14 toples" dan "Sabtu jam 8" disorot oranye satu per satu, lalu terbang melengkung masuk ke kartu "Pesanan baru #0217 Bu Rina" (Kue: Nastar keju, Jumlah: 14 toples, Ambil: Sabtu, 08.00) yang mendapat lencana hijau "Tercatat". Pil gelap "Pesanan ke-37 minggu ini" masuk, lalu semua elemen naik dan memudar bersama. Adegan 2 (4,7-10 dtk): "Satu adonan," diketik dengan kursor berkedip, lalu "empat belas toples." besar miring oranye. Toples kaca bertutup merah dengan pita emas di tengah; tutupnya terangkat, empat belas nastar berjatuhan memantul mengisi toples baris demi baris, sementara kartu "Toples terisi hari ini" menghitung 0 sampai 14 dengan ikon toples kecil yang terisi. Tutup menutup dan bergoyang, stiker "Bu Rina, 14 toples, Sabtu 08.00" ditempel miring, pil "Oven kedua menyala 21.30" muncul. Adegan 3 (10-14,8 dtk): "Bahan dihitung, sebelum habis." Kartu "Belanja minggu ini, untuk 80 toples, 4 jenis kue" masuk dari posisi miring ke tegak; enam baris (Mentega 4 kg, Keju edam 2 kg, Tepung terigu 6 kg, Gula halus 1,5 kg, Selai nanas 3 kg, Telur 3 kg) dicentang satu per satu dan dicoret. Di sepertiga bawah sebuah loyang logam berlabel "LOYANG HARI INI" berisi nastar, kastengel, putri salju dan lidah kucing yang jatuh memantul dengan nama masing-masing. Adegan 4 (14,8-17,4 dtk): "Enam alamat, sekali jalan." Kartu peta bergaya datar dengan jalan putih dan sungai; garis rute oranye tergambar sementara ikon mobil antar bergerak di sepanjangnya dan pin bernomor 1 sampai 5 bermunculan dari titik D. Info "14,2 km total, berangkat 07.30, selesai 10.45", lalu notifikasi bergaya iOS dari Loyang: "Kurir Antar", "Rute Sabtu siap. 6 alamat, semua toples sampai sebelum 11.00." Penutup (17,4-20 dtk): ubin logo oranye bergambar nastar muncul berputar, dua belas kue membentuk cincin dengan jarak rata di sekelilingnya dan berputar pelan (tiap kue tetap tegak), wordmark "loyang." dan kalimat "Kamu cukup memanggang.", lalu pil "Musim ini 312 toples terkirim" dengan angka yang menghitung naik. Gerak memakai easing power3/expo dan bounce untuk kue yang jatuh, tanpa jeda diam lebih dari 2 detik.

Video Motion design lainnya

  1. Bintang Kecil Pulang ke LangitMotion design20 dtkBintang Kecil Pulang ke LangitSeorang gadis kecil bergaya coretan tangan melihat bintang jatuh saat senja, menemukan bintang mungil yang murung di puncak bukit, memeluknya sampai bercahaya, lalu melepasnya kembali ke langit. Bintang itu menjadi kepala sebuah rasi berbentuk gadis kecil yang melambai, dan malam ditutup tulisan selamat malam.Canvas 2D · Partikel · CSS
  2. Kuku si Kukang Tak Telat LagiMotion design20 dtkKuku si Kukang Tak Telat LagiKuku, seekor kukang mungil bergaya gambar krayon, selalu ketinggalan bus sekolah sampai ia memasang aplikasi alarm fiktif Gegas. Sejak itu ia selalu duluan sampai di halte, hitungan tepat waktunya terus naik, dan cerita ditutup dengan kartu ajakan memasang Gegas.Canvas 2D · Partikel · CSS
  3. Tokek Menjelaskan Kaki LengketnyaMotion design20 dtkTokek Menjelaskan Kaki LengketnyaSeekor tokek kartun membawakan acara bincang singkat tentang rahasia kakinya yang bisa menempel di dinding, disunting cepat dengan subtitle kata per kata, potongan zoom, latar yang berganti dari studio bertirai ke dunia pop bersinar lalu kartun lawas sepia. Di akhir ia menempelkan telapak kakinya ke layar.Canvas 2D
  4. Tujuh Warna dari Seberkas CahayaMotion design20 dtkTujuh Warna dari Seberkas CahayaReel gerak lima bab tentang pelangi: prisma kaca 3D memecah cahaya putih, tujuh batang neon membentuk wordmark Pelangi, lalu kata-kata yang distabilo di sebuah catatan terbang menjadi sketsa tangan tentang cahaya matahari yang membelok dan memantul di dalam tetes hujan hingga busur pelangi tergambar.Three.js · Canvas 2D · CSS
ArtikelSusun brief