04.04.2026
Yeni Kullanıcı Karşılama Ekranı Tasarımı
Figma AI komutlarıyla mobil uygulamalara özel hoş geldin ekranı tasarımı üretmek için yapılandırılmış bir prompt şablonu sunar. Manuel bileşen yerleştirme ve hizalama işlemleri yerine, doğal dil komutlarıyla saniyeler içinde kullanıma hazır bir ekran düzeni elde etmeyi sağlar.
- Figma AI'ın generate layer ve edit with AI özelliklerine doğrudan uyumlu komut yapısı içerir.
- Başlık, alt başlık, CTA butonu, görsel alanı ve navigasyon gibi temel bileşenlerin otomatik yerleşimini tanımlar.
- Renk paleti, tipografi hiyerarşisi ve boşluk kuralları (spacing tokens) Figma'nın auto-layout mantığına göre yapılandırılmıştır.
- Hoş geldin e-postasıyla görsel tutarlılık sağlamak için marka rengi ve ton bilgisi değişken olarak eklenebilir; böylece e-posta ve uygulama içi deneyim arasında bütünlük kurulur.
- Manuel yöntemde her bileşen ayrı ayrı çizilip hizalanırken, bu prompt ile Figma AI tek komutla tüm ekran iskeletini oluşturur ve düzenlemeye hazır hale getirir.
- iOS ve Android için ayrı frame boyutlarına uyarlanabilir; responsive davranış kuralları prompt içinde belirtilmiştir.
- Tasarım çıktısı, geliştirici teslimi (developer handoff) için hazır inspect değerleriyle birlikte gelir.
- Uygulamaya yeni kayıt olan kullanıcıyı karşılayan, değer önerisini net aktaran ve ilk eylemi yönlendiren bir ekran akışı için uçtan uca bileşen listesi sağlar.
{ }Değişken Açıklamaları:
- [UYGULAMA ADI]: Uygulamanın resmi adı. Örneğin; FitTrack, MoneyWise, LangMaster
- [IOS / ANDROID / HER İKİSİ]: Uygulamanın hedeflendiği platform. Örneğin; IOS, ANDROID, HER İKİSİ
- [ANA RENK HEX]: Markanın ana rengi HEX kodu. Örneğin; #FF6B35, #4A90E2, #50C878
- [IKINCIL RENK HEX]: Markanın ikincil rengi HEX kodu. Örneğin; #A8E6CF, #FFD93D, #FF8E53
- [MODERN / KLASIK / PLAYFUL]: Tipografi stili seçenekleri. Örneğin; MODERN, KLASIK, PLAYFUL
- [HEDEF KITLE]: Uygulamanın hedef kitlesi. Örneğin; genç sporcular, girişimciler, dil öğrencileri
- [TIPOGRAFI STILI]: Kullanılan tipografi stili. Örneğin; modern, klasik, playful
- [KULLANICI ADI]: Kullanıcının kişiselleştirilmiş adı. Örneğin; Ayşe, Mehmet, Deniz
- [KARSILAMA MESAJI]: Hoş geldin ekranındaki kişiselleştirilmiş mesaj. Örneğin; Uygulamamıza hoş geldin!, Maceraya hazır mısın?, Hedeflerine ulaşmaya başla!
Gemini
Değişkenleri Düzenle
Sen Figma AI aracısın. Aşağıdaki talimata göre mobil uygulama için bir hoş geldin ekranı (onboarding welcome screen) tasarla ve her bileşeni Figma'nın auto-layout kurallarına göre yapılandır.
UYGULAMA BİLGİLERİ:
Uygulama adı: [UYGULAMA ADI]
Hedef platform: [IOS / ANDROID / HER İKİSİ]
Marka ana rengi: [ANA RENK HEX]
Marka ikincil rengi: [IKINCIL RENK HEX]
Tipografi stili: [MODERN / KLASIK / PLAYFUL]
Hedef kitle: [HEDEF KITLE]
EKRAN YAPISI — aşağıdaki katman sırasına göre oluştur:
1. FRAME
- Frame adı: "Welcome Screen - [UYGULAMA ADI]"
- Boyut: iPhone 14 Pro (393x852px) ve Android (360x800px) için ayrı frame oluştur
- Arka plan: [ANA RENK HEX] %8 opaklıkta gradient veya düz beyaz
2. HERO GÖRSEL ALANI (üst %45)
- Yüksek kaliteli bir illustrasyon placeholder (image fill) ekle
- Köşe yarıçapı: 24px
- Margin: 24px yatay, 48px üst
- Figma AI komutu: "Generate a warm, welcoming hero illustration for [UYGULAMA ADI] app, [HEDEF KITLE] audience, [TIPOGRAFI STILI] style"
3. METİN BLOĞU (orta %30)
- Başlık: "Hoş Geldin, [KULLANICI ADI]!"
Font weight: Bold, Boyut: 28px, Renk: #1A1A2E
- Alt başlık (hoş geldin e-postasıyla aynı mesajı yansıt): "[KARSILAMA MESAJI]"
Font weight: Regular, Boyut: 16px, Renk: #6B7280, Line height: 24px
- Metin bloğu hizalaması: Center
- Auto-layout: Vertical, Gap: 12px, Padding: 0 32px
4. ÖZELLİK NOKTALARI (opsiyonel, 3 madde)
- Her madde için: ikon (16px) + kısa metin (14px) kombinasyonu
- Layout: Horizontal auto-layout, Gap: 8px
- 3 maddeyi dikey olarak listele, Gap: 16px
- Figma AI komutu: "Generate 3 feature highlight rows with icons for [UYGULAMA ADI], matching [ANA RENK HEX] brand color"
5. CTA BUTON ALANI (alt %25)
- Birincil buton: "Hemen Başla"
Renk: [ANA RENK HEX], Metin: Beyaz, Height: 56px, Corner radius: 16px, Full width (margin: 24px yatay)
- İkincil bağlantı: "Zaten hesabım var, giriş yap"
Renk: [ANA RENK HEX], Underline, Font size: 14px
- Butonlar arası gap: 16px
- Alt güvenlik notu: "Kredi kartı gerekmez · İstediğin zaman iptal et" (12px, #9CA3AF)
6. COMPONENT AYARLARI
- Tüm metin katmanlarını "Text Style" olarak kaydet
- Butonları "Button/Primary" ve "Button/Ghost" component olarak tanımla
- Renkleri "Color Style" olarak Figma kütüphanesine ekle
- Her bileşene açıklayıcı layer adı ver (İngilizce, kebab-case)
7. PROTOTIP AKIŞI
- "Hemen Başla" butonuna tıklandığında → Ana ekrana (Home) yönlendir
- Transition: Smart Animate, Easing: Ease Out, Duration: 300ms
- "Giriş yap" bağlantısına tıklandığında → Login ekranına yönlendir
8. DEVELOPER HANDOFF NOTLARI
- Her bileşen için inspect panelinde spacing token değerlerini göster
- Renk değerlerini HEX ve RGB formatında belirt
- Export ayarı: PNG @2x ve @3x, SVG ikonlar için
KALİTE KONTROLÜ:
Tasarımı tamamladıktan sonra şunları kontrol et:
- Kontrast oranı WCAG AA standardını karşılıyor mu? (metin/arka plan)
- Tüm dokunma hedefleri minimum 44x44px boyutunda mı?
- Auto-layout kırılıyor mu? Farklı içerik uzunluklarında test et.
- Hoş geldin e-postasındaki marka sesi ve görsel kimlikle tutarlı mı?
Sen Figma AI aracısın. Aşağıdaki talimata göre mobil uygulama için bir hoş geldin ekranı (onboarding welcome screen) tasarla ve her bileşeni Figma'nın auto-layout kurallarına göre yapılandır.
UYGULAMA BİLGİLERİ:
Uygulama adı: [UYGULAMA ADI]
Hedef platform: [IOS / ANDROID / HER İKİSİ]
Marka ana rengi: [ANA RENK HEX]
Marka ikincil rengi: [IKINCIL RENK HEX]
Tipografi stili: [MODERN / KLASIK / PLAYFUL]
Hedef kitle: [HEDEF KITLE]
EKRAN YAPISI — aşağıdaki katman sırasına göre oluştur:
1. FRAME
- Frame adı: "Welcome Screen - [UYGULAMA ADI]"
- Boyut: iPhone 14 Pro (393x852px) ve Android (360x800px) için ayrı frame oluştur
- Arka plan: [ANA RENK HEX] %8 opaklıkta gradient veya düz beyaz
2. HERO GÖRSEL ALANI (üst %45)
- Yüksek kaliteli bir illustrasyon placeholder (image fill) ekle
- Köşe yarıçapı: 24px
- Margin: 24px yatay, 48px üst
- Figma AI komutu: "Generate a warm, welcoming hero illustration for [UYGULAMA ADI] app, [HEDEF KITLE] audience, [TIPOGRAFI STILI] style"
3. METİN BLOĞU (orta %30)
- Başlık: "Hoş Geldin, [KULLANICI ADI]!"
Font weight: Bold, Boyut: 28px, Renk: #1A1A2E
- Alt başlık (hoş geldin e-postasıyla aynı mesajı yansıt): "[KARSILAMA MESAJI]"
Font weight: Regular, Boyut: 16px, Renk: #6B7280, Line height: 24px
- Metin bloğu hizalaması: Center
- Auto-layout: Vertical, Gap: 12px, Padding: 0 32px
4. ÖZELLİK NOKTALARI (opsiyonel, 3 madde)
- Her madde için: ikon (16px) + kısa metin (14px) kombinasyonu
- Layout: Horizontal auto-layout, Gap: 8px
- 3 maddeyi dikey olarak listele, Gap: 16px
- Figma AI komutu: "Generate 3 feature highlight rows with icons for [UYGULAMA ADI], matching [ANA RENK HEX] brand color"
5. CTA BUTON ALANI (alt %25)
- Birincil buton: "Hemen Başla"
Renk: [ANA RENK HEX], Metin: Beyaz, Height: 56px, Corner radius: 16px, Full width (margin: 24px yatay)
- İkincil bağlantı: "Zaten hesabım var, giriş yap"
Renk: [ANA RENK HEX], Underline, Font size: 14px
- Butonlar arası gap: 16px
- Alt güvenlik notu: "Kredi kartı gerekmez · İstediğin zaman iptal et" (12px, #9CA3AF)
6. COMPONENT AYARLARI
- Tüm metin katmanlarını "Text Style" olarak kaydet
- Butonları "Button/Primary" ve "Button/Ghost" component olarak tanımla
- Renkleri "Color Style" olarak Figma kütüphanesine ekle
- Her bileşene açıklayıcı layer adı ver (İngilizce, kebab-case)
7. PROTOTIP AKIŞI
- "Hemen Başla" butonuna tıklandığında → Ana ekrana (Home) yönlendir
- Transition: Smart Animate, Easing: Ease Out, Duration: 300ms
- "Giriş yap" bağlantısına tıklandığında → Login ekranına yönlendir
8. DEVELOPER HANDOFF NOTLARI
- Her bileşen için inspect panelinde spacing token değerlerini göster
- Renk değerlerini HEX ve RGB formatında belirt
- Export ayarı: PNG @2x ve @3x, SVG ikonlar için
KALİTE KONTROLÜ:
Tasarımı tamamladıktan sonra şunları kontrol et:
- Kontrast oranı WCAG AA standardını karşılıyor mu? (metin/arka plan)
- Tüm dokunma hedefleri minimum 44x44px boyutunda mı?
- Auto-layout kırılıyor mu? Farklı içerik uzunluklarında test et.
- Hoş geldin e-postasındaki marka sesi ve görsel kimlikle tutarlı mı?
UYGULAMA BİLGİLERİ:
Uygulama adı: [UYGULAMA ADI]
Hedef platform: [IOS / ANDROID / HER İKİSİ]
Marka ana rengi: [ANA RENK HEX]
Marka ikincil rengi: [IKINCIL RENK HEX]
Tipografi stili: [MODERN / KLASIK / PLAYFUL]
Hedef kitle: [HEDEF KITLE]
EKRAN YAPISI — aşağıdaki katman sırasına göre oluştur:
1. FRAME
- Frame adı: "Welcome Screen - [UYGULAMA ADI]"
- Boyut: iPhone 14 Pro (393x852px) ve Android (360x800px) için ayrı frame oluştur
- Arka plan: [ANA RENK HEX] %8 opaklıkta gradient veya düz beyaz
2. HERO GÖRSEL ALANI (üst %45)
- Yüksek kaliteli bir illustrasyon placeholder (image fill) ekle
- Köşe yarıçapı: 24px
- Margin: 24px yatay, 48px üst
- Figma AI komutu: "Generate a warm, welcoming hero illustration for [UYGULAMA ADI] app, [HEDEF KITLE] audience, [TIPOGRAFI STILI] style"
3. METİN BLOĞU (orta %30)
- Başlık: "Hoş Geldin, [KULLANICI ADI]!"
Font weight: Bold, Boyut: 28px, Renk: #1A1A2E
- Alt başlık (hoş geldin e-postasıyla aynı mesajı yansıt): "[KARSILAMA MESAJI]"
Font weight: Regular, Boyut: 16px, Renk: #6B7280, Line height: 24px
- Metin bloğu hizalaması: Center
- Auto-layout: Vertical, Gap: 12px, Padding: 0 32px
4. ÖZELLİK NOKTALARI (opsiyonel, 3 madde)
- Her madde için: ikon (16px) + kısa metin (14px) kombinasyonu
- Layout: Horizontal auto-layout, Gap: 8px
- 3 maddeyi dikey olarak listele, Gap: 16px
- Figma AI komutu: "Generate 3 feature highlight rows with icons for [UYGULAMA ADI], matching [ANA RENK HEX] brand color"
5. CTA BUTON ALANI (alt %25)
- Birincil buton: "Hemen Başla"
Renk: [ANA RENK HEX], Metin: Beyaz, Height: 56px, Corner radius: 16px, Full width (margin: 24px yatay)
- İkincil bağlantı: "Zaten hesabım var, giriş yap"
Renk: [ANA RENK HEX], Underline, Font size: 14px
- Butonlar arası gap: 16px
- Alt güvenlik notu: "Kredi kartı gerekmez · İstediğin zaman iptal et" (12px, #9CA3AF)
6. COMPONENT AYARLARI
- Tüm metin katmanlarını "Text Style" olarak kaydet
- Butonları "Button/Primary" ve "Button/Ghost" component olarak tanımla
- Renkleri "Color Style" olarak Figma kütüphanesine ekle
- Her bileşene açıklayıcı layer adı ver (İngilizce, kebab-case)
7. PROTOTIP AKIŞI
- "Hemen Başla" butonuna tıklandığında → Ana ekrana (Home) yönlendir
- Transition: Smart Animate, Easing: Ease Out, Duration: 300ms
- "Giriş yap" bağlantısına tıklandığında → Login ekranına yönlendir
8. DEVELOPER HANDOFF NOTLARI
- Her bileşen için inspect panelinde spacing token değerlerini göster
- Renk değerlerini HEX ve RGB formatında belirt
- Export ayarı: PNG @2x ve @3x, SVG ikonlar için
KALİTE KONTROLÜ:
Tasarımı tamamladıktan sonra şunları kontrol et:
- Kontrast oranı WCAG AA standardını karşılıyor mu? (metin/arka plan)
- Tüm dokunma hedefleri minimum 44x44px boyutunda mı?
- Auto-layout kırılıyor mu? Farklı içerik uzunluklarında test et.
- Hoş geldin e-postasındaki marka sesi ve görsel kimlikle tutarlı mı?
Sen Figma AI aracısın. Aşağıdaki talimata göre mobil uygulama için bir hoş geldin ekranı (onboarding welcome screen) tasarla ve her bileşeni Figma'nın auto-layout kurallarına göre yapılandır.
UYGULAMA BİLGİLERİ:
Uygulama adı: [UYGULAMA ADI]
Hedef platform: [IOS / ANDROID / HER İKİSİ]
Marka ana rengi: [ANA RENK HEX]
Marka ikincil rengi: [IKINCIL RENK HEX]
Tipografi stili: [MODERN / KLASIK / PLAYFUL]
Hedef kitle: [HEDEF KITLE]
EKRAN YAPISI — aşağıdaki katman sırasına göre oluştur:
1. FRAME
- Frame adı: "Welcome Screen - [UYGULAMA ADI]"
- Boyut: iPhone 14 Pro (393x852px) ve Android (360x800px) için ayrı frame oluştur
- Arka plan: [ANA RENK HEX] %8 opaklıkta gradient veya düz beyaz
2. HERO GÖRSEL ALANI (üst %45)
- Yüksek kaliteli bir illustrasyon placeholder (image fill) ekle
- Köşe yarıçapı: 24px
- Margin: 24px yatay, 48px üst
- Figma AI komutu: "Generate a warm, welcoming hero illustration for [UYGULAMA ADI] app, [HEDEF KITLE] audience, [TIPOGRAFI STILI] style"
3. METİN BLOĞU (orta %30)
- Başlık: "Hoş Geldin, [KULLANICI ADI]!"
Font weight: Bold, Boyut: 28px, Renk: #1A1A2E
- Alt başlık (hoş geldin e-postasıyla aynı mesajı yansıt): "[KARSILAMA MESAJI]"
Font weight: Regular, Boyut: 16px, Renk: #6B7280, Line height: 24px
- Metin bloğu hizalaması: Center
- Auto-layout: Vertical, Gap: 12px, Padding: 0 32px
4. ÖZELLİK NOKTALARI (opsiyonel, 3 madde)
- Her madde için: ikon (16px) + kısa metin (14px) kombinasyonu
- Layout: Horizontal auto-layout, Gap: 8px
- 3 maddeyi dikey olarak listele, Gap: 16px
- Figma AI komutu: "Generate 3 feature highlight rows with icons for [UYGULAMA ADI], matching [ANA RENK HEX] brand color"
5. CTA BUTON ALANI (alt %25)
- Birincil buton: "Hemen Başla"
Renk: [ANA RENK HEX], Metin: Beyaz, Height: 56px, Corner radius: 16px, Full width (margin: 24px yatay)
- İkincil bağlantı: "Zaten hesabım var, giriş yap"
Renk: [ANA RENK HEX], Underline, Font size: 14px
- Butonlar arası gap: 16px
- Alt güvenlik notu: "Kredi kartı gerekmez · İstediğin zaman iptal et" (12px, #9CA3AF)
6. COMPONENT AYARLARI
- Tüm metin katmanlarını "Text Style" olarak kaydet
- Butonları "Button/Primary" ve "Button/Ghost" component olarak tanımla
- Renkleri "Color Style" olarak Figma kütüphanesine ekle
- Her bileşene açıklayıcı layer adı ver (İngilizce, kebab-case)
7. PROTOTIP AKIŞI
- "Hemen Başla" butonuna tıklandığında → Ana ekrana (Home) yönlendir
- Transition: Smart Animate, Easing: Ease Out, Duration: 300ms
- "Giriş yap" bağlantısına tıklandığında → Login ekranına yönlendir
8. DEVELOPER HANDOFF NOTLARI
- Her bileşen için inspect panelinde spacing token değerlerini göster
- Renk değerlerini HEX ve RGB formatında belirt
- Export ayarı: PNG @2x ve @3x, SVG ikonlar için
KALİTE KONTROLÜ:
Tasarımı tamamladıktan sonra şunları kontrol et:
- Kontrast oranı WCAG AA standardını karşılıyor mu? (metin/arka plan)
- Tüm dokunma hedefleri minimum 44x44px boyutunda mı?
- Auto-layout kırılıyor mu? Farklı içerik uzunluklarında test et.
- Hoş geldin e-postasındaki marka sesi ve görsel kimlikle tutarlı mı?
Bu Prompt Seni Bekliyor
Figma AI için hazırlanmış bu promptu anında kopyala, kullan.
Ücretsiz üye ol, binlerce prompta eriş.
5,595 üye
1,991 prompt
19,160 kopya
534,692 görüntülenme
10 saniyede üye ol, sınırsız prompt keşfet
Nile
"Sizin için dünyanın en güzel promptlarını üretiyorum."
Üyelik
21.12.2025
Son Giriş
16.10.2026
Kullanım Zorluğu
Orta Seviye
Bu prompt kullanmadan önce düzenlemeniz gereken 9 değişken içerir.
Keşfet
Alternatif Araçlar
Biliyor muydunuz?
Prompt yazarken 'Lütfen' demek yerine doğrudan emir kipi kullanmak (Yap, Yaz, Oluştur, Analiz et) modellerin daha net ve hızlı çalışmasını sağlar.
En Popüler
İlgili Etiketler
AI Engine
Benzer promptlar
Topluluk Görüşleri
Bu içerik hakkında üyeler neler düşünüyor?
Topluluğa Katılın
Promptlarını paylaşmak, favorilerini kaydetmek ve içerik üreticileriyle etkileşime geçmek için hemen ücretsiz üye ol.
5,595 üye
1,751 yorum
1,165 içerikte tartışma