Claude Design'ı bu açık kaynaklı alternatifle değiştirdim!

Bu kılavuz, Open Design'ı tamamen kendi makinenizde nasıl çalıştıracağınızı gösteriyor — bulut hesabı yok, tasarım başına ücretlendirme yok, dizüstü bilgisayarınızdan hiçbir şey dışarı çıkmıyor. Fikir, Open Design'ı yerel bir model çalıştırıcısı (Ollama gibi bir şey) ve zaten yüklü olan komut satırı kodlama ajanlarınızla eşleştirmek; böylece üretim yerelde gerçekleşir ve çalışmanız gizli kalır. AI Automation Station'ın yerel kurulum anlatımında izlediği yolu takip eder; güncel sürüme uyacak şekilde yeniden yazılmış ve güncellenmiştir. Canlı çalıştırma için yukarıdaki videoyu izleyin veya yazılı sürüm için okumaya devam edin.

Yerelde çalışan Open Design çalışma alanı — projeleriniz, ajanınız, makineniz.

Open Design nedir?

Open Design, açık kaynaklı, yerel öncelikli bir tasarım platformudur — Claude Design ve Figma'ya ajan-yerel (agent-native) bir alternatif. Tamamen yerel bir kurulumu mümkün kılan şey, çekirdek mimarisidir: tek bir model sağlayıcısına bağlı olmak yerine, Open Design zaten kullandığınız kodlama ajanının üzerinde çalışır. Claude Code, Codex, Cursor, Gemini, GitHub Copilot, OpenCode ve daha fazlası hepsi takılabilir. Bu sadece "kendi anahtarını getir" değil, "kendi ajanını getir"dir.

Bu, bu eğitim için önemlidir; çünkü seçtiğiniz ajan yerelde çalışıyorsa — Ollama gibi bir çalıştırıcı üzerinden yerel bir modeli süren açık bir komut satırı ajanı — o zaman tüm döngü makinenizde kalır. Yakılan kredi yok, uzak bir API'ye gönderilen istem (prompt) yok.

Bilinmeye değer birkaç şey:

• Açık kaynak, Apache-2.0 — klonlayın, kendiniz barındırın, her satırı okuyun.
• Yerelde çalışır — projeleriniz kendi klasörlerinizde yaşar, başkasının bulutunda değil.
• Ajan takılabilir — 21+ kodlama ajanı desteklenir; üretimi hangi CLI'nin süreceğini siz seçersiniz.
• Prototiplerden fazlası — prototipler, canlı yapay ürünler (artifact), slayt desteleri, dergi düzenleri, görsel üretimi ve hatta video, hepsi tek bir çalışma alanından.
• Gerçek başlangıç noktaları yerleşik — tanınmış markalardan (Airbnb, Airtable ve diğerleri) örnek alınan tasarım sistemleri, ayrıca şablonlar ve görsel ön ayarları; böylece hiçbir zaman boş bir tuvale bakmazsınız.

Claude Design'ı kullandıysanız, his tanıdık gelecek. Open Design aynı sakin estetiği korur ve tıpkı Claude Design gibi tarayıcıda çalışır — ardından alttaki motoru açar, böylece istediğiniz herhangi bir ajanı yerine takabilirsiniz.

Başlamadan önce

Open Design'ı kurmanın üç yolu var. Size uyanı seçin:

Yol	En uygun olduğu kişi	Gereksinimler
Masaüstü uygulaması	Çoğu kişi — sıfır yapılandırma	Yok. Sadece indirin ve açın.
Kaynaktan çalıştırma	Kodu okumak veya değiştirmek isteyen geliştiriciler	Node ~24, pnpm 10.33.x
Ajanınıza kurma	Terminalde yaşayanlar	Mevcut bir kodlama ajanı CLI'si

Video, kaynaktan çalıştırma yolunu izliyor, ancak bugün masaüstü uygulaması önerilen yoldur — Node, pnpm veya klonlama gerektirmez.

Tamamen yerel bir kurulum için, başlamadan önce yerelde çalışabilen bir komut satırı ajanının kurulu olmasını da isteyeceksiniz — örneğin yerleşik ücretsiz modellerle gelen ve Ollama gibi yerel bir çalıştırıcıya yönlendirilebilen OpenCode. PATH'inizde olduğu anda Open Design onu otomatik olarak algılar.

Adım 1 — Open Design'ı kurun

Seçenek A — Masaüstü uygulaması (önerilir, sıfır yapılandırma)

open-design.ai adresine gidin ve Download desktop'a tıklayın. macOS (Apple Silicon ve Intel), Windows (x64) ve Linux (AppImage) için derlemeler mevcuttur. Kurulumdan sonra uygulama, PATH'inizde zaten bulunan her kodlama ajanı CLI'sini otomatik olarak algılar ve yerleşik beceriler ile tasarım sistemlerini sizin için yükler.

Seçenek B — Kaynaktan çalıştırma

Onu doğrudan depodan çalıştırmak için — videoda yapıldığı gibi — yalnızca birkaç komuta ihtiyacınız var:

