CONTOH PORTOFOLIO Website fiktif untuk mendemonstrasikan layanan pembuatan website Santai Sampai Selesai — semua nama usaha, harga, alamat, dan nomor WhatsApp di halaman ini adalah contoh.
Pesan Sekarang
Masakan Padang & Jawa · Salatiga

Rendang Empuk, Sambal Nendang, Harga Bersahabat.

Rumah Makan Sari Rasa menyajikan masakan Padang dan Jawa yang dimasak segar setiap pagi. Makan di tempat, dibungkus, atau dipesan untuk acara — semua bisa diatur lewat WhatsApp.

Memeriksa jam buka… Hari ini: —
Sepiring nasi Padang dengan gulai kikil, sayur singkong, dan sambal di atas daun pisang
Dimasak Segar Tiap PagiRendang dimasak perlahan sejak subuh — tidak ada lauk kemarin yang dihangatkan ulang.
Sejak 2012Melayani Salatiga dari warung kecil dekat pasar
12 MenuPaket nasi, lauk, dan minuman — semua bisa dipesan
Mulai Rp20rbPaket nasi lengkap dengan lauk dan sayur
Kenapa Sari Rasa

Resep Keluarga, Porsi Tidak Pelit

Tiga hal yang kami jaga sejak hari pertama buka.

Dimasak Segar Tiap Pagi

Rendang dimasak perlahan sejak subuh, sayur dan sambal dibuat baru setiap hari. Belanja bahan dilakukan sendiri ke pasar — tidak ada bahan beku untuk lauk utama.

Pesan Cepat via WhatsApp

Pilih menu di halaman ini, pesananmu terkirim sebagai pesan WhatsApp yang rapi. Tinggal tunggu konfirmasi dan makanan disiapkan.

Bisa untuk Acara & Kantor

Nasi kotak, tumpeng mini, sampai prasmanan untuk 200 orang. Harga per pax jelas di awal, tanpa biaya siluman.

Cara Pesan

Tiga Langkah Sampai Kenyang

Tanpa aplikasi tambahan, tanpa antre panjang di kasir. Semua lewat WhatsApp yang sudah ada di HP-mu.

01

Pilih Menu

Telusuri menu di atas, ketuk + Tambah, atur jumlahnya. Pesanan menghitung total secara langsung.

02

Kirim via WhatsApp

Isi nama dan pilih diambil atau diantar. Satu ketukan menyusun seluruh pesananmu jadi pesan WhatsApp yang rapi.

03

Ambil atau Diantar

Kami membalas dengan estimasi waktu siap. Bayar di tempat atau via QRIS — makanan datang, urusan selesai.

Pesananmu

SubtotalRp0
Ongkos antarRp0
TotalRp0

Detail Pesanan

Cara terima pesanan

Tombol di atas membuka WhatsApp dengan pesan yang sudah tersusun. Nomor tujuan 0812-3456-7890 adalah nomor contoh. Pesan antar area Salatiga minimal pembelian Rp50.000.

Paket Hemat & Acara

Untuk Rapat, Syukuran, dan Arisan

Untuk makan siang kantor, syukuran, arisan, dan acara keluarga. Pemesanan minimal H-1 untuk paket acara.

Nasi Kotak Standar

Rp22rb /pax
  • Nasi + ayam goreng/balado
  • Sayur + sambal + kerupuk
  • Buah & air mineral
  • Minimal 20 pax
Tanya Paket Ini

Prasmanan Acara

Rp45rb /pax
  • 3 lauk utama + 2 sayur
  • Peralatan & pelayan di lokasi
  • Teh & es buah
  • 50–200 pax, area Salatiga
Tanya Paket Ini
Suasana ruang makan Sari Rasa yang ramai saat jam makan siang — pelayan Indonesia mencatat pesanan dan pelanggan Indonesia sedang makan
Tentang Kami

Dari Dapur Keluarga, Sejak 2012

Sari Rasa berawal dari warung kecil berisi empat meja di dekat pasar. Resep rendang dan sambal ijo kami adalah resep keluarga yang tidak berubah sejak hari pertama — yang berubah hanya dapurnya yang makin besar dan meja yang makin banyak.

Sekarang kami melayani makan di tempat untuk 60 tamu, pesanan bungkus setiap hari, dan paket acara untuk kantor serta keluarga di Salatiga dan sekitarnya. Setiap pagi, belanja bahan dilakukan sendiri ke pasar — tidak ada bahan beku untuk lauk utama.

  • Resep rendang & sambal ijo keluarga, tidak berubah sejak 2012
  • Bahan lauk utama dibeli segar tiap pagi di pasar Salatiga
  • Ruang makan 60 tamu, parkir motor & mobil tersedia
Galeri

Dari Dapur Kami ke Mejamu

Piring-piring yang paling sering keluar dari dapur Sari Rasa.

Sepiring nasi rendang sapi dengan sayur singkong dan sambal ijo
Rendang, bintang utama
Sate ayam bakar arang dengan bumbu kacang dan irisan mentimun
Sate dibakar dadakan
Pelanggan Indonesia makan di ruang makan Sari Rasa dengan etalase lauk di latar
Suasana jam makan siang
Ayam goreng rempah dengan kremesan, tomat, dan lalapan
Ayam goreng kremes
Kata Pelanggan

Yang Sudah Makan, Kembali Lagi

Testimoni berikut adalah ilustrasi contoh untuk keperluan demo portofolio.

