Catatan: ini adalah konsep demo, bukan proyek klien. Restorannya, Teras Arunika, fiktif dan dibuat khusus untuk demo ini, dan foto makanannya dibuat dengan AI. Semua angka di bawah berasal dari pengujian demo ini. ※本記事はクライアント案件ではなく、コンセプトデモのご紹介です。「Teras Arunika」はこのデモのために作成した架空のレストランで、料理写真はAIで生成したものです。以下の数値はすべて本デモでの計測結果です。 Note: this is a concept demo, not a client project. The restaurant, Teras Arunika, is fictional and was made for this demo, and its food photos are AI-generated. All numbers below come from testing this demo.
Masalah 課題 The Problem
Banyak restoran dan kafe sekarang memasang QR code di meja — tapi begitu discan, yang terbuka sering kali file PDF di Google Drive. Pelanggan harus menunggu file yang besar selesai dimuat, lalu mencubit dan menggeser layar untuk membaca tulisan yang sebenarnya didesain untuk kertas cetak. Mencari satu menu berarti menggulir halaman demi halaman. 多くの飲食店やカフェではテーブルにQRコードが置かれていますが、読み取ると開くのはGoogleドライブ上のPDFファイルというケースが少なくありません。お客様は容量の大きいファイルの読み込みを待ち、印刷用にデザインされた小さな文字を、指で拡大・スクロールしながら読むことになります。目当ての料理を探すには、ページを一枚ずつめくっていくしかありません。 Many restaurants and cafés now put a QR code on the table — but once it's scanned, what opens is often a PDF on Google Drive. Diners wait for a large file to load, then pinch and pan to read text that was designed for a printed page. Finding one dish means scrolling page by page.
Di sisi restoran juga ada repotnya: setiap kali harga naik atau ada menu baru, file desainnya harus diedit, diekspor ulang ke PDF, lalu diunggah lagi. Kalau link file-nya ikut berubah, QR code yang sudah tercetak di semua meja tidak bisa dipakai lagi. 店舗側にも手間があります。値上げや新メニューのたびにデザインファイルを修正し、PDFを書き出し直してアップロードする必要があります。さらにファイルのリンクが変わってしまうと、全テーブルに印刷済みのQRコードが使えなくなります。 It's a chore for the restaurant too: every price increase or new dish means editing the design file, exporting a new PDF and uploading it again. If the file's link changes along the way, the QR codes already printed on every table stop working.
Solusi ソリューション The Solution
Menu web yang terbuka langsung di browser HP — tanpa aplikasi, tanpa login, tanpa unduh file. Begitu QR discan, pelanggan langsung melihat kategori menu dengan foto dan tulisan yang besar dan jelas. Dari situ, pelanggan bisa memilih kategori dan mengetuk menu untuk melihat detailnya — harga, pilihan varian, tingkat pedas, dan alergen — atau cukup mengetik nama makanan atau bahannya di kolom pencarian. スマートフォンのブラウザでそのまま開けるWebメニューです。アプリのインストールもログインも、ファイルのダウンロードも不要です。QRコードを読み取るとすぐに、大きく見やすい文字と写真でカテゴリ一覧が表示されます。カテゴリを選んで料理をタップすれば、価格、バリエーション、辛さ、アレルゲンなどの詳細を確認できます。料理名や食材を検索欄に入力して探すことも可能です。 A web menu that opens straight in the phone's browser — no app, no login, no file to download. The moment the QR is scanned, diners see the menu categories with large, clear text and photos. From there they can pick a category and tap a dish for its details — price, variants, spice level and allergens — or just type a dish name or ingredient into the search box.
Seluruh isi menu disimpan di satu file data. Kalau harga berubah, cukup ubah satu baris di file itu — menu di HP setiap pelanggan langsung ikut ter-update, dan QR code di meja tetap sama. メニューの内容はすべて一つのデータファイルで管理しています。価格が変わった場合もファイルの該当行を修正するだけで、すべてのお客様の画面に即座に反映され、テーブルのQRコードは変更不要です。 The whole menu lives in one data file. When a price changes, edit one line in that file — every diner's phone shows the update right away, and the QR code on the table stays the same.
Video Demo デモ動画 Demo Video
Video berikut dimulai dengan dua tablet yang men-scan QR pada saat yang sama, lalu memperlihatkan perbedaan membaca menu di PDF dan di menu web, fitur pencarian, dan saran menu dari AI. Teks di dalam video berbahasa Inggris. 以下の動画では、2台のタブレットで同時にQRコードを読み取る比較から始まり、PDFとWebメニューの読みやすさの違い、検索機能、AIによるおすすめ機能をご紹介しています（動画内の字幕は英語です）。 The video below starts with two tablets scanning a QR code at the same moment, then shows the difference between reading the PDF and the web menu, the search, and the AI suggestions.
Hasil Pengujian 計測結果 Test Results
- Tampilan pertama: menu web siap dalam 0,7 detik, sedangkan PDF baru menampilkan halaman pertamanya setelah 2,7 detik — dan itu pun masih sampul. Sekitar 3–4× lebih cepat.最初の画面表示：Webメニューは0.7秒で表示されたのに対し、PDFは2.7秒後にようやく1ページ目（しかもまだ表紙）が表示されました。約3〜4倍の速さです。First screen: the web menu was ready in 0.7 s, while the PDF showed its first page after 2.7 s — and that page was still the cover. Roughly 3–4× faster.
- Ukuran unduhan: halaman awal menu web 78 KB, sedangkan PDF menunya 10,3 MB (21 halaman A4 dengan foto).ダウンロード容量：Webメニューの初期表示は78KB、PDFメニューは10.3MB（写真入りA4・21ページ）です。Download size: the web menu's first screen is 78 KB; the PDF menu is 10.3 MB (21 A4 pages with photos).
- Sebagai catatan: waktu di atas berasal dari satu rekaman, dengan kedua tablet di koneksi yang sama. PDF di demo ini juga berukuran wajar (21 halaman), bukan contoh ekstrem dengan ratusan halaman.補足：上記の時間は1回の録画によるもので、2台とも同じ回線に接続した状態で計測しています。また、今回のPDFは21ページと一般的な規模で、数百ページに及ぶような極端な例ではありません。For context: the times come from one recording, with both tablets on the same connection. The demo PDF is also a typical size (21 pages), not an extreme example with hundreds of pages.
Saran Menu dari AI — dengan Pagar Pengaman AIによるおすすめ機能 — 安全のための仕組み AI Menu Suggestions — With Guardrails
Tombol "Bantu pilih" menanyakan tiga hal — seberapa lapar, suka pedas atau tidak, dan pantangan makanan atau alergi — lalu menyarankan 2–3 menu, masing-masing dengan alasan singkat. Pelanggan juga bisa menulis permintaan sendiri, misalnya "alergi kacang". 「Help me choose（選ぶのを手伝って）」ボタンでは、空腹の度合い、辛さの好み、食事制限やアレルギーの3点を尋ね、2〜3品を理由とともに提案します。「ピーナッツアレルギーがあります」のように自由に入力することもできます。 The "Help me choose" button asks three things — how hungry, how spicy, and any diet or allergies — then suggests 2–3 dishes, each with a short reason. Diners can also type their own request, such as "I'm allergic to peanuts."
Risiko terbesar AI di menu restoran adalah menyarankan hidangan yang tidak ada, atau mengabaikan alergi. Karena itu, aturannya tidak cuma ditulis sebagai instruksi untuk AI, tapi dijaga langsung oleh sistem: menu yang tidak cocok dengan jawaban pelanggan (pedas, vegetarian, alergen) sudah disaring sebelum AI melihatnya; saran yang tidak ada di daftar menu dibuang; dan kalimat AI yang mengklaim suatu menu "bebas" alergen tertentu dihapus, karena data menu tidak bisa menjamin hal itu. Pelanggan juga selalu diingatkan untuk mengonfirmasi alergen ke staf. 飲食店のメニューにAIを使う上での最大のリスクは、存在しない料理を勧めたり、アレルギーを見落としたりすることです。そのため、ルールはAIへの指示として書くだけでなく、システム側で強制しています。お客様の回答（辛さ、ベジタリアン、アレルゲン）に合わない料理はAIに渡す前に除外し、メニューにない提案は破棄します。また、特定のアレルゲンを「含まない」と断言するAIの文章は削除します。メニューデータだけではそれを保証できないためです。アレルゲンについては、常にスタッフへの確認を促します。 The biggest risk of AI on a restaurant menu is suggesting a dish that doesn't exist, or ignoring an allergy. So the rules aren't just written as instructions to the AI — the system enforces them: dishes that don't fit the diner's answers (spice, vegetarian, allergens) are filtered out before the AI ever sees the menu; any suggestion not on the menu is dropped; and any AI sentence claiming a dish is "free" of an allergen is removed, because the menu data can't guarantee that. Diners are always reminded to confirm allergens with staff.
Dalam uji 10 skenario — termasuk permintaan sangat pedas, alergi yang diketik bebas, pesanan menu yang tidak tersedia, dan upaya menyuruh AI "mengabaikan instruksi sebelumnya" — tidak ada satu pun saran yang keluar dari menu atau melanggar batas pedas, vegetarian, maupun alergen. 非常に辛い料理のリクエスト、自由入力で書かれたアレルギー、メニューにない料理の注文、AIに「以前の指示を無視させる」試みを含む10通りのテストでは、メニュー外の提案や、辛さ・ベジタリアン・アレルゲンの条件に反する提案は一件もありませんでした。 In a 10-scenario test — including a request for the spiciest dish, allergies typed as free text, an order for something not on the menu, and an attempt to make the AI "ignore previous instructions" — not one suggestion went off the menu or broke a spice, vegetarian or allergen limit.
Detail Teknis 技術詳細 Technical Details
- Halaman web statis: HTML, CSS, dan JavaScript biasa — pelanggan tidak perlu menginstal aplikasi apa pun静的なWebページ：HTML・CSS・JavaScriptのみで構成され、お客様がアプリをインストールする必要はありませんStatic web page: plain HTML, CSS and JavaScript — diners don't need to install anything
- Data menu: satu file JSON berisi nama, harga, deskripsi, varian, tingkat pedas, dan alergen, dalam bahasa Indonesia dan Inggris yang bisa diganti dengan satu tombolメニューデータ：料理名、価格、説明、バリエーション、辛さ、アレルゲンを一つのJSONファイルで管理。インドネシア語と英語に対応し、ボタン一つで切り替え可能です（日本語など他言語の追加も可能）Menu data: one JSON file holding names, prices, descriptions, variants, spice levels and allergens, in Indonesian and English with a one-tap language switch
- Pencarian: berjalan langsung di HP pelanggan sambil mengetik, tanpa menunggu server; mencari nama, deskripsi, dan bahan dalam kedua bahasa検索：入力と同時にお客様の端末上で処理され、サーバーとの通信を待つ必要はありません。両言語の料理名、説明、食材を対象に検索しますSearch: runs on the diner's phone as they type, with no server round trip; it matches names, descriptions and ingredients in both languages
- AI: model Claude Haiku, dipanggil lewat fungsi di server sehingga kunci API tidak pernah sampai ke browser; ada batas permintaan per pengunjung dan batas biaya bulananAI：Claude Haikuモデルをサーバー側の関数経由で呼び出すため、APIキーがブラウザに渡ることはありません。訪問者ごとのリクエスト上限と月額の利用上限を設定していますAI: a Claude Haiku model, called through a server-side function so the API key never reaches the browser; with a per-visitor request limit and a monthly spending cap
- Kecepatan: teks menu tampil di bawah 1 detik di koneksi 4G; di 4G yang lambat, foto butuh sekitar 1,3 detik表示速度：4G回線でメニューの文字を1秒未満で表示。低速な4G回線では、写真の表示に約1.3秒かかりますSpeed: the menu text appears in under 1 second on 4G; on slow 4G, the photos take about 1.3 seconds
Yang Kami Pelajari 今回の学び What We Learned
Perbaikan terbesar justru datang dari hal-hal dasar: halaman yang ringan, tulisan yang terbaca, dan pencarian. AI di sini adalah tambahan yang berguna untuk pelanggan yang bingung mau pesan apa — bukan alasan utama untuk beralih dari PDF. 最も大きな改善をもたらしたのは、実は基本的な部分でした — 軽いページ、読みやすい文字、そして検索機能です。AIは何を注文するか迷っているお客様にとって便利な追加機能ですが、PDFから切り替える主な理由ではありません。 The biggest gains came from the basics: a light page, readable text and search. The AI is a useful extra for diners who can't decide what to order — not the main reason to move away from a PDF.
Saat diuji, AI sempat dua kali menyebut suatu menu "bebas susu" atau "bebas kacang", meski sudah diinstruksikan untuk tidak melakukannya. Pelajarannya: untuk hal yang menyangkut keamanan seperti alergi, aturan harus dijaga oleh kode, bukan hanya diminta lewat instruksi. テスト中、指示していたにもかかわらず、AIが料理を「乳製品不使用」「ピーナッツ不使用」と断言したことが2回ありました。アレルギーのように安全に関わる部分は、指示に頼るのではなく、コードでルールを守らせる必要があるというのが教訓です。 During testing, the AI twice described a dish as "dairy-free" or "peanut-free" despite being told not to. The lesson: for anything safety-related like allergies, the rules have to be enforced in code, not just requested in the instructions.
Dan satu kejadian kecil saat menyiapkan demo ini justru membuktikan masalah menu PDF: file menu di Google Drive sempat terhapus. Setelah diunggah ulang, link-nya berubah — sehingga QR code harus dibuat ulang dan kartu mejanya dicetak lagi. Dengan menu web, alamatnya tetap; yang berubah hanya isinya. また、このデモの準備中に起きた小さな出来事が、PDFメニューの課題を裏付けました。Googleドライブ上のメニューファイルが誤って削除され、再アップロードするとリンクが変わったため、QRコードを作り直し、テーブル用カードを印刷し直す必要がありました。Webメニューであればアドレスは変わらず、内容だけを更新できます。 And one small incident while preparing this demo proved the PDF problem nicely: the menu file on Google Drive was deleted by mistake. Once re-uploaded, its link had changed — so the QR code had to be regenerated and the table card reprinted. With a web menu, the address stays the same; only the content changes.
Ingin Mencoba Demonya? デモをご希望の方へ Want to Try the Demo?
Demo ini bisa dicoba langsung di HP Anda — hubungi kami untuk mendapatkan akses demo, atau untuk berdiskusi tentang menu restoran atau kafe Anda sendiri. このデモはお手持ちのスマートフォンで実際にお試しいただけます。デモのご利用や、貴店のメニューに関するご相談は、お問い合わせください。 The demo runs on your own phone — contact us for access, or to talk about your own restaurant or café menu.
Dibuat oleh developer lokal di Bandung yang membangun sistem sederhana untuk kebutuhan restoran, toko, dan usaha kecil sehari-hari. Kalau restoran atau kafe Anda ingin beralih dari menu PDF, hubungi Inti Sakura Solutions. インドネシア・バンドンを拠点に、飲食店や小売店、中小企業向けのシンプルで実用的なシステムを開発しています。PDFメニューからの移行をご検討の飲食店様は、Inti Sakura Solutionsまでお気軽にご相談ください。 Built by an independent developer based in Bandung, Indonesia, who builds practical systems for restaurants, shops and SMEs. If your restaurant or café wants to move on from a PDF menu, get in touch with Inti Sakura Solutions.