Overview
IronLogic adalah landing page berbasis konversi untuk layanan katering fitness yang menyasar pria Indonesia yang kesulitan menaikkan massa otot. Halaman ini mengarahkan pengunjung lewat funnel psikologis 6 section (identifikasi masalah, kalkulator kalori interaktif, bukti sosial, penawaran) lalu mengonversi mereka via WhatsApp.
Saya membangun proyek konsep ini untuk menunjukkan bagaimana landing page pasar Indonesia bisa diperlakukan sebagai funnel penjualan, bukan brosur statis.
Challenge
- Penggemar fitness di Indonesia punya sedikit pilihan lokal untuk layanan meal prep berbasis perhitungan makro dengan tampilan online yang terasa premium, bukan generik
- Kebanyakan landing page katering di pasar Indonesia masih statis, lambat, dan terasa ketinggalan zaman. Tidak bisa menahan perhatian atau membangun kepercayaan
- Calon pelanggan tidak tahu kebutuhan kalori mereka yang sebenarnya, jadi mereka ragu dan tidak yakin mau beli
- Pengguna mobile (mayoritas di Indonesia) sering langsung keluar dari halaman dengan responsivitas buruk atau waktu loading lambat
Solution
Storytelling Berbasis Konversi
- Funnel psikologis 6 section: Hook, Agitasi, Solusi, Demo Interaktif, Bukti Sosial, Penawaran
- Setiap section menggunakan ritme layout berbeda (rata kiri, rata kanan, tengah) untuk mencegah scroll fatigue
- Tombol CTA WhatsApp mengambang yang selalu terlihat, dengan pesan pre-filled yang disesuaikan per konteks
Kalkulator Kalori Interaktif
- Kalkulator BMI, BMR (rumus Mifflin-St Jeor), dan TDEE lengkap dengan validasi Zod schema
- Menampilkan target kalori harian personal dan breakdown makro (protein, karbohidrat, lemak)
- CTA satu klik “Dapatkan Meal Plan X kkal” yang mengirim pesan WhatsApp pre-filled berisi data kalkulasi user
Responsif & Teroptimasi
- Desain mobile-first di seluruh 6 section, navbar, dan footer
- Menu hamburger mobile dengan transisi height yang smooth
- Toggle harga bulanan/3 bulanan dengan tampilan diskon 15%
Results
- Tool engagement user: Tidak ada → Kalkulator interaktif menarik perhatian dan menghasilkan data personal
- Jalur konversi WhatsApp: 1 link generik → 3 titik masuk kontekstual dengan pesan pre-filled
- Sistem animasi: One-off per komponen → 8 primitif reusable, konsisten di 23 komponen
- Pengalaman mobile: Desktop-first, mobile seadanya → Desain mobile-first responsif dengan menu mobile animasi
