102.7K+İndir
Antigravity OpenDesign

Antigravity ile
OpenDesign’da
tasarlayın.

OpenDesign'da Antigravity ile arayüz tasarımı nasıl yapılır: girdi olarak ekran görüntüleri, her geçişi kontrol eden entegre tarayıcı, brief'ten incelenmiş dosyaya kadar bir kayıt akışı görevi ve başlamadan önce bilinmesi gereken sınırlar.

OpenDesign'ı indirin Kuruluma gidin

BU ANTIGRAVITY KILAVUZUNA ÜÇ ROTA

Antigravity için Bir Başlangıç Noktası Seçin

BU KILAVUZ · UI TASARIMI

Antigravity ile Ürün Arayüzü Oluşturun

Bu adım adım kılavuz; brief'i, referansları, tasarım kurallarını ve gözden geçirilmiş bir HTML artefaktı kapsar.

Bu kılavuzu okuyun KURULUM

Antigravity'yi Sıfırdan Kurma

Temiz kurulumdan, UI oluşturan ve doğrulayan bir Antigravity ajanına uzanan eksiksiz yol.

Kuruluma git KARŞILAŞTIRMA

Antigravity'yi Diğer Ajanlarla Karşılaştırın

Antigravity'nin tasarım işleri için Codex, Claude Code ve Cursor ile nasıl karşılaştırıldığı ve başka bir iş akışının ne zaman daha iyi bir seçim olduğu.

Karşılaştırmayı görün
Bu Sayfada Örnek
  1. Örnek
  2. Uygunluk
  3. Uyumluluk
  4. Kurulum
  5. İş Akışı
  6. Kaynaklar
  7. Sınırlamalar
  8. SSS

Tek Bir Uçtan Uca Antigravity Tasarım Görevi

Bir Antigravity Tasarım Görevi: Brief'ten Arayüze

Devir teslimden bitirme kontrolüne kadar izlenen tek bir görev: Antigravity'ye verdiğiniz brief ve kısıtlar, geri döndürdüğü artefakt ve bitmiş saymadan önce hâlâ yapmanız gereken inceleme. Aşağıdaki arayüz, bu sayfa için hazırlanmış örnekleyici bir örnektir, kaydedilmiş bir Antigravity çalıştırması değildir.

1Tasarım Brief'i ve Kısıtlar

Brief

Üç adımda bir ekip ürünü kayıt akışı tasarlayın: hesap, çalışma alanı, ekip arkadaşlarını davet etme. Devir teslimden önce her adımı masaüstü ve telefon genişliklerinde entegre tarayıcıda doğrulayın.

  • Tasarım sistemiOpenDesign kağıt tuvali — Albert Sans, tek bir yeşil vurgu
  • Kesme noktaları (breakpoints)1440px masaüstü, 390px mobil, yatay kaydırma olmadan
  • EtkileşimlerAdım gezinmesi, satır içi doğrulama, daveti atlama yolu ve klavye odak sırası
  • ÇıktıSabit data-od-id kancalarına sahip tek, kendi kendine yeten bir HTML dosyası

2Kim Ne Yapar: Siz, Antigravity ve OpenDesign

  • Siz

    Brief'i siz yazarsınız, tasarım sistemini seçersiniz ve kabul kriterlerini belirlersiniz.

  • Antigravity

    Antigravity düzeni planlar, HTML, CSS ve JavaScript'i yazar, ardından istek üzerine revize eder.

  • OpenDesign

    OpenDesign tasarım sistemini ve skill'i sağlar, önizlemeyi oluşturur ve her sürümü bir proje dosyası olarak saklar.

  • İnceleme

    Devir teslimden önce görsel hiyerarşi, 8px ızgaradaki boşluklar, her iki kırılma noktası ve her etkileşim kontrol edilir.

3Antigravity Artefaktı: 1440px ve 390px'te Kayıt Akışı

Antigravity Artefaktı: 1440px ve 390px'te Kayıt Akışı — Masaüstü
Örnek gösterim

4Teslimden Önce İnceleme

Düzen

Izgara ve Boşluklar

Adım göstergesi, form ve özet 8px ızgaraya hizalanır; özet, formun yüksekliğini asla aşmaz.

Hiyerarşi

Görsel Hiyerarşi

