Template System v2

VIP Hizmet Prensibi

Bu sistem ücretli hizmet için kullanılacak. Token maliyeti önemli değil, kalite öncelikli.

Asıl Problem ve Çözüm

Şu an:

Tarz: Lüks / Premium, Bold Typography, Amber

Sadece isimler → AI tam anlamıyor

Olacak:

## TARZ KURALLARI
### Lüks / Premium
- Koyu arka plan (slate-950)
- Altın/şampanya aksan
- Bol negatif space
⛔ Kaçın: Kalabalık layout

## HERO SEÇENEKLERİ (150 adet)
[Tüm hero layoutları burada - AI en uygununu seçer]

## SEKTÖR: Hukuk Bürosu
## FİRMA BİLGİLERİ: [1000 satır içerik]

Tam bilgi → AI bilinçli seçim yapar

AI Seçim Stratejisi

Hero Seçimi (150 adet)

AI 150 hero layout'un hepsini görür.
Sektör + tarz kombinasyonuna göre en uygununu seçer.
Token: ~20-30K (VIP hizmet, önemli değil)

Section Seçimi

About, Services, Contact, Footer bölümleri için de aynı mantık.
AI tüm seçenekleri görür, en uygununu seçer.

Font + Renk

Mevcut kart seçimi kalıyor.
Kullanıcı seçer, AI uyar.

Kesinleşen Kararlar

Tarz Seçimi

Mevcut /design/sectors/ kartları kalıyor. Seçilen tarzların kuralları prompt'a ekleniyor.

Sektör = Text Input

Seçim yok, kullanıcı yazar.

Ek Bilgiler = Büyük Textarea

1000+ satır destekler.

AI Tüm Seçenekleri Görür

150 hero, 50 about section, 30 footer... hepsi prompt'a dahil.
AI sektör + tarza göre en uygununu seçer.
Random değil, bilinçli seçim.

JSON Dosyaları

styles.json

Tarz kuralları (prompt'a eklenir)

{
  "minimal": {
    "name": "Minimal",
    "prompt_rules": [
      "Bol whitespace, section arası 120px+",
      "Max 2-3 renk, nötr tonlar",
      "Tek font ailesi, temiz hiyerarşi"
    ],
    "avoid": ["Gradient", "Çoklu gölge", "5+ renk"]
  }
}

heroes.json

150 hero layout (AI seçer)

{
  "heroes": [
    {
      "id": 1,
      "name": "Centered Minimal",
      "description": "Ortala başlık, alt çizgi aksan, tek CTA",
      "best_for": "Kurumsal, danışmanlık, hukuk",
      "html": "<section class='...'>...</section>"
    },
    {
      "id": 2,
      "name": "Split Screen Bold",
      "description": "Yarım görsel yarım metin, dramatik etki",
      "best_for": "Lüks, moda, gayrimenkul",
      "html": "..."
    }
  ]
}

sections.json

About, Services, Contact, Footer vb.

{
  "about": [...],
  "services": [...],
  "contact": [...],
  "footer": [...],
  "testimonials": [...],
  "cta_banners": [...]
}

Oluşturulacak Prompt Yapısı

## SEKTÖR
{{kullanıcının yazdığı sektör}}

## FİRMA ADI
{{opsiyonel}}

## TARZ KURALLARI
{{seçilen her tarz için rules + avoid}}

### Minimal
- Bol whitespace...
- Max 2-3 renk...
⛔ Kaçın: Gradient, çoklu gölge

### + Bold Typography
- text-6xl+ başlıklar...
⛔ Kaçın: Küçük başlıklar

---

## HERO LAYOUT SEÇENEKLERİ (150 adet)
Aşağıdaki hero layoutlarından sektör ve tarza EN UYGUN olanı seç:

1. Centered Minimal - Ortala başlık, alt çizgi aksan
   Best for: Kurumsal, danışmanlık
   [HTML kodu]

2. Split Screen Bold - Yarım görsel yarım metin
   Best for: Lüks, moda
   [HTML kodu]

... (150 adet)

---

## SECTION SEÇENEKLERİ
### About (30 adet)
### Services (25 adet)
### Contact (20 adet)
### Footer (15 adet)

---

## FİRMA BİLGİLERİ
{{kullanıcının yapıştırdığı 1000 satır içerik}}

---

## GÖREV
1. Yukarıdaki tarz kurallarına uy
2. Sektöre en uygun hero'yu SEÇ
3. Sektöre en uygun section'ları SEÇ
4. Firma bilgilerini içeriğe yerleştir
5. Tek sayfalık landing page oluştur

Dosya Yapısı

public/design/

├── data/

├── styles.json ← Tarz kuralları

├── heroes.json ← 150 hero layout

└── sections.json ← About, services, footer vb.

└── sectors/

└── index.html ← Güncellenecek

Yapılacaklar

1 styles.json - Tarz kuralları (her tarz için rules + avoid)

2 heroes.json - 150 hero layout (id, name, description, best_for, html)

3 sections.json - About, Services, Contact, Footer, CTA vb.

4 /design/sectors/index.html - Input'lar + Prompt Oluştur butonu

5 Niş tarzları kaldır (Cyberpunk, Art Deco vb.)

6 Test - Farklı sektör + tarz kombinasyonları