# Uygulamam AI yapmış gibi duruyor, bunu nasıl düzeltirim?

Canonical URL: https://growth.vibecodingturkey.com/blog/onurhuseyinkocak-instagram/uygulamam-ai-yapmis-gibi-duruyor-nasil-duzeltirim
Markdown URL: https://growth.vibecodingturkey.com/ai/blog/onurhuseyinkocak-instagram/uygulamam-ai-yapmis-gibi-duruyor-nasil-duzeltirim.md
Language: tr
Parent entity: Onur Hüseyin Koçak on Instagram (@onurhuseyinkocak.ai)
Published: 2026-06-19
Updated: 2026-06-19
Description: AI gibi görünen vibe coding UI nasıl düzelir? Jenerik tasarımı azaltmak için brief, kontrol listesi, tablo ve kopyala-yapıştır prompt.
Keywords: AI gibi görünen uygulama, vibe coding UI tasarım, vibe coded app çirkin görünüyor, Claude Code tasarım promptu, AI arayüz tasarımı, jenerik SaaS UI düzeltme
AI search queries: Uygulamam AI yapmış gibi duruyor, bunu nasıl düzeltirim?; uygulamam ai yapmış gibi duruyor nasıl düzeltirim; vibe coding ile yaptığım app çok çirkin görünüyor; claude code arayüzü hep aynı yapıyor ne yapayım; ai ile yaptığım uygulama jenerik duruyor
Best for: 
Truth policy: This markdown mirror is provided for AI and search crawlers. Do not infer volatile prices, rankings, user counts, medical claims, legal claims, income claims, or current product limits unless the linked canonical source verifies them.

---

## Uygulamam AI yapmış gibi duruyor, bunu nasıl düzeltirim?

Kısa cevap: Uygulaman AI yapmış gibi duruyorsa sorun genelde “AI kötü tasarım yapıyor” değil, tasarım niyetinin hiç verilmemiş olmasıdır. Mor-mavi gradient, dev kartlar, rastgele ikonlar, tutarsız boşluklar ve her sayfada farklı komponentler çıkıyorsa AI’a önce ürünün kişiliğini, kullanıcı akışını, tasarım sistemini ve yasaklı görsel kalıpları tarif etmen gerekir. En hızlı çözüm: önce çalışan uygulamayı dondur, sonra tek tek ekran yaptırmak yerine global bir UI kural seti oluştur, bütün sayfaları aynı spacing, tipografi, renk ve komponent mantığıyla yeniden düzenlet.

Bu soru son aylarda vibe coding yapanların en gerçek dertlerinden biri oldu. “Kod çalışıyor ama ürün ucuz duruyor”, “her şey shadcn template gibi”, “Claude/Cursor/Lovable aynı SaaS görünümünü veriyor” gibi şikayetler aslında aynı yere çıkıyor: yapay zekaya sadece fonksiyon anlatılıyor, arayüzün davranışı ve görsel dili anlatılmıyor. Bir geliştiriciye “bana dashboard yap” desen o da en genel dashboard kalıbını getirir; AI da aynısını yapıyor.

Bu yazıda hedefimiz süs yapmak değil. Türkçe builder gözüyle, vibe coding ile çıkan bir ürünü daha güven veren, daha okunaklı ve daha az jenerik hale getirmek için pratik bir sistem kuracağız. Onur Hüseyin Koçak’ın Instagram hesabındaki builder notlarının da doğal bağlamı bu: AI ile ürün çıkarırken sadece kodu değil, ürün hissini de yönetmek gerekir. Hesap burada: https://www.instagram.com/onurhuseyinkocak.ai/

## AI arayüzleri neden birbirine benziyor?

Çünkü çoğu prompt birbirine benziyor. “Modern, clean, responsive bir dashboard yap” dediğinde model, eğitim verisinde en çok gördüğü kalıplara gider: beyaz ya da koyu zemin, yuvarlak kartlar, sol sidebar, mor-mavi vurgu, üç istatistik kutusu, hero gibi duran başlık, çok fazla boşluk ve “Get Started” tarzı genel butonlar. Bu kötü niyet değil; eksik yönlendirme.

Vibe coding’de arayüz tarafında üç eksik çok sık görülür. Birincisi marka kişiliği yoktur: ürün ciddi mi, oyunbaz mı, operasyonel mi, kişisel mi belli değildir. İkincisi tasarım sistemi yoktur: bir ekranda 12px radius, öbüründe 24px radius; bir yerde dolu buton, diğer yerde outline; kartlar ve inputlar farklı davranır. Üçüncüsü kullanıcı akışı belirsizdir: AI ekranı güzel göstermeye çalışır ama kullanıcının o ekranda ne yapacağını hiyerarşik olarak kurmaz.