git clone https://github.com/nexu-io/open-design.git
cd open-design
corepack enable && pnpm install
pnpm tools-dev run web

Ardından terminalinizde yazdırdığı yerel URL'yi açın. Node ~24 ve pnpm 10.33.x'e ihtiyacınız var; Corepack sabitlenmiş pnpm sürümünü sizin için seçecektir. Bağlantı noktası dinamik olarak atanır, bu yüzden bir tane tahmin etmek yerine komutun gösterdiği adresi kullanın.

Seçenek C — Kodlama ajanınıza kurma

Open Design'ı terminalden sürmek için — onu ajanınızın içinde bir beceri veya MCP sunucusu olarak çağırarak, GUI gerekmeden — şunu çalıştırın:

od mcp install <agent>
# od ships with Open Design; <agent> = claude | codex | cursor | copilot | gemini | opencode | …

Ardından ajanın içinde şunu isteyin: Use open-design to generate a dense analytics dashboard with the Airbnb design system.

İlk çalıştırma: yerel ajanınızı bağlayın

Open Design'ı ilk kez başlattığınızda, makinenizi tarar ve bulduğu her komut satırı ajanını gösterir — Claude Code, OpenCode, Codex, Gemini ve diğerleri. Yalnızca-yerel bir iş akışını gerçek kılan an budur: tasarımlarınızı hangi ajanın üreteceğini siz seçersiniz.

• Kredi harcamamak için yerel bir ajan seçin. Claude Code mükemmeldir, ama Claude kredilerinizi kullanır. Bunun yerine OpenCode gibi ücretsiz, yerel bir seçenek seçmek, üretimin makinenizde bedava çalışması demektir. OpenCode birkaç ücretsiz modeli (MiniMax bunlardan biri) bir arada sunar ve Ollama gibi yerel bir çalıştırıcının önünde durabilir; böylece model bilgisayarınızdan asla ayrılmaz.
• Sağlayıcı API anahtarlarını yalnızca isterseniz ekleyin. Eğer bir gün barındırılan bir modele başvurmak isterseniz, Anthropic, OpenAI, Azure ve Google Gemini için anahtarları yapıştırabileceğiniz bir yer var. Tamamen yerel bir çalıştırma için bunu tümüyle atlayabilirsiniz.
• Medya sağlayıcıları ekleyin (isteğe bağlı). Görsel, video veya ses üretmek istiyorsanız, bu sağlayıcılar için kendi anahtarlarınızı ekleyin. "Kendi anahtarını getir" kısmı budur — ve isteğe bağlıdır.
• Becerileri ve tasarım sistemlerini açıp kapatın. Yalnızca önünüzdeki iş için ihtiyacınız olan yetenekleri etkinleştirin.

Buradaki her şey sonradan değiştirilebilir, bu yüzden ilk geçişi basit tutun: yerel ajanınızı seçin ve devam edin.

Çalışma alanını keşfedin

Open Design çalışmanızı proje kapsamlı tutar — oluşturduğunuz tasarımlar, üzerinde çalıştığınız proje klasörünün içinde yaşar. Klasör değiştirdiğinizde proje değiştirirsiniz.

Yeni bir prototip başlatın (videoda birine "Tube Analytics" adı veriliyor) ve hemen bir seçenekle karşılaşırsınız: bir tasarım sisteminden başlamak ya da serbest biçimde çalışmak. Önce bir tasarım sistemi tanımlamaya zorlanmazsınız. Yerleşik sistemlerden birini seçebilirsiniz — Claude/Anthropic sistemi, Airbnb, Airtable ve daha fazlası — veya mevcut tüm token'larınız ve bileşenleriniz birlikte gelsin diye bir Claude Design ZIP'i içe aktarabilirsiniz.

Tasarım sistemleri kütüphanesi: önizleyebileceğiniz, DESIGN.md'sini alabileceğiniz ve herhangi bir projeye oturtabileceğiniz gerçek marka başlangıç noktaları.

Burada marka sistemlerinden fazlası var. Open Design, kullanmadan önce önizleyebileceğiniz örnek tasarımlardan oluşan bir galeriyle gelir — birine tıklayın, onu üreten istemle (prompt) birlikte canlı bir önizleme açılır. Oradan başlamak için Use prompt'a basın. Bunların yanında, başlangıç noktası olarak fork'layabileceğiniz görsel şablonları yer alır.

Örnek tasarımlar ve görsel şablonları — herhangi birini önizleyin, ardından fork'layın veya istemini yeniden kullanın.

Bir şey inşa edin — yerelde

Şimdi yerel döngünün işe yaradığını kanıtlayan kısım. Videoda içerik üreticisi bir SaaS analiz panosu açıyor ve Open Design'dan onu genişletmesini istiyor.