“Rendangnya benar-benar empuk dan bumbunya meresap. Sudah langganan nasi kotak untuk rapat kantor tiap bulan.”

Bu RatnaStaf administrasi, Salatiga (contoh)

“Pesan lewat WhatsApp gampang, tinggal klik-klik dari website. Sampai kantor masih hangat dan tidak ada yang kurang.”

Mas DimasKaryawan swasta, Salatiga (contoh)

“Prasmanan untuk syukuran 100 orang rapi dan tepat waktu. Tamu-tamu sampai tanya ini pesan di mana.”

Keluarga Pak Haji W.Tingkir, Salatiga (contoh)

Jam Buka & Lokasi

Mampir, Dapur Kami Terbuka

Jam buka ditampilkan lengkap dan jelas — tidak disembunyikan. Baris yang ditandai adalah hari ini (waktu WIB).

Jam Buka Setiap Hari

Alamat & Kontak (Contoh)

Sari Rasa — Rumah Makan
Jl. Sukowati No. 88, Kalicacing, Sidomukti,
Kota Salatiga, Jawa Tengah 50724 (alamat contoh)

WhatsApp (contoh): 0812-3456-7890
Telepon (contoh): (0298) 312-345
Instagram (contoh): @sarirasa.salatiga

Dapur tutup 30 menit sebelum jam tutup. Pesan antar area Salatiga, minimal pembelian Rp50.000. Parkir motor & mobil tersedia.

Di Balik Layar

Dibangun dengan UI UX Pro Max

Halaman rumah makan ini adalah versi perbandingan: isinya sama dengan contoh rumah makan biasa, tetapi seluruh keputusan visualnya diambil dari design system yang dihasilkan skill UI UX Pro Max untuk kategori usaha “restaurant food dining”. Hasilnya bukan tebakan — ada token warna, pasangan font, dan aturan UX yang bisa ditunjukkan angkanya.

Primary#DC2626Merah selera — tombol & aksen utama
Secondary#F87171Merah muda — penanda & sorotan
Accent / CTA#A16207Emas hangat — label & paket unggulan
Background#FEF2F2Merah muda nyaris putih
Foreground#450A0ATeks & garis blok
Card#FFFFFFPermukaan kartu
Border#FECACAGaris pemisah lembut
Muted#F0EDF1Latar sekunder
Tipografi dari Skill

Playfair Display SC untuk Judul Kuliner yang Tegas

Isi teks memakai Karla — sans-serif yang bersih dan ramah, terbaca jelas di ukuran kecil pada daftar harga dan formulir. Pasangan font ini adalah rekomendasi skill untuk kategori restoran & kuliner: judul serif yang elegan untuk kesan masakan berkelas, isi yang fungsional untuk kecepatan baca. Ukuran judul utama 32px ke atas, sesuai aturan efek “large type” pada gaya Vibrant & Block-based.

Aturan UX yang Diterapkan
  • Kontras teks minimal 4,5:1 — marun tua #450A0A di atas #FEF2F2 dan putih di atas merah #DC2626 lolos ambang
  • Semua target sentuh minimal 44×44px — tombol, chip filter, dan pengatur jumlah
  • Focus state terlihat jelas untuk navigasi keyboard (cincin 3px)
  • Ikon selalu SVG (gaya Lucide), tidak ada emoji sebagai ikon
  • Jam buka tampil lengkap per hari — skill secara eksplisit melarang jam yang ketinggalan zaman / disembunyikan
  • Gerakan menghormati prefers-reduced-motion; transisi tegas 150–300ms
  • Responsif di 375 / 768 / 1024 / 1440px tanpa geser horizontal
Perbandingan: Versi Biasa vs Versi Pro Max
AspekContoh Website BiasaVersi UI UX Pro Max (Halaman Ini)
Gaya visualSudut membulat lembut (radius 16–20px), bayangan halus menyebar, kesan warung yang kalem“Vibrant & Block-based” dari database gaya skill: blok geometris bersudut tegas, garis 3px, bayangan keras bergeser, hover yang berani
WarnaHijau daun #1E5631 + merah cabai #B3372A di atas krem #FAF6EF, dipilih manualToken semantik persis dari skill untuk restoran: primary merah selera #DC2626, aksen emas #A16207, background #FEF2F2, foreground #450A0A — konsisten di semua komponen
TipografiLora untuk judul + Plus Jakarta Sans untuk isiPasangan font hasil kurasi skill untuk kuliner: Playfair Display SC (judul 32px+) + Karla (isi)
Menu5 menu berfoto + daftar harga teks terpisah di bawahnya12 menu menyatu dalam satu grid terfilter (Paket Nasi / Lauk / Minuman) — daftar harga lama terserap jadi kartu menu yang semuanya bisa langsung ditambah ke pesanan
AksesibilitasSebatas “yang penting tampil”Checklist skill diterapkan: kontras ≥4,5:1, target sentuh ≥44px, focus terlihat, reduced-motion dihormati
Jam bukaSudah ada, dalam kartu info di dekat bawah halamanStatus buka/tutup langsung di hero (dihitung dari jam WIB) + tabel per hari dengan penanda “Hari Ini” — skill menegaskan jam tidak boleh disembunyikan atau ketinggalan zaman
Keputusan desainSulit dijelaskan ke klien selain “bagus menurut kami”Setiap pilihan bisa ditunjuk sumbernya: gaya, palet, font, dan aturan UX berasal dari database skill yang bisa dicari
← Semua Contoh