01. Hero Section & Navigasi Utama
Tampilan pembuka yang memikat dengan headline penawaran "Lapar? Ayam Krispi Juara Siap Meluncur!", pemilihan mode pengantaran (Delivery / Pickup), dan switch cabang pengirim.
Proyek eksplorasi mandiri merancang dan mengembangkan landing page interaktif brand F&B Golqi Chicken dengan katalog menu lengkap, pemilihan 26+ cabang terdekat di Makassar & Gowa, serta alur pemesanan online dan WhatsApp instan.
Titik cabang resmi tersebar di Makassar dan Kabupaten Gowa terintegrasi peta.
Koleksi paket ayam krispi, sambal nusantara, burger, camilan, dan minuman segar.
Tampilan mobile-first yang nyaman diakses pelanggan melalui smartphone.
Alur pemesanan ringkas: pilih cabang, pilih menu, bayar aman, pesanan diantar kilat.
Sebagai proyek eksplorasi pribadi di industri F&B, studi kasus ini mengangkat brand kuliner Golqi Chicken yang memiliki lebih dari 26 cabang di wilayah Makassar dan Gowa. Sering kali pelanggan menemui kendala dalam menentukan cabang mana yang terdekat dari lokasi mereka serta jam operasional masing-masing cabang.
Selain itu, banyak pelanggan yang lebih menyukai pemesanan cepat tanpa harus mengunduh aplikasi tambahan, sehingga rancangan landing page berbasis web yang terintegrasi dengan Google Maps dan WhatsApp menjadi fokus utama eksplorasi ini.
Saya merancang antarmuka landing page bertema cerah khas kuliner (kombinasi orange segar, kuning hangat, dan putih bersih) dengan fokus kemudahan navigasi bagi pengguna smartphone.
Fitur pemilihan outlet terintegrasi dengan Google Maps untuk navigasi langsung, sementara katalog menu interaktif memudahkan calon pembeli memilih menu favorit dan mengirimkan pesanan terformat rapi ke WhatsApp cabang terkait.
Pelanggan dapat memilih outlet terdekat dengan info jam operasional dan link rute Google Maps.
Pencarian menu instan dengan filter kategori tanpa reload, dioptimalkan untuk koneksi mobile.
Klik pada gambar mana pun untuk membuka mode Pan & Zoom layar penuh, memperbesar detail teks/menu, dan bernavigasi antar tangkapan layar.
Tampilan pembuka yang memikat dengan headline penawaran "Lapar? Ayam Krispi Juara Siap Meluncur!", pemilihan mode pengantaran (Delivery / Pickup), dan switch cabang pengirim.
Kartu informasi cabang aktif dengan status jam operasional, tautan Titik Maps, petunjuk arah Google Maps, dan tombol pemesanan langsung ke WhatsApp cabang.
Bagian promosi khusus dengan badge diskon 10% s.d. 25% untuk Paket Ayam Geprek, Saus Keju Melted, Kombo Kenyang Berdua, dan Family Party Bucket lengkap dengan countdown promo.
Panduan visual cara memesan santapan ayam dalam 4 tahap: Pilih Cabang Terdekat, Pilih Menu Favorit, Pembayaran QRIS/E-Wallet Cepat, dan Nikmati Selagi Hangat.
Etalase produk terfavorit pelanggan meliputi Golqi Krispi Burger, Paket Nasi Sambal Bawang, Ayam Saus Keju Melted, dan minuman segar dengan tombol "+ Tambah" sekali klik.
Daftar cabang resmi dengan fitur pencarian nama jalan, foto outlet fisik, rating Google ulasan bintang 4.9, jam operasional, dan rute navigasi instan.
Navigasi lingkaran kategori rasa (Ayam Original, Saus Keju, Sambal Nusantara, Nasi Box, Camilan, Minuman) serta komitmen layanan: Diskon Harian, Live Tracking, & Pengiriman Cepat.
Halaman katalog interaktif dengan kolom pencarian nama makanan, pemilihan outlet pengirim terdekat dengan kalkulasi ongkir, dan tab filter kategori makanan.
Grid kartu menu interaktif menyajikan 18 pilihan menu lezat, badge Terlaris/Diskon/Pedas, komposisi sajian, harga transparan, dan tombol "+ Tambah" langsung.
Drawer checkout interaktif untuk memilih cabang pengirim terdekat (ongkir flat Rp 10.000), penyesuaian kuantitas menu, dan pengisian nama pemesan.
Formulir pengisian nomor WhatsApp aktif, alamat pengantaran lengkap, instruksi khusus pesanan (misal: sambal dipisah), dan opsi pembayaran QRIS / Tunai COD.
Tampilan modal pop-up pembayaran QRIS nasional instan dengan barcode dinamis (NMID), verifikasi otomatis kasir, dan tombol konfirmasi pesanan via WhatsApp.
Dipilih untuk performa maksimal, keamanan kode, dan kemudahan pemeliharaan.
Tiap cabang memiliki nomor WhatsApp admin dan jam operasional yang berbeda-beda.
Membuat struktur data outlet dinamis sehingga saat cabang berganti, nomor WhatsApp dan tautan Google Maps otomatis berubah tanpa reload.
Banyaknya foto menu makanan beresolusi tinggi berisiko memperlambat loading pada perangkat smartphone.
Mengoptimalkan pipeline aset gambar dan menerapkan lazy loading native untuk performa muat secepat kilat.
Formulir checkout yang terlalu panjang sering kali memicu pembatalan pesanan makanan.
Menyederhanakan alur menjadi 4 langkah dengan format pesan otomatis siap kirim ke WhatsApp cabang.