AI UI Designer Logo
AI UI Designer

AI görsel servisleri için ekran tasarımı · SVG paketi

Arayüz tasarım kiti ile görsel servisinizin akışını koddan önce planlayın

Bu arayüz tasarım kiti, yapay zekâ ile görsel üreten bir servis geliştiren bağımsız yazılımcılar ve ürün ekipleri içindir. İstem girişini, sonuçları, geçmişi ve plan seçimini birlikte değerlendirin. Ardından ücretsiz AI UI Designer Skill ile Codex veya Claude Code içinde SVG metinlerini, yerleşimini ve temasını ürününüze uyarlayın.

Etkin ücretli aboneliğe dahildir. Kredi düşülmez.

Tüm ekran tasarımlarını inceleyin

Statik SVG tasarımları · Çince örnek metinler · Uygulama kodu içermez

İstem alanı, üretim ayarları ve sonuç kartları içeren açık temalı çalışma ekranı tasarımı
Paketteki görsel üretim alanı · Açık tema
Masaüstü sayfaları
6
Renk temaları
2
Mobil referanslar
2
Düzenlenebilir kaynaklar
SVG

İlk görselden sonra kullanıcı nereye gider?

Paketi indirmeden önce giriş, üretim, geçmiş ve hesap ekranlarını inceleyin. Her masaüstü sayfasında gri tonlu tel kafes ile açık ve koyu tasarımlar bulunur; hem yapıyı hem de görünümü değerlendirebilirsiniz.

Ürün tanıtımı, görsel galerisi ve kullanım adımları içeren açık ana sayfa tasarımı

Ürün ana sayfası

Servis açıklamasını, örnek görselleri ve üretime giriş alanını planlayın.

Giriş formu alanları ve kayıt yönlendirmesi içeren kimlik doğrulama tasarımı

Giriş ve kayıt

Giriş alanlarını inceleyin; kayıt ve hata mesajlarını durum panosunda değerlendirin.

İstem paneli, ayarlar ve görsel sonuç kartları içeren üretim ekranı tasarımı

Görsel üretim alanı

İstem, model, en-boy oranı, adet, kredi maliyeti ve sonuçları yerleştirin.

Arama, görsel kartları ve seçili görsel ayrıntıları içeren geçmiş tasarımı

Görsel geçmişi

Arama, ayrıntılar, parametreleri yeniden kullanma ve silme onayını inceleyin.

Kredi bakiyesi ve kurgusal üç plan içeren açık temalı sayfa tasarımı

Planlar ve krediler

Bakiyeyi, örnek planları ve satın alma sonucu tasarımlarını değerlendirin.

Profil formu ve kaydetme geri bildirimi içeren hesap tasarımı

Hesap ayarları

Profil alanlarını, kaydetme bildirimini ve çıkış konumunu planlayın.

Önizlemeler paketteki Çince örnek metinleri ve kurgusal ürün verilerini gösterir. Düğmeler, formlar ve satın alma ekranları statik tasarımlardır.

Boş ekranları, beklemeyi ve hataları da tasarıma katın

ZIP dosyası sayfaları, bileşenleri ve senaryo notlarını bir araya getirir. Değişiklikleri servisin diğer ekranlarıyla karşılaştırabilirsiniz.

Düzenlenebilir SVG kaynakları

Metinleri, şekilleri ve yerleşimi ürününüze göre değiştirin. Özgün paketi saklayın ve düzenlemeleri bir çalışma kopyasında yapın.

Önce yapı, sonra renkler

Tasarımlara 2 tema JSON dosyası eşlik eder. Bilgi hiyerarşisini tel kafeslerde değerlendirin, ardından açık veya koyu temayı seçin.

Bileşenler ve arayüz durumları

Düğmeler, alanlar, seçiciler, kartlar ve iletişim kutularıyla birlikte üretim sürüyor, boş geçmiş, yetersiz kredi, giriş hatası ve başarısız ödeme durumlarını inceleyin.

Mobil referansların kapsamı belli

Üretim alanı ve geçmiş 390px genişliğinde çizilmiştir. Diğer sayfaların mobil davranışları senaryoda açıklanır; ayrı mobil çizimler bulunmaz.

ZIP dosyasını içe aktarın, ardından gereksinimleri belirtin

Paket ücretsiz Skill ile içe aktarılabilir. Yardımcı betikler Python 3.9 veya üzerini gerektirir.

  1. 1

    Abonelik hesabınızla paketi indirin

    Etkin ücretli AI UI Designer aboneliğiyle oturum açın. Paket indirmek görsel üretim kredisi tüketmez.

  2. 2

    ZIP dosyasının yerel yolunu paylaşın

    AI UI Designer Skill’i Codex veya Claude Code’a kurun. ZIP dosyasının yerel yolunu verip asistandan paketi içe aktarmasını isteyin.

  3. 3

    Değişiklikleri tarif edin ve SVG’yi inceleyin

    Temayı, alanları ve yerleşimi belirtin. Sonucu kontrol edin ve özgün kaynakları koruyarak çalışma kopyasında düzenlemeye devam edin.

Örnek istek: e-ticaret ürün görselleri için çalışma alanı

Görsel üretim paketinin açık temasını kullanarak e-ticaret ürün görselleri için bir çalışma alanı tasarla. Ürün adı, öne çıkan özellikler ve görsel en-boy oranı seçimi ekle. Kredi maliyeti açıklamasını ve sonuç kartlarını koru. Tasarımı düzenlenebilir SVG olarak ver.

Kendi gereksinimlerinizden mi, hazır ekranlardan mı başlayacaksınız?

Ücretsiz Skill ile gereksinimlerden tasarım yapabilir, paket içe aktarabilir ve tema uygulayabilirsiniz. Bu ekran setini web sitesinden indirmek için etkin ücretli abonelik gerekir.

Kendi gereksinimlerinizden tasarım
Ücretsiz Skill · Ücretsiz
Paket içe aktarma ve tema uygulama
Ücretsiz Skill · Ücretsiz
Bu sayfa setini indirme
Senaryo paketi · Etkin ücretli abonelik
İndirilen dosyaları yerelde kullanma
Senaryo paketi · Abonelik bittikten sonra da
FAQ

Dosyalar, dil ve indirme koşulları

Paketin tasarım kapsamını ve ayrıca geliştirilmesi gereken işlevleri öğrenin.

Ekranları değerlendirin, ardından ürününüze uyarlayın

Arayüz tasarım kiti önizlemelerinde üretim, geçmiş ve planların nasıl düzenlendiğini inceleyin. Akış ürününüze uygunsa SVG paketini etkin ücretli abonelikle indirin ve ücretsiz Skill ile düzenleyin.

SVG tasarım paketini indir

Etkin ücretli aboneliğe dahildir. Kredi düşülmez.