Sıralama önce geçerli adımı, sonra soruyu, sonra alanları okur; yalnızca geçerli adım vurguyu taşır.

Duyarlı

Mobil Düzen

Mobilde adım göstergesi, geçerli etiketle birlikte noktalara sıkışır; özet tek bir toplam satırına daralır.

Etkileşim

Etkileşim Kontrolleri

Bir adım geri gitmeyi, bir doğrulama hatası tetiklemeyi ve davet adımını atlamayı test edin.

Uygunluk

Antigravity Nereye Uyar — ve Nereye Uymaz

Antigravity Şu Durumlarda Uygundur

  • Çok modlu ekran görüntüsü → UI. Gemini 3.x görüntü anlama ile bir referans görseli, ajanın orijinalle karşılaştırarak kontrol ettiği duyarlı işaretlemeye dönüşür.
  • Entegre tarayıcı doğrulaması. Antigravity ajanları yerleşik bir tarayıcıyı yönetir, UI'yi kırılma noktaları boyunca işler ve sonucu Artefakt olarak yakalar.
  • Editor View + Manager Surface. Uygulamalı kod için Editor View'da çalışın veya birkaç ajanı eşzamansız olarak yönetmek için Manager Surface'i kullanın.
  • Başlaması ücretsiz. Genel önizleme bireylere hiçbir maliyet getirmez ve bir Google hesabı üzerinden cömert Gemini 3.x hız sınırları sunar.

Şu Durumlarda Başka Bir Workflow Seçin

  • Düzenlenebilir vektör dosyalarına ihtiyacınız var. Antigravity'nin artefaktı HTML'dir, düzenlenebilir bir tasarım belgesi değildir. İhtiyacınız olan varlık biçimi için ayrı bir vektör iş akışına bakın.
  • Hiç referansınız ve kısıtınız yok. Bir tasarım sistemi veya örnekler olmadan çıktı genel bir görünüme yönelir; brief'i yazarak başlayın.
  • Bu ajanın gerektirdiği kimlik bilgisine sahip değilsiniz. Gerekli: Google hesabı (kişisel Gmail), genel önizlemede ücretsiz. OpenDesign kimlik bilgilerini ne sağlar ne de vekil olarak sunar.
  • Ekibiniz Cursor veya Kiro'da çalışıyor. Bu ajanların kendi sayfaları var; kurulum ajandan ajana değişir. ilgili ajanlar bölümüne bakın.

Uyumluluk

Başlamadan Önce Antigravity Gereksinimleri

Bu sayfa, OpenDesign masaüstü uygulaması üzerinden bağlanan Antigravity'yi kapsar. Referanslar 6 Eylül 2026'da kontrol edilmiştir.

Araç KapsamıAntigravity, Google tarafından

Antigravity, Google'ın ajan öncelikli geliştirme platformudur: otonom ajanların düzenleyici, terminal ve entegre bir tarayıcı genelinde çalıştığı yapay zeka destekli bir IDE. Gemini 3 ile birlikte genel önizlemede geldi. Buradaki odak, Antigravity'nin kendi arayüzü değil, OpenDesign aracılığıyla Antigravity ile arayüz tasarlamaktır. OpenDesign'ın kurulum notları mevcut ajanları adlandırır.

Hesaplar ve Kimlik DoğrulamaGoogle hesabı (kişisel Gmail), şu süre boyunca ücretsiz:

genel önizleme. Google hesabınızla kimlik doğrulayın — kimlik bilgileri makinenizde kalır. Bu sayfa bir kota veya fiyat vaat etmez.

Sistem ve SürümlerMasaüstü uygulama veya kaynak kod

Masaüstü derlemeleri için indirme sayfasına bakın. Kaynak hızlı başlangıçtaki Node.js ve pnpm gereksinimleri, kaynaktan çalıştırırken önemlidir; masaüstü paketi kurarken değil. Minimum uyumlu Antigravity sürümü: burada doğrulanmadı.

Bağlantı KontrolüBaşarı sinyali

Yüklü sürümünüzün gösterdiği bağlantı talimatlarını kullanın, ardından küçük bir görev deneyin. Antigravity'nin bunu hallettiğini ve çıktının açıldığını doğrulayın. İndirmenin kendisi çalışan bir bağlantıyı kanıtlamaz.

