Yapay Zeka ile Restoran Sipariş Uygulaması Nasıl Oluşturulur

Builder’ı açmadan önce, bir müşteriye fayda sağlayacak en küçük sürümü listeleyin.

Bir restoran sipariş uygulaması için bu genellikle şunları içerir:

• restoran adı, açılış saatleri ve teslimat veya paket servis seçenekleri olan bir ana ekran
• başlangıçlar, ana yemekler, içecekler ve tatlılar gibi kategorileri olan bir menü ekranı
• boyut, ekstra malzeme, acılık seviyesi veya notlar için ürün detay durumları
• adet değişikliği ve sipariş toplamı olan bir sepet ekranı
• müşteri bilgileri ve ödeme içeren bir ödeme ekranı
• bir sipariş onay ekranı

Sonra hangi veriye ihtiyacınız olduğunu belirleyin:

• menü kategorileri
• ürün adları, açıklamaları ve fiyatlar
• ekstra peynir veya içecek boyutu gibi seçenekler
• göstermek istiyorsanız teslimat ücreti, minimum sipariş ve vergi kuralları

Kullanıcıların hesaba ihtiyacı olup olmadığına da karar verin. Birçok restoran uygulamasında ilk sürüm için giriş gerekmez. Amaç yalnızca müşterilerin ücretli sipariş verebilmesi ise, çoğu zaman menü, sepet ve ödeme ile başlayabilirsiniz. Hesapları ancak kayıtlı adresler, sipariş geçmişi veya sadakat özellikleri gerekiyorsa sonra ekleyin.

Moremade, ilk prompt kısa bir ürün özeti gibi yazıldığında en iyi sonucu verir. Ekranlar, davranış ve görsel stil konusunda net olun. Her şeyi tek seferde değil, basit bir ilk sürüm isteyin.

İyi bir ilk prompt şunları kapsamalıdır:

• platform: web sitesi veya mobil uygulama
• hedef kitle: restoran müşterileri
• temel ekranlar
• sepette ve ödeme sırasında ne olacağı
• tasarım yönü
• önceden bildiğiniz teknik tercihler

Örnek ilk prompt:

Cedar Grill adlı yerel bir restoran için React Native ve Expo kullanarak bir mobil uygulama oluştur. Bir ana ekran, kategorili bir menü ekranı, ürün detay akışı, sepet, ödeme ve sipariş onayı ekranı yap. Müşteriler ürün ekleyebilmeli, boyut veya ekstra gibi seçenekleri seçebilmeli, adetleri değiştirebilmeli ve mutfak için not bırakabilmeli. Büyük yemek görselleri, sıcak nötr renkler ve net butonlar içeren temiz, modern bir düzen kullan. Burger, salata, patates kızartması, tatlılar ve içecekler için örnek menü verisiyle başla. Uygulamayı mobil öncelikli yap ve daha sonra Stripe ödemeleri ile menü verileri için Supabase ile genişletilmeye uygun hale getir.

İşe yarar bir ilk kurulum için bu yeterlidir. Önizlemeyi gördükten sonra ayrıntıları sohbette netleştirebilirsiniz.

Moremade uygulamayı ürettikten sonra, canlı önizlemeyi bir tasarımcının ilk taslağını inceler gibi gözden geçirin. Her şeyi bir anda düzeltmeye çalışmayın. Ana müşteri akışını adım adım kontrol edin: menüyü gez, bir ürünü aç, sepete ekle, adet değiştir ve ödeme aşamasına ulaş.

Belirli bir butonu, kartı veya metin bloğunu doğrudan değiştirmek için görsel inspector’ı kullanın. Davranışsal değişiklikler veya daha geniş tasarım düzenlemeleri için sohbeti kullanın. Gerekirse ekranların nasıl yapılandığını görmek için kod görünümünü açın.

Üç yararlı takip promptu:

• "Mobilde menüyü taramayı kolaylaştır: üstte sabit bir kategori çubuğu ekle, liste görünümünde açıklamaları kısalt ve fiyatı daha belirgin göster."
• "Ürün detay ekranını, gerekli seçenekler seçilmeden Add to Cart düğmesi etkinleşmeyecek şekilde değiştir. Onay kutulu ekstralar ve alerji notları için bir metin alanı ekle."
• "Sepet ve ödeme akışını iyileştir: ara toplamı, teslimat ücretini ve toplamı net göster, ana işlemi altta sabit tut ve tahmini paket servis veya teslimat süresi seçici ekle."

Kısa döngüler halinde çalışın. Oluşturun, inceleyin, ayarlayın ve tekrarlayın. Bu yöntem, tüm gereksinimleri tek uzun prompta sıkıştırmaktan genellikle daha temiz sonuç verir.

İlk yapımı basit tutun. Sonra entegrasyonları uygulamanın gerçekten neye ihtiyacı varsa ona göre ekleyin.