1. Prototipi başlatın. Bir tasarım sistemi (veya serbest biçim) seçin ve isteğe bağlı olarak, ajanın mevcut tasarımınızın tam bağlamına sahip olması için Claude Design ZIP'inizi içe aktarın.
2. Referans ekleyin. Görsel referans için resimleri sürükleyin veya yapıştırın ya da projeden bir dosya eklemek için @ yazın — örneğin bir "SaaS Analytics dashboard" dosyası.
3. Brifingi yazın. Ona somut bir istem verin: "Build out the remaining tabs in the dashboard using your design system." Tanıdık bölünmüş düzeni elde edersiniz — solda sohbet, sağda canlı önizleme ve tasarım dosyaları.
4. Ajanınızda çalışmasını izleyin. Open Design, seçtiğiniz CLI'yi çağırır — videoda OpenCode — ve yeni ekranları oluşturur. OpenCode'un ücretsiz modelleri üzerinden yerelde çalıştığı için bu sıfır kredi tutar: Claude, Gemini veya Codex'e hiçbir ücret yansıtılmaz. Mevcut sistemle eşleşecek şekilde biçimlendirilmiş yeni sekmeler (eğilimler, içerik betiği üreticileri, transkriptler, yorumlar) belirir.
5. Dışa aktarın veya dağıtın. Tasarım hazır olduğunda, kod tabanınıza devretmek için ondan ZIP olarak indirmesini isteyin ya da Open Design'ın içinden doğrudan Vercel'e dağıtmasını isteyin — bu, Claude Design'ın sunmadığı bir şey. Değişiklikleri uygulamanıza geri katmak için ZIP'i Claude Code gibi bir kodlama ajanına bırakın ve "implement these design changes using the ZIP file." deyin.

Sonuç, gerçek ve etkileşimli bir tasarımdır — uçtan uca kendi makinenizde, kendi ajanınızla, ücretsiz olarak inşa edilmiş.

İpuçları

• Maliyetsiz üretim için ücretsiz bir yerel ajan seçin. Yerleşik ücretsiz modelleriyle OpenCode (veya Ollama üzerinden yerel bir model) her çalıştırmayı sıfır kredide tutar.
• Barındırılan anahtarları ihtiyaç duyacağınız zamanlar için saklayın. Anthropic/OpenAI/Gemini anahtarlarını yalnızca premium bir modele başvurmak istiyorsanız yapıştırın; yerel bir ajanın bunların hiçbirine ihtiyacı yok.
• Başlamak için bir tasarım sistemine ihtiyacınız yok. Yerleşik birinden başlayın, bir Claude Design ZIP'i içe aktarın ya da sadece serbest biçimde ilerleyin.
• Tasarımlarınız proje klasörüyle birlikte kalır — Open Design'ı doğru dizinde çalıştırarak işinizi düzenleyin.
• Dışa aktarma bir devirdir, bir kilitleme değil. ZIP olarak indirin, Vercel'e dağıtın ya da mevcut kodunuza birleştirmek için dosyaları bir kodlama ajanına verin.

SSS

Open Design'ı gerçekten hiçbir bulut maliyeti olmadan çalıştırabilir miyim? Evet. Open Design'ın kendisi açık kaynaktır (Apache-2.0) ve çalıştırması ücretsizdir. Onu OpenCode gibi ücretsiz bir yerel ajana yönlendirirseniz — isteğe bağlı olarak Ollama gibi yerel bir çalıştırıcıyla desteklenerek — üretim makinenizde sıfır kredi maliyetiyle gerçekleşir. Yalnızca ücretli, barındırılan bir model veya medya sağlayıcısı bağlamayı seçerseniz ödeme yaparsınız.

Her şeyi nasıl yerel ve gizli tutarım? İlk çalıştırma sırasında bir bulut ajanı yerine yerel bir komut satırı ajanı seçin. Open Design seçtiğiniz ajanın üzerinde çalıştığı için, yerel bir ajan ve yerel bir model, istemlerinizin ve tasarımlarınızın bilgisayarınızdan asla ayrılmaması anlamına gelir.

Hangi kodlama ajanlarını destekliyor? Claude Code, Codex, Cursor, Gemini, GitHub Copilot ve OpenCode dahil 21+ ajan. Open Design, makinenize zaten kurulu CLI'leri algılar ve üretimi hangisinin süreceğini seçmenize izin verir.

Claude Design'dan farkı nedir? Aynı tanıdık, tarayıcı tabanlı his, ama açık kaynaklı, yerel öncelikli ve ajan takılabilir. Kendi ajanınızı getirirsiniz (yerel veya barındırılan), önceden bir tasarım sistemi tanımlamaya zorlanmazsınız ve Claude Design'ın yapamadığı ekstra şeyler yapabilirsiniz — örneğin doğrudan Vercel'e dağıtmak ve aynı çalışma alanından slaytlar, görseller ve video üretmek gibi.

---

Bu yazılı kılavuz, AI Automation Station'ın yerel kurulum anlatımına dayanmaktadır. Yukarıdaki tam videoyu izleyin ve daha fazla uygulamalı yapay zeka aracı eğitimi için AI Automation Station'a abone olun.