Masaüstü uygulamasıyla başlayın

Üç Adımda Antigravity Kurulumu

İndirmeyle başlayın, yüklü sürümünüz için Antigravity kurulumunu tamamlayın, ardından küçük bir sonucu test edin. Bu yolu izlemek, OpenDesign'ı kaynaktan derlemeyi gerektirmez.

  1. 1

    OpenDesign Masaüstü Uygulamasını İndirin

    Makineniz için paketi seçin, kurun ve uygulamayı başlatın.

    OpenDesign'ı indirin
    KONTROL NOKTASI
    Masaüstü uygulaması açılır. Zaten yüklüyse bir sonraki adıma geçin; ikinci bir indirme gerekmez.
  2. 2

    Antigravity Bağlantınızı Hazırlayın

    Yüklü sürümünüzle birlikte gelen Antigravity talimatlarını kullanın. Google hesabınızla oturum açın — kimlik bilgileri makinenizde kalır.

    # 1. Download Antigravity for your OS (macOS, Windows, Linux)
#    from the official download page: antigravity.google/download

# 2. Launch it and sign in
agy               # opens Antigravity; sign in with your Google account

# 3. Accept the data-use policy, pick a theme, and open your project folder

    Yayımlanmış kılavuzdaki Antigravity kurulum notlarından alınmıştır; güncel komutu satıcı belgelerinde doğrulayın.

    KONTROL NOKTASI
    Kullanmayı amaçladığınız ajanı ve hesabı doğrulayın. İkisinden biri kullanılamıyorsa, daha büyük bir göreve başlamadan önce uyumluluğu gözden geçirin.
  3. 3

    Küçük Bir Antigravity Görevi Çalıştırın

    İlk brief'i ölçülü tutun ki bir revizyon dahil tüm döngüyü değerlendirebilesiniz.

    Başlangıç brief’i

    Bir profil formu ve kaydetme onayı içeren bir ayarlar ekranı oluştur. Tasarım kurallarımı uygula. Masaüstü ve mobil genişliklerde doğrula.

    KONTROL NOKTASI
    Sonucu açın, kaydetme durumunu test edin ve belirli bir değişiklik isteyin. Üretim incelemeyi başlatır; onu bitirmez.

OpenDesign'ı kaynaktan çalıştırmak istiyorsanız, bunun yerine teknik hızlı başlangıcı kullanın.

Antigravity tasarım iş akışı

Antigravity'nin Beş Aşamalı Tasarım Döngüsü

