Atölye ne hedefliyor?

Katılımcılar:

• Figma’da ürün mantığı olan (CRUD) bir arayüz tasarlaması
• Bu tasarımı FlutterFlow ortamına doğru şekilde aktarması
• Basit ama gerçek hayata yakın bir uygulamayı çalışır hâle getirmesi

hedeflenmektedir.

Kimler Katılabilir?

• UX / UI Designer’lar
• Front-end geliştiriciler
• No-code / low-code ile ürün geliştirmek isteyenler
• Startup ekipleri ve ürün yöneticileri
• Teknik olmayan ama “çalışan ürün” görmek isteyen ekipler

Kod bilgisi zorunlu değil, temel ürün mantığı yeterlidir.

Atölye Eğitim İçeriği

Bölüm-01: Ürün Mantığı & CRUD Kavramı

Amaç:
“Ekran tasarlamak” ile “ürün tasarlamak” arasındaki farkı kurmak

İçerik:

• CRUD nedir? (Create – Read – Update – Delete)
• Gerçek hayattan örnekler:
  • Görev listesi
  • Müşteri kayıt ekranı
  • Basit envanter uygulaması
• Veri, ekran ve kullanıcı aksiyonu ilişkisi
• No-code ürünlerde düşünme modeli

Bölüm-02: Figma’da CRUD Odaklı UI Tasarımı

Amaç:
FlutterFlow’a sorunsuz aktarılabilecek bir Figma yapısı kurmak

İçerik:

• Frame yapısı & sayfa organizasyonu
• Liste ekranı (Read)
• Kayıt ekleme formu (Create)
• Düzenleme ekranı (Update)
• Silme aksiyonu için UI kararları (Delete)
• Component kullanımı (buton, input, card)
• Naming & layer disiplini (aktarımı kolaylaştırmak için)

Bölüm-03: Figma → FlutterFlow Aktarımı

Amaç:
“Tasarım bozulmadan” FlutterFlow’a geçiş

İçerik:

• FlutterFlow genel mantığı
• Figma import süreci
• Auto-layout & responsive davranışlar
• Component’lerin FlutterFlow karşılıkları
• En sık yapılan aktarım hataları

Bölüm-04: FlutterFlow’da CRUD Uygulaması Geliştirme

Amaç:
Gerçekten çalışan bir uygulama üretmek

İçerik:

• Veri modeli oluşturma
• Collection / field mantığı
• Listeleme (Read)
• Form ile veri ekleme (Create)
• Veri güncelleme (Update)
• Silme aksiyonu (Delete)
• Basit validasyonlar
• Action & logic bağlama

Bölüm-05: Yayına Hazırlık & Ürünleştirme

İçerik:

• UI/UX iyileştirme ipuçları
• Performans & kullanılabilirlik önerileri
• MVP mantığı
• Gerçek projelerde nasıl ölçeklenir?
• FlutterFlow + geliştirici işbirliği modeli