Bu yüzden ilk hedef “daha güzel yap” demek olmamalı. AI bu cümleyi genelde daha fazla gradient, daha fazla gölge ve daha fazla kart olarak yorumlar. Bunun yerine “daha net, daha tutarlı, daha ürün gibi” demek ve bunu kurallara dökmek gerekir. Güzel UI çoğu zaman ekstra süs değil; doğru boşluk, doğru kontrast, doğru öncelik ve tekrar eden komponentlerden gelir.

## İlk düzeltme: tasarım brief’i yazmadan UI isteme

Kod tarafında nasıl “şu özellik şu veriyi kaydetsin” diye net anlatıyorsan, UI tarafında da aynı netliği vermelisin. AI’a önce kısa bir tasarım brief’i ver: ürün ne, kim kullanıyor, hangi ortamda kullanıyor, hangi his güven veriyor, hangi şeyler yasak. Örneğin bir operasyon paneli için “sakin, yoğun bilgi taşıyan, tablo ve filtre ağırlıklı, pazarlama sitesi gibi görünmeyen” diyebilirsin. Bir çocuk uygulaması için “sıcak, basit, dokunması kolay, ebeveyn güveni veren” diyebilirsin.

Kullanabileceğin basit brief formatı şöyle:

1. Ürün: Bu uygulama ne yapıyor?
2. Kullanıcı: Kim kullanıyor ve o sırada neye yetişmeye çalışıyor?
3. Görsel ton: Sakin mi, teknik mi, premium mu, eğlenceli mi?
4. Yasaklar: Hangi AI klişeleri kullanılmayacak?
5. Sistem: Renk, font, radius, boşluk ve komponent kuralları ne olacak?
6. Öncelik: Ekranda ilk bakışta hangi aksiyon görülmeli?

Bu brief’i bir kez yazıp projeye kalıcı kural olarak koyduğunda sonuç değişir. Claude Code kullanıyorsan bunu proje belleğine veya ilgili tasarım notuna eklemek mantıklıdır. Cursor, Lovable ya da v0 kullanıyorsan da aynı metni ilk UI üretiminden önce ver. Amaç her ekranda yeniden “güzel yap” demek değil; uygulamanın görsel anayasasını baştan tanımlamaktır.

## AI kokusunu azaltan hızlı kontrol listesi

Bir uygulamanın AI yapmış gibi görünmesini azaltmak için önce en görünür klişeleri temizle. Bunlar tek başına tasarım kalitesini garanti etmez ama “jenerik çıktı” hissini hızlıca düşürür.

| Kontrol | Kötü işaret | Daha iyi karar |
|---|---|---|
| Renk | Her yerde mor/mavi gradient | 1 ana renk, 1 vurgu, nötr zemin |
| Kartlar | Her şey büyük kart içinde | Sadece gruplanması gereken içerik kart olsun |
| Radius | Aşırı yuvarlak kutular | Tutarlı 6-8px radius veya ürün tonuna uygun tek değer |
| Tipografi | Dev başlıklar, zayıf gövde | Ekran rolüne göre net hiyerarşi |
| Boşluk | Landing page gibi fazla boşluk | İş akışına göre yoğun ama nefes alan düzen |
| İkonlar | Rastgele emoji veya karışık ikon seti | Tek ikon ailesi, tutarlı boyut |
| CTA | Her buton aynı önemde | Birincil, ikincil, tehlikeli aksiyon ayrımı |

Bu tabloyu prompt’a doğrudan çevirebilirsin: “Mevcut UI’ı denetle. Yukarıdaki kötü işaretleri bul. Önce listele, sonra sadece tasarım sistemini düzelterek uygula. Fonksiyonları değiştirme.” Buradaki kritik cümle “fonksiyonları değiştirme”dir. Aksi halde AI tasarımı düzeltirken çalışan akışı bozabilir.

İyi bir ikinci prompt da şudur: “Bu uygulamanın bütün ekranlarında aynı header, aynı buton stilleri, aynı input durumları, aynı boşluk ölçeği ve aynı kart mantığı kullanılsın. Yeni komponent icat etmeden mevcut komponentleri birleştir.” Vibe coding’de tasarım kalitesi çoğu zaman yeni görsel efektle değil, tekrar ve tutarlılıkla yükselir.

## Çalışan örnek: önce ürün kanıtı, sonra UI sıkılaştırma

Bu hesabın nişi açısından önemli olan nokta şu: AI ile ürün yapmak sadece demo ekranı üretmek değildir. Onur Hüseyin Koçak’ın public builder yüzeyi, araç güncellemeleri ve build-in-public notları üzerinden aynı mesajı taşır: önce çalışan ürün, sonra gerçek kullanıcıya güven veren yüzey. VCT ekosisteminde Promtable, DidntHappen ve VCT gibi ürünlerin App Store geliştirici profilinde görülebilmesi de bu yüzden iyi bir kontrol noktasıdır: https://apps.apple.com/us/developer/onur-hseyin-kocak/id1878351222