İlk brief'ten denetlenmiş bir HTML çıktısına kadar izlenen tek bir kayıt akışı işi. Her aşamada: sizin girdiniz, Antigravity'nin hamlesi, OpenDesign'ın rolü ve hâlâ size ait olan kontrol.

  1. 1

    Tasarım Brief'i

    Üç ila altı sade cümle. Ekranın kime hizmet ettiğini, neyi başarması gerektiğini ve hangi platformların önemli olduğunu belirtin.

    • SizBrief'i taslak haline getirin. Bir referans ekran görüntüsü varsa ekleyin.
    • AntigravityBrief'i ve proje talimat dosyasını ayrıştırır, belirsiz olan her şeyi sorar.
    • OpenDesignProjeyi, prompt yüzeyini ve o çıktı türü için eşleşen skill'i sağlar.
    • KontrolBrief'in kabul kriterlerini açıkça belirttiğinden emin olun. Bunları üretimden önce netleştirmek, sonradan uyarlamaktan daha az maliyetlidir.
  2. 2

    Tasarım Kısıtları

    Bir tasarım sistemi artı kısa bir vazgeçilmezler listesi. Markaya özgü iş ile varsayılan görünüm arasındaki çizgi budur.

    • SizBir tasarım sistemi seçin, kırılma noktalarını adlandırın ve görünmesi gereken bileşenleri listeleyin.
    • AntigravityBir satır yazmadan önce, DESIGN.md token'larını ve duruş kurallarını bağlama yükler.
    • OpenDesignTasarım sistemi kitaplığını sağlar ve seçiminizi skill şablonuna bağlar.
    • KontrolToken'ların markayla eşleştiğini kontrol edin: bir vurgu rengi, doğru yazı tipleri, doğru köşe yarıçapı.
  3. 3

    Arayüzü Oluştur

    Antigravity, düzen, stiller, etkileşimler ve kararlı kancalar dahil olmak üzere tek, kendi kendine yeten bir HTML dosyası üretir.

    • SizAntigravity bir açıklayıcı soru sormadıkça bekleyin. Yapılandırılacak bir şey yok.
    • AntigravityBölümleri planlar, HTML, CSS ve JavaScript yazar, ardından dosyayı çalıştırır ve hataları onarır.
    • OpenDesignArtefaktı proje klasörüne yazar ve önizlenebilmesi için dizine ekler.
    • KontrolHenüz değil. Kaynağı değil, oluşturulan dosyayı değerlendirin.
  4. 4

    Önizleme

    OpenDesign dosyayı belirttiğiniz genişliklerde oluşturur. Tasarımın gerçekten değerlendirildiği nokta burasıdır.

    • SizGenişlikleri değiştirin, etkileşimleri deneyin ve doğrudan öğeler üzerine yorum yapın.
    • AntigravityÖnizleme yorumlarınızı toplar ve bir sonraki revizyonu hazırlar.
    • OpenDesignÖnizleme görüntüsünü sağlar ve yorumların ve düzenlemelerin bağlanabilmesi için data-od-id hedeflerini açığa çıkarır.
    • KontrolHiyerarşiyi, kontrastı, 390px'te taşmayı, odak durumlarını ve vurgunun ölçülü kullanılıp kullanılmadığını kontrol edin.
  5. 5

    Revize Et ve Doğrula

    Değişiklik istemek için önizleme öğelerini işaret edin. Her revizyon yeni bir dosya olarak gelir, böylece hiçbir şey iz bırakmadan üzerine yazılmaz.

    • SizYorumları somut isteklere dönüştürün ve görevin ne zaman bittiğine karar verin.
    • Antigravityİstenen değişiklikleri yerinde uygular ve dosyayı yeniden çalıştırır.
    • OpenDesignSürümleri yan yana tutar ve işiniz bittiğinde bir görseli veya HTML'i dışa aktarır.
    • KontrolÖnce yalnızca değişen alanı, ardından her kırılma noktasında tam sayfayı bir kez yeniden kontrol edin.

Kaynaklar

Antigravity Tasarım Kaynakları

Skill'ler

Tasarım Skill'leri

Antigravity'nin OpenDesign içinde üretebileceği artefakt türleri; her tür için bir beceri.

Skill'lere göz atın Tasarım sistemleri

Tasarım Sistemleri

Antigravity üretmeye başlamadan önce bağlanacak marka belirteçleri ve bileşenleri.

Sistemlere göz atın Şablonlar

Şablonlar

Sunumlar, açılış sayfaları ve ürün ekranları için başlangıç noktaları.

Şablonlara göz atın

Sınırlamalar

Antigravity Sınırları, Manuel Kontroller ve Yedek Yollar

  • KapsamBuradaki kapsam, OpenDesign içine bağlanmış bir ajan olarak Antigravity'dir; Antigravity'nin tüm özellik seti değil.
  • Kullanım SınırlarıKullanım sınırları ve maliyet, getirdiğiniz kimlik bilgisine bağlıdır (Google hesabı (kişisel Gmail), genel önizlemede ücretsiz). Bu sayfada ücretsiz kota iddiasında bulunulmamaktadır.
  • AğYerel proje dosyaları çevrimdışı çıkarım anlamına gelmez. Hassas girdileri beslemeden önce ajanınızın sağlayıcı ayarlarını ve veri politikalarını gözden geçirin.
  • Çıktı HTML'dirArtefaktlar vektör tasarım belgeleri değil, HTML dosyalarıdır.
  • Manuel İncelemeÖnizlemede erişilebilirliği, gerçek içeriği, marka uyumunu ve etkileşim doğruluğunu siz incelersiniz. Herhangi bir ajan öz denetimi yalnızca ilk geçiştir.
  • Yedek ÇözümAjan kullanılamadığında veya bir görev başarısız olduğunda, yüklü sürümünüzün bağlantı talimatlarına ve kimlik doğrulamasına başvurun. Yapılandırmayı değiştirmeden önce hatayı ve son çalışan çıktıyı saklayın.

SSS

Antigravity ve OpenDesign Hakkında Sık Sorulan Sorular