Gerçek ödeme almak istiyorsanız Stripe kullanın. Moremade, belirlediğiniz fiyatlarla ödeme için yerleşik bir Stripe bağlantılayıcısına sahiptir. Bir restoran sipariş uygulaması için, sepet ve toplamlar doğru göründüğünde bu doğal bir sonraki adımdır.

Dinamik veriye veya kullanıcı hesaplarına ihtiyacınız varsa Supabase kullanın. Supabase şunları yönetebilir:

• menü öğeleri ve kategoriler için veritabanı tabloları
• müşterilerin hesaba ihtiyacı varsa giriş
• menü görselleri için dosya depolama

Pratik bir sıra şöyledir:

1. Oluşturulan uygulamada örnek menü verisiyle başlayın.
2. Ekranları ve sipariş akışını iyileştirin.
3. Ödeme için Stripe’ı bağlayın.
4. Daha kolay güncelleme veya birden fazla lokasyon gerekiyorsa menü verilerini Supabase’e taşıyın.
5. Yalnızca kayıtlı profil veya sipariş geçmişi için gerçek bir ihtiyaç varsa giriş ekleyin.

Bu, hesap sistemlerini sipariş deneyiminin kendisi düzgün çalışmadan önce kurma gibi yaygın hatayı önler.

Bir restoran sipariş uygulamasının kaderi küçük ekran kullanılabilirliğine bağlıdır. Yalnızca masaüstünde küçültülmüş bir tarayıcıda değil, gerçek bir telefonda test edin.

Şunları kontrol edin:

• kategori sekmelerine kolayca dokunulabiliyor mu
• ürün adları ve fiyatlar garip satır kaymaları olmadan sığıyor mu
• seçenek grupları net mi ve ekranın altında kaybolmuyor mu
• gerektiğinde sepet düğmesi görünür kalıyor mu
• adetler veya ekstralar değiştiğinde toplamlar doğru güncelleniyor mu
• ödeme alanları mobilde kolayca doldurulabiliyor mu

Gerçek sipariş senaryolarını da test edin:

• farklı seçeneklerle iki benzer ürün ekleyin
• bir ürünü kaldırın ve toplamların güncellendiğini doğrulayın
• her ikisi varsa bir paket servis ve bir teslimat siparişi verin
• eksik zorunlu seçenekleri deneyin ve uygulamanın geçersiz add-to-cart işlemlerini engellediğini kontrol edin

Süreç boyunca version history’yi kullanın. Bir değişiklik turu akışı kötüleştirirse, geri alın ve daha dar bir prompt ile tekrar deneyin.

Sipariş akışı çalıştığında, doğrudan Moremade’den yayın yapabilirsiniz.

Seçenekler oldukça basittir:

• Free planda, yourname.moremade.ai alt alan adına yayınlayın
• ücretli planlarda özel alan adı bağlayın
• alan adlarını Moremade içinde de satın alabilirsiniz

Dahili bir deneme için ücretsiz alt alan adı genellikle yeterlidir. Gerçek bir restoran lansmanı için, müşteriler restoranın kendi web adresini görsün diye ücretli planda özel alan adı kullanın.

Tam taşınabilirliği korumak istiyorsanız, kaynak kodu istediğiniz zaman ZIP olarak dışa aktarabilir veya GitHub’a gönderebilirsiniz. Moremade, web siteleri için gerçek React + Tailwind kodu ve mobil uygulamalar için React Native with Expo üretir; bu yüzden size özel bir çalışma zamanına bağlı kalmazsınız.

Sorunların çoğu, çok erken aşamada fazla şey yapmaya çalışmaktan kaynaklanır.

Şu hatalardan kaçının:

• Belirsiz promptlarla başlamak. "Bir yemek uygulaması yap" fazla açık uçludur. Ekranları, eylemleri ve stili adlandırın.
• Sipariş akışını doğrulamadan önce giriş eklemek. İlk sürümde hesaplar çoğu zaman isteğe bağlıdır.
• Teslimat mantığını, sadakat özelliklerini, yönetici araçlarını ve müşteri siparişini ilk yapımda karıştırmak. Önce yalnızca müşteri tarafıyla başlayın.
• Seçenek kurallarını atlamak. Restoran siparişleri genellikle boyut, yan ürün veya pişirme tercihi gibi zorunlu seçimler ister.
• Uzun menü adlarını ve uç durumları test etmemek. Gerçek menüler, düzenli örnek kartlardan çok daha sorunlu öğeler içerir.
• Toplamları kontrol etmeden yayınlamak. Ödeme bağlamadan önce ara toplamı, ücretleri ve nihai tutarı doğrulayın.

Faydalı bir kural, önce tek bir temiz akışı çalıştırmaktır: uygulamayı aç, ürün seç, ürünü yapılandır, sepete ekle, öde, onayı gör. Bundan sonra özellikleri genişletin.