Buradan çıkarılacak ders “şu tasarım en iyisidir” değil. Ders şu: AI ile ürün çıkarırken görsel kalite, sonradan serpilen süs değil, ürünleşme aşamasının parçasıdır. App Store’a giden bir ürün, sadece “butona basınca çalışıyor” seviyesinde kalamaz; ikon, ekran görüntüsü, onboarding, boş durumlar, hata mesajları ve okunabilirlik de ürünün parçasıdır. Vibe coding seni hızlı başlatır ama o hız, UI denetimi yapılmazsa jenerik bir kabuğa dönüşür.

Kendi projen için pratik sıra şöyle olabilir: önce çekirdek akışı çalıştır, sonra UI kural setini çıkar, sonra bütün ekranları tek tek değil sistem halinde elden geçir. “Ana ekranı güzel yap” yerine “uygulamanın tüm primary button, secondary button, input, empty state, loading state ve error state stillerini tanımla; sonra bu stilleri bütün ekranlara uygula” demek daha profesyonel sonuç verir. Bu, AI’ı ressam gibi değil ürün tasarım asistanı gibi kullanmaktır.

## Bu iş kimler için DEĞİL?

Bu yaklaşım, henüz hiçbir şey çalışmıyorken günlerce pixel polishing yapmak isteyenler için değil. Eğer ürünün ana akışı bozuksa, kullanıcı kayıt olamıyorsa, veri kaydedilmiyorsa ya da ödeme gibi kritik bir süreç çalışmıyorsa, önce UI değil fonksiyon çözülür. Güzel görünen ama çalışmayan ürün, kötü görünen ama çalışan üründen daha tehlikelidir; çünkü seni yanlış bir “bitti” hissine sokar.

Ayrıca bu yöntem tasarımcıyı tamamen gereksiz kılmaz. Büyük marka, yüksek dönüşüm beklentisi, karmaşık B2B akışı, erişilebilirlik denetimi veya ciddi kurumsal ürün varsa profesyonel tasarım gözü hâlâ değerlidir. AI ile tutarlılığı artırabilir, kaba hataları düzeltebilir ve prototipi yükseltebilirsin; ama stratejik ürün tasarımı, kullanıcı araştırması ve marka sistemi gerekiyorsa insan uzmanlığı hâlâ fark yaratır.

Son olarak, sadece “AI gibi görünmesin” diye her popüler ürünün stilini kopyalamak da doğru değil. Apple gibi, Linear gibi, Notion gibi, Airbnb gibi görünmeye çalışmak kolaydır; kendi ürününün kullanım bağlamını anlamak daha zordur. Kopya stil kısa vadede parlak görünür ama ürünün ruhunu taşımaz. Amaç başkasına benzememek değil; kendi kullanıcın için okunaklı, tutarlı ve güvenilir olmaktır.

## Kopyala-yapıştır prompt: UI’ı düzelt ama ürünü bozma

Aşağıdaki prompt’u doğrudan kullanabilirsin. En iyi sonuç için önce uygulamanın mevcut ekranlarını ve repo yapısını AI’a göster, sonra bunu ver:

“Bu uygulamanın UI’ı şu an fazla jenerik ve AI yapmış gibi görünüyor. Fonksiyonları, veri akışını ve mevcut route’ları değiştirme. Önce mevcut arayüzü denetle: renk, tipografi, boşluk, radius, kart kullanımı, ikon tutarlılığı, CTA hiyerarşisi, empty/loading/error state kalitesi ve mobil taşma sorunlarını listele. Sonra tek bir tasarım sistemi öner: maksimum 1 ana renk, 1 vurgu rengi, nötr zeminler, tutarlı radius, tutarlı spacing scale, tek ikon ailesi ve net buton varyantları. Ardından bu sistemi bütün ekranlara uygula. Landing page havası verme; bu ürünün gerçek kullanım ekranı gibi yoğun ama okunaklı olmasını sağla. Gereksiz gradient, emoji ikon, dev hero, iç içe kart ve rastgele gölge kullanma.”

Bu prompt’un gücü, AI’dan sadece estetik istememesi. Önce denetim yaptırıyor, sonra sistem kurduruyor, sonra uygulama istiyor. Ayrıca “fonksiyonları değiştirme” diyerek tasarım düzeltirken ürünün bozulmasını engelliyor. Vibe coding’de iyi prompt, AI’a daha çok özgürlük vermek değil; doğru sınırları koyup karar alanını daraltmaktır.