Antigravity gerçekten tasarım işini üstlenebilir mi?
Evet — bağlamda estetik bir skill, bir design system ve gerçek referans görseller bulunduğunda Antigravity, üretim kalitesinde, duyarlı (responsive) UI üretir ve çok modlu Gemini 3.x ajanları çıktıyı entegre tarayıcıda doğrular. Bu bağlam olmadan genellikle sıradan bir görünüme yönelir; OpenDesign'ın doldurduğu boşluk da tam olarak budur.
Antigravity ile tasarım yapmak için ödeme yapmam gerekir mi?
Antigravity, kişisel bir Google hesabıyla oturum açtığınızda Gemini 3.x üzerinde geniş hız sınırlarıyla, bireyler için herkese açık önizlemede ücretsiz olarak sunulur. OpenDesign, hiçbir durumda kimlik bilgilerinizi vekil olarak kullanmaz.
Antigravity’yi tasarım için özellikle iyi yapan şey nedir?
Üç şey: ajanları, referans ekran görüntülerini iyi okuyan doğal olarak çok modlu Gemini 3.x modelleri üzerinde çalışır; ajanın UI'yi doğrulamak için yönetebileceği entegre bir tarayıcıyla gelir ve inceleyebileceğiniz Artifact'ler — ekran görüntüleri ve tarayıcı kayıtları — sunar. Zevk (taste) hâlâ sağladığınız design system, skill ve referanslardan gelir.
Ön uç tasarımı için Antigravity vs. Claude Code?
İkisi de güçlüdür. Claude Code, belirli, kod tabanını dikkate alan tasarım kararlarıyla tanınır; Antigravity'nin avantajı ise ajan öncelikli platformudur — çok modlu Gemini 3.x, doğrulama için entegre bir tarayıcı ve incelenebilir Artifact'ler. Birçok ekip her ikisini de kullanır — OpenDesign, tasarım iş akışınızı değiştirmeden ajanlar arasında geçiş yapmanıza olanak tanır.
Antigravity'nin İnşa Ettiklerini Nasıl Doğrularım?
Antigravity, ajanlarının yönetebileceği entegre bir tarayıcıyla gelir; böylece ajanlar UI'yi render eder, farklı breakpoint'lerde kontrol eder ve ekran görüntüleri ile tarayıcı kayıtlarını Artifact olarak yakalar. Bu Artifact'leri incelemek — ve ajanın çıktısını referanslarınızla karşılaştırmasını sağlamak — sonucu spesifikasyona uygun tutmanın yoludur.
Antigravity tam olarak nedir
Antigravity, Google'ın ajan öncelikli geliştirme platformudur — yan panel sohbet botları değil, otonom ajanların işi yapması için tasarlanmış yapay zeka destekli bir IDE'dir. 18 Kasım 2025'te Gemini 3 ile birlikte duyuruldu ve bireyler için ücretsiz genel önizlemede sunuldu; karmaşık, çok araçlı yazılım görevlerini düzenleyici, terminal ve entegre bir tarayıcı üzerinde çalışan bir ajana devretmenizi sağlar. Ajanları öncelikli olarak Google'ın çok modlu Gemini 3.x modelleri üzerinde çalışır.

Tasarım çalışmaları için üç özellik öne çıkıyor. Ajanları ekran görüntülerini okur ve gerçek düzen hakkında akıl yürütür, çünkü Gemini 3.x doğal olarak çok modludur. Gerçek bir tarayıcıyı kullanabilir, böylece oluşturduğunu işler ve doğrular. Ve Artifacts'ı ortaya çıkarır — görev listeleri, planlar, ekran görüntüleri ve tarayıcı kayıtları — böylece ham araç günlükleri yerine somut çıktıyı incelersiniz.

Editor View + Manager Surface: Editor View, sekme tamamlamaları ve satır içi komutlarla tanıdık bir yapay zeka IDE'sidir; Manager Surface, çalışma alanları genelinde eşzamansız çalışan birden çok ajanı başlatmanıza, düzenlemenize ve gözlemlemenize olanak tanır — uzun bir tasarım görevini yürütmek için doğal yer.

