Tuval Duzenleyici
Tel cerceve duzenleme tuvali, ekranlarinizi tasarladiginiz ve rafine ettiginiz yerdir. Sol kenar cubugu tum cizim ve secim araclarini icerir, merkez ogeleri yerlestirdiginiz ve duzenlediginiz tuvaldir ve sag kenar cubugu secili ogenin ozelliklerini gosterir.
Araclar
Select
Tuvaldeki ogeleri secmek ve tasimak icin tiklayin. Secili ogeler ozelliklerini sag kenar cubugunda gosterir.
Square
Tuval uzerinde dikdortgen kapsayici ogeler cizin.
Circle
Tuval uzerinde dairesel ogeler cizin.
Text
Metin etiketleri ve icerik bloklari ekleyin.
Image
Gorsel yer tutucu ogeleri yerlestirin.
Button
Etkilesimli dugme ogeleri ekleyin.
Input
Form giris alanlari ekleyin.
+ (Add Screen)
Tel cerceve projesine yeni bir ekran ekleyin.
Kilitli Ogeler
Yapay zeka tarafindan olusturulan ekranlar varsayilan olarak kilitlidir — elemanlar kilitleri acilana kadar tasinamaz veya yeniden boyutlandirilamaz. Mevcut ekrandaki tum elemanlarin kilidini acmak icin Ctrl + D'ye basin, boylece yeniden duzenleme ve duzenleme icin tam kontrol elde edersiniz.
Film Seridi Modu
Film seridi modu, tum karelerinizi ve baglanti noktalarini kus bakisi gorunumunde gormenize olanak tanir. Sol kenar cubugundaki ayni dugmeyi kullanarak tek ekranli tuval ve film seridi modu arasinda gecis yapin. Film seridi modunda, her ekran duzeninin onizlemesiyle bir kart olarak gosterilir.
Film Seridi Ozellikleri
Kare Genel Bakisi
See all screens at a glance ile onlarin element counts ve visual previews.
Modal Olarak Ayarla
Mark any screen as a modal overlay instead of a full page.
Duzenlemek icin Tikla
Ayrintili duzenleme icin tuval gorunumune atlamak uzere herhangi bir kare kartina tiklayin.
Zum Kontrolleri
Film seridini yakinlastirmak/uzaklastirmak icin soldaki zum kontrollerini kullanin.
Akis Baglantilari
Kareler arasindaki akis eylemleri araciligiyla ekranlarin nasil baglandigini gorsellistirin.
Oge Ozellikleri
Icine girmek ve sag kenar cubugunda ozellikler panelini acmak icin herhangi bir tuval elemanina cift tiklayin. Panel uc sekmeye sahiptir: Ozellikler, Akis ve Renkler. Buradan her elemanin konumunu, boyutunu, stilini ve davranisini duzenleyebilirsiniz.
Ozellikler Sekmesi
Position (X, Y)
Ogenin tuval uzerindeki tam piksel konumunu ayarlayin.
Size (Width, Height)
Ogenin boyutlarini piksel cinsinden ayarlayin.
Z-Index (Layer Order)
Hangi ogelerin digerlerin ustunde gorunecegini kontrol edin.
Kenar Yuvarlatma
Kose yuvarlatmayi sayisal bir degerle ayarlayin veya Keskin, Yuvarlak veya Hap on ayarlarini kullanin.
Metin Icerigi
Ogenin icinde goruntulenen metni duzenleyin.
Renkler Sekmesi
Secili oge icin arka plan, kenarlik ve metin renklerini ozellestirin.
Akislar
Akislar, ekranlar arasindaki eylemleri ve gezinmeyi tanimlar. Bir akis, baska bir sayfaya gitme, bir modal acma veya farkli bir alana yonlendirme gibi bir eylemdir. Tuvaldeki kucuk baglanti simgeleri hangi ogelerin akislara sahip oldugunu gosterir. Kareler, yapay zeka olusturma sirasinda otomatik olarak birbirine baglanir ve akis baglantilari da olusturulur.
Akislari Ayarlama
Bir Oge Secin
Akis eklemek istediginiz ogeye tiklayin.
Akis Sekmesini Ac
Sag kenar cubugunda, mevcut baglantilari gormek veya yenilerini eklemek icin Akis sekmesine gecin.
Baglanti Ekle
Yeni bir akis olusturmak icin Ilk Baglantiyi Ekle (veya + dugmesi) dugmesine tiklayin. Baglanilacak bir hedef ekran veya kare secin.
Tuvalde Goruntule
Bagli ogeler, akis eylemleri oldugunu belirtmek icin tuvalde kucuk bir baglanti simgesi gosterir.
Blok Baglantilari
Blok Baglantilari, Blok Kutuphanesinden bloklari dogrudan wireframe elemanlarini eklemenize olanak tanir. Bir elemana cift tikladiginizda ve ozellikler panelinde asagi kaydiginizda, Blok Baglantilari bolumunu bulacaksiniz. Elemana bir blok (HTML, bilesen veya sablon) baglamak icin + Blok Ekle'ye tiklayin. Baglanan bloklar, yapay zeka ile kod olustururken referans alinir ve belirli HTML veya bilesen kodlarini wireframe elemanlarina eklemeyi kolaylastirir.
Yapay Zeka ile Duzenleme
Tuvalin alt kismindaki yapay zeka istem cubugu, ekranlari duzenlemek veya olusturmak icin yapay zekayi kullanmaniza olanak tanir. Soldaki acilir menuден yapay zeka modelinizi secin, istediginiz degisiklikleri tanimlayin ve yapay zeka wireframe'i sizin icin degistirecektir. Ayrica gelismis duzenleme icin ses girisi veya CLI Duzenleme dugmesini de kullanabilirsiniz.
Baglam Duyarli Istemleme
Tek Ekran
Tek bir ekrani duzenlerken, istem cubugu "Duzenleniyor: 'Ekran Adi'" gosterir ve yapay zeka degisiklikleri yalnizca bu ekrana uygulanir.
Storyboard
Film seridi modundayken, yapay zeka tum kareleri bir kerede duzenleyebilir veya mevcut olanlari referans olarak kullanarak yeni kareler olusturabilir.
Ses Girisi
Yazmak yerine talimatlarinizi dikte etmek icin istem cubugundaki mikrofon simgesini kullanin.
CLI Duzenleme
Yapay zeka destekli degisiklikler uzerinde daha fazla kontrol saglayan gelismis bir duzenleme modu icin CLI Duzenleme'ye tiklayin.
Disari Aktarma ve Entegrasyon
Wireframe'ler disa aktarilabilir, ice aktarilabilir veya projeler olusturulurken ya da Proje Hub'i icinde dogrudan kullanilabilir. Bu, wireframe tasarimindan islevsel bir projeye tasarimlari manuel olarak yeniden olusturmadan gecmenizi kolaylastirir.