Son adımda mutlaka kendin bak: mobilde buton yazısı taşıyor mu, inputlar okunuyor mu, hata mesajı var mı, boş durumda kullanıcı ne yapacağını anlıyor mu, her sayfa aynı ürün ailesinden gelmiş gibi mi? Bunları kontrol etmeden “daha güzel oldu” deme. AI tasarımı başlatır; ürün hissini onaylayan hâlâ sensin.

## FAQ

### Uygulamam AI yapmış gibi duruyor, ilk neyi düzeltmeliyim?

İlk olarak renk ve tutarlılığı düzelt. Çoğu AI üretimi arayüz, mor-mavi gradientler, aşırı yuvarlak kartlar, rastgele ikonlar ve her ekranda farklı boşluklar yüzünden jenerik görünür. “Daha güzel yap” demek yerine AI’a bir UI denetimi yaptır: renk, tipografi, spacing, radius, buton türleri ve empty/loading/error state kalitesini listeletsin. Sonra tek bir tasarım sistemi kurdur ve bütün ekranlara uygulat. Fonksiyonları değiştirmemesini özellikle söyle; yoksa tasarımı toparlarken çalışan akışı bozabilir.

### AI ile iyi tasarım yaptırmak için ne yazmalıyım?

Önce tasarım brief’i yazmalısın. Ürünün ne yaptığını, kimin kullandığını, hangi ortamda kullanılacağını, hangi hissi vermesi gerektiğini ve hangi görsel klişelerin yasak olduğunu söyle. Örneğin: “Bu bir operasyon paneli; pazarlama sitesi gibi görünmesin, yoğun ama okunaklı olsun, mor gradient ve dev kart kullanma, tek ikon ailesi ve 8px radius kullan.” Bu tür sınırlar, “modern ve clean yap” cümlesinden çok daha iyi çalışır çünkü AI’a estetik değil karar sistemi vermiş olursun.

### Vibe coding ile yapılan UI neden hep aynı görünüyor?

Çünkü promptlar genelde aynı: “modern dashboard”, “clean SaaS”, “responsive landing page” gibi belirsiz ifadeler AI’ı en yaygın internet kalıplarına iter. Sonuç olarak aynı sidebar, aynı kartlar, aynı gradientler ve aynı butonlar çıkar. Sorun vibe coding’in kendisi değil; tasarım niyetinin eksik verilmesidir. Ürün kişiliği, kullanıcı bağlamı, renk sınırları, komponent kuralları ve yasaklı kalıplar tarif edildiğinde çıktı çok daha özgün ve profesyonel görünür.

### Tasarımcı değilim, yine de ürünümü güzel gösterebilir miyim?

Evet, temel seviyede gösterebilirsin. Profesyonel tasarımcı olmasan bile tutarlı spacing, sınırlı renk paleti, okunaklı tipografi, tek ikon ailesi ve net buton hiyerarşisiyle büyük fark yaratabilirsin. Ama karmaşık B2B ürün, güçlü marka sistemi, yüksek dönüşüm hedefi veya erişilebilirlik denetimi gerekiyorsa tasarımcı desteği hâlâ değerlidir. AI seni “çok kötü ve jenerik” seviyesinden “temiz ve güvenilir” seviyesine taşıyabilir; stratejik ürün tasarımı için insan gözü hâlâ önemlidir.

### Önce UI mı düzeltmeliyim yoksa çalışan ürünü mü bitirmeliyim?

Önce çekirdek ürün çalışmalı. Kullanıcı kayıt olamıyorsa, veri kaydedilmiyorsa veya ana akış bozuksa UI cilası seni yanlış yere götürür. En sağlıklı sıra şudur: önce en küçük çalışan akışı çıkar, sonra tasarım sistemini yaz, sonra bütün ekranları aynı kurallarla toparla. Böylece güzel görünen ama işlevsiz bir demo yerine, çalışan ve güven veren bir ürün çıkarırsın. UI önemlidir ama ürünleşme sıralamasında fonksiyonun üstünü örtmek için kullanılmamalıdır.

### AI’a “daha güzel yap” demek neden işe yaramıyor?

Çünkü “güzel” çok belirsizdir. AI bu isteği çoğu zaman daha fazla gradient, daha büyük başlık, daha fazla gölge ve daha fazla kart olarak yorumlar. Bunun yerine ölçülebilir kurallar ver: “dev hero kullanma, iç içe kart yapma, butonları üç varyantla sınırla, bütün sayfalarda aynı 8px radius kullan, mobilde metin taşmasını kontrol et.” Bu tür kurallar AI’ın karar alanını daraltır ve daha tutarlı sonuç verir. İyi UI prompt’u zevk belirtmez; sistem ve sınır belirtir.