Entegre tarayıcı + Artifacts: Ajanlar yerleşik bir tarayıcıda hareket edebilir ve geri bildirim bırakabileceğiniz Artifacts (ekran görüntüleri, tarayıcı kayıtları, görev listeleri, planlar) üretebilir — platforma sonradan eklenmiş değil, içine inşa edilmiş bir doğrulama döngüsü.

Başlaması ücretsiz: Kişisel bir Google hesabıyla oturum açmak, Gemini 3.x üzerinde cömert hız sınırları sağlar; platform macOS, Windows ve Linux'ta çalışır.

Kimlik Bilgisi: Google hesabı (kişisel Gmail), genel önizleme sırasında ücretsiz

İkili: agy ile başlatın; macOS, Windows ve Linux'ta çalışır

Satıcı: Google
Çok modlu Gemini ve yerleşik tarayıcı tasarıma neden uygundur
Antigravity'nin tasarım avantajı, model ve platformun birlikte çalışmasından gelir — ancak her ajanda olduğu gibi, zevk yine de sağlanmalıdır.

Güçlü çok modlu anlayış: Gemini 3.x doğal olarak çok modlu olduğundan, ajan referans ekran görüntülerini iyi okur — işlenmiş çıktısını bir görüntüyle karşılaştırır, düz metin açıklamasından tahmin etmek yerine.

Doğrulama için entegre bir tarayıcı: Ajan gerçek bir tarayıcıyı kullanır, böylece kullanıcı arayüzünü işler, durumlar arasında kontrol eder ve bozuk düzenleri yakalar — ve sonucu inceleyebileceğiniz bir tarayıcı kaydı Artifact'ı olarak yakalar.

Ajanın okuduğu kurallar: Token'larınızı, bileşenlerinizi ve inceleme kurallarınızı ajanın proje bağlamında kodlayın, böylece varsayılan bir görünüm yerine markanıza göre çalışır.

Zevk, sağladığınız üç girdiden gelir: bir tasarım sistemi, bir beceri ve gerçek referans görselleri.

Ders, her ajanın öğrettiğiyle aynıdır: Antigravity varsayılan olarak zevke sahip değildir. Ona kısıtlamalar verdiğinizde iyi tasarım üretir — bir tasarım sistemi, estetik bir beceri ve somut referanslar. OpenDesign tam olarak bu girdileri paketler, bu yüzden ikisi birbirine uyar (aşağıda daha fazlası).
Tasarım işleri için Antigravity’yi sıfırdan kurun
İşte temiz bir makineden UI oluşturabilen ve doğrulayabilen bir Antigravity aracısına giden tam yol. Kesin uygulama içi menüler önizleme sırasında değişebilir, bu nedenle bu, güvenebileceğiniz düzeyde kalır.

Kurulum sırası: indir → Google ile oturum aç → projeni aç → tasarım kuralları ve bir beceri ekle → doğrulamak için entegre tarayıcıyı kullan.

Tasarım kurallarınızı kodlayın: Token'larınızı, temel öğelerinizi ve kurallarınızı aracının proje bağlamına koyun, böylece çıktı genel bir görünüme varsayılan olarak değil, bir markayla eşleşir.

Entegre tarayıcıyı kullanın: Aracının Antigravity'nin yerleşik tarayıcısında işlemesini sağlayın ve çıktısını kesme noktaları arasında kontrol edin — yalnızca derlemenin geçtiğini değil, UI'nin doğru göründüğünü doğrulayın.

Komutlar ve değişebilecek sürüme özgü ayrıntılar için geçerli kurulum bölümünü kullanın.

# 1. Download Antigravity for your OS (macOS, Windows, Linux) # from the official download page: antigravity.google/download # 2. Launch it and sign in agy # opens Antigravity; sign in with your Google account # 3. Accept the data-use policy, pick a theme, and open your project folder # 4. Start an agent task in the Editor View or the Manager Surface, # selecting a Gemini 3.x model (e.g. Gemini 3.1 Pro)
Önceki kılavuzdan tarihsel komut örneği; geçerli sözdizimini bağlantılı satıcı belgelerinde doğrulayın.
Ekran görüntülerini kullanıcı arayüzüne dönüştürme: iş akışı
Antigravity ile en yüksek kaldıraçlı tasarım döngüsü, bir referans görüntüsünü çalışan, duyarlı bir UI'ye dönüştürmek ve eşleşene kadar yinelemek — çıktıyı referansla karşılaştırmak için çok modlu modele ve doğrulamak için entegre tarayıcıya güvenmektir.

Elindeki en net görsel referanslardan başla — ve sadece bir ana görsel değil, birden çok durumu (masaüstü ve mobil, hover, boş, yükleniyor) ekle.

İstemde belirgin olun; belirsiz istemler güçlü bir modelle bile genel UI üretir.

Tasarım sisteminizi ve kurallarınızı aracının proje bağlamında tutun ve token'ların ve kanonik temel öğelerin nerede olduğunu söyleyin.

Aracının Antigravity'nin entegre tarayıcısında işlemesini sağlayın, sonucu kontrol etmek için kesme noktalarına yeniden boyutlandırın.

Aracının uygulamasını ekran görüntüleriyle karşılaştırmasını sağlayarak yineleyin — yalnızca derlendiğini onaylamakla kalmayın — ve ürettiği tarayıcı kaydı ve ekran görüntüsü Artifacts'larını inceleyin.

Referans görüntülerinizi ekleyin ve somut kısıtlamalar verin, ardından aracının tarayıcıda doğrulamasını sağlayın:

İstemleri küçük ve odaklı tutun, iyi yinelemeleri işleyin ve kötüleri geri alın (geri aldığınızda aracıya söyleyin), böylece her geçiş temiz bir temel üzerine inşa edilir.

# In an Antigravity agent task, attach reference-desktop.png and # reference-mobile.png, then prompt: Implement this design in React + Vite + Tailwind + TypeScript. Reuse my existing design-system components and tokens. Match spacing, layout, and hierarchy; make it responsive. Render it in the integrated browser and iterate until it matches the references across breakpoints, and show me the screenshots.
Önceki kılavuzdan tarihsel komut örneği; geçerli sözdizimini bağlantılı satıcı belgelerinde doğrulayın.
Ajan bağlamı, araçlar ve Artifacts
Üç uzantı noktası Antigravity'yi sürdürülebilir tasarım çalışması için pratik kılar ve üçü de açık bir tasarım iş akışına temiz şekilde oturur.

Proje bağlamı: Kalıcı proje kuralları, tasarım kurallarınız için kalıcı yuvadır — token'lar, primitifler ve ajanın her görevde okuduğu inceleme kontrol listeleri, böylece çıktı markaya uygun kalır.

Entegre tarayıcı + terminal: Ajanlar editör, terminal ve yerleşik bir tarayıcı genelinde hareket eder; böylece referans toplayabilir, bir geliştirme sunucusu çalıştırabilir ve render edilen arayüzü platformdan ayrılmadan doğrulayabilir.

İncelediğiniz Artifacts: Görev listeleri, uygulama planları, ekran görüntüleri ve tarayıcı kayıtları ajan çalışmasını okunur kılar; Artifact üzerinde geri bildirim bırakırsınız ve ajan düzeltmeleri dahil eder.

Bunlar ciddi bir tasarım döngüsünün ihtiyaç duyduğu yeteneklerdir — tam da OpenDesign'in her proje için yeniden oluşturmak yerine düzenlemek üzere inşa edildiği türden şeyler.
Tasarım için Antigravity, Codex, Claude Code, Cursor ve Gemini CLI: nasıl karşılaştırılır
Tasarım işi için tek bir kazanan yoktur — her ajanın farklı bir gücü vardır ve deneyimli ekipler onları üst üste kullanır. Adil bir özet:

Antigravity — Multimodal Gemini 3.x ile ajan öncelikli IDE, kendi kendini doğrulama için entegre tarayıcı ve incelenebilir Artifacts; önizlemede ücretsiz — UI'nin yerleşik tarayıcı doğrulamasıyla asenkron çok ajanlı derlemeler

Codex — Bir frontend skill'i ile güçlü görsel cila; sanal alanda asenkron derlemeler — Devredilen asenkron derlemeler ve taşınabilir AGENTS.md kuralları

Claude Code — Belirli tasarım kararları (hex, boşluk, tipografi) ve kod tabanına duyarlı UX — Frontend akıl yürütme ve büyük bağlamlı refaktörler

Cursor — Canlı önizleme ve satır içi düzenlemelerle görsel yap-ve-gör döngüsü — Bir IDE içinde sıkı yinele-ve-izle UI çalışması

Gemini CLI — 1M token bağlam ve ücretsiz katmana sahip multimodal Gemini üzerinde açık kaynak terminal ajanı — Ekran görüntüsü ağırlıklı terminal çalışması ve tüm bir tasarım sistemini bağlamda tutma

Topluluğun yinelenen hükmü, zevkin insanlardan geldiğidir: hepsi skill'ler, referanslar ve kısıtlamalar olmadan genel bir estetiğe varsayılan olur. Çözülmesi gereken gerçek sorun budur — ve bu model biçimli değil, tasarım aracı biçimlidir.

Ajan — Tasarım gücü — En uygun olduğu alan
Yaygın tuzaklar ve “AI slop” görünümünden kaçınma
AI tarafından üretilen tasarımla ilgili en yaygın şikâyet, genel görünmesidir — yumuşak gradyanlar, yüzen paneller, aşırı büyük yuvarlatılmış köşeler, dramatik gölgeler ve “bunu bir AI yaptı” diye bağıran Inter ve mor havası. Bildirilen diğer sorunlar arasında bozuk mobil düzenler ve talimatların arayüz metinlerine sızması yer alıyor. Bunların hiçbiri Antigravity'ye özgü değil; bunlar, herhangi bir agent özenle seçilmiş bir tasarım bağlamı olmadan çalıştığında olan şeylerdir.

Bir estetik beceri ekleyin: Özenle seçilmiş bir tasarım becerisi, agent'ı varsayılan görünüm yerine gerçek bir yöne bağlanmaya zorlar.

Entegre tarayıcıda doğrulayın: Çok kipli modeli ve Antigravity'nin yerleşik tarayıcısını kullanarak kırılma noktaları genelinde render edin ve kendi kendini kontrol edin, böylece düzenler mobilde sessizce bozulmaz.

Token'ları ve referansları sağlayın: Gerçek tasarım token'ları ve referans ekran görüntüleri, çıktı kalitesi üzerindeki en büyük tek kaldıraçtır.

Kuralları proje bağlamına kodlayın: “Hero kart yok, en fazla iki yazı tipi, marka öncelikli hiyerarşi” tarzı kuralları agent'ın her görevde okuduğu yere koyun.

Dikkat edin: Her önlem, agent'a özenle seçilmiş bir tasarım bağlamı vermekle ilgilidir. Bu bağlamı her proje için elle sürdürmek, OpenDesign'in ortadan kaldırdığı angaryadır.
OpenDesign içinde Antigravity ile tasarım yapmak
OpenDesign, yukarıdaki iş akışının sürekli istediği açık kaynaklı tasarım katmanıdır. Antigravity'yi birinci taraf bağdaştırıcı olarak ele alır ve onu özenle seçilmiş bir beceri ve tasarım sistemi kütüphanesi, yapılandırılmış bir render hattı ve yerel bir masaüstü arayüzü içine sarar — böylece Antigravity'yi iyi yapan tasarım bağlamı ilk çalıştırmadan itibaren oradadır, her seferinde elle bir araya getirilmez. OpenDesign açık kaynaklı ve yerel öncelikli olduğundan bu eşleşme doğal bir uyum sağlar.

OpenDesign'i kurun ve agent'ınız olarak Antigravity'yi seçin.

Google hesabınızla kimlik doğrulayın — kimlik bilgileri makinenizde kalır ve asla bizim üzerimizden proxy'lenmez.

Bir tasarım sistemi ve bir beceri seçin, ardından tutarlı bir zevkle sunumlar, prototipler ve açılış sayfaları oluşturun.

Her artefakt ve DESIGN.md dosyası kendi deponuzda yaşar, barındırılan bir bulutta değil.

Aynı Antigravity agent'ı, aynı Google hesabı — üstelik etrafında gerçek, taşınabilir, açık kaynaklı bir tasarım iş akışı. OpenDesign yerel öncelikli ve Apache-2.0'dır, dolayısıyla çalışmanız veya kimlik bilgilerinizle ilgili hiçbir şey makinenizden ayrılmaz.
OpenDesign’in Google ile herhangi bir bağlantısı var mı?
Hayır. OpenDesign bağımsızdır; Antigravity ve Gemini Google'ın ticari markalarıdır.