Template System v2

VIP Hizmet Prensipleri

Token maliyeti önemli değil, kalite öncelikli

AI 3 farklı alternatif sunabilir

Her sitede Premium/Kinetic Hero olacak

Premium Hero (Kinetic Hero)

Referans: varilsan.tuufi.com

Her sitede olmayan, hareketli, animasyonlu, interaktif bir hero section. Slayt olması şart değil ama mutlaka dikkat çekici ve dinamik.

Görsel Efektler

• Gradient wave animasyonu
• Particle sistemi (floating dots)
• Mesh background (radial gradients)
• Organic float animation
• Glassmorphism (blur + transparency)
• Kinetic shimmer (metin üzerinde)

Kullanılabilecek Kütüphaneler

• AOS - Scroll animasyonları
• Swiper.js - Carousel/slider
• GSAP - Gelişmiş animasyon
• Particles.js - Parçacık efekti
• Three.js - 3D efektler (opsiyonel)
• Vanilla CSS - Keyframe animasyonlar

Kural: Her Tasarımda Zorunlu

AI hangi sektör/tarz olursa olsun, mutlaka bir Premium Hero section oluşturacak. Statik, sıkıcı hero YASAK. Mutlaka animasyon/hareket olacak.

Alternatif Sunma Stratejisi

Seçenek 1: 3 Farklı Hero

Aynı içerik, 3 farklı hero layout.
Müşteri beğendiğini seçer.

Hero A: Particle + Gradient Hero B: Split + Video BG Hero C: 3D + Glassmorphism

Seçenek 2: 3 Farklı Tam Tasarım

Aynı içerik, 3 farklı komple tasarım.
Her biri farklı yaklaşım.

Tasarım A: Minimal + Elegant Tasarım B: Bold + Dynamic Tasarım C: Corporate + Trust

Prompt'a Eklenecek Talimat

## ALTERNATİF SUNMA
Müşteriye seçenek sunmak için:
- 3 farklı hero alternatifi VEYA
- 3 farklı komple tasarım oluştur.

Her alternatif:
- Aynı içeriği kullanmalı
- Farklı yaklaşım/layout olmalı
- Premium Hero içermeli (animasyonlu, dinamik)

Premium Hero JSON Yapısı

{
  "premium_heroes": [
    {
      "id": 1,
      "name": "Particle Storm",
      "description": "Floating particles + gradient mesh + organic float",
      "animation_type": "particles + css-keyframes",
      "libraries": ["particles.js", "AOS"],
      "best_for": ["Tech", "SaaS", "Modern"],
      "html": "...",
      "css": "...",
      "js_init": "..."
    },
    {
      "id": 2,
      "name": "Gradient Wave",
      "description": "Animated gradient waves + glassmorphism cards",
      "animation_type": "css-keyframes + backdrop-blur",
      "libraries": ["AOS"],
      "best_for": ["Corporate", "Finance", "Consulting"],
      "html": "...",
      "css": "...",
      "js_init": "..."
    },
    {
      "id": 3,
      "name": "Kinetic Split",
      "description": "Split screen + video/image parallax + text reveal",
      "animation_type": "scroll-driven + intersection-observer",
      "libraries": ["GSAP", "ScrollTrigger"],
      "best_for": ["Luxury", "Real Estate", "Fashion"],
      "html": "...",
      "css": "...",
      "js_init": "..."
    },
    {
      "id": 4,
      "name": "3D Floating Cards",
      "description": "3D transform on hover + floating elements",
      "animation_type": "css-3d + mouse-tracking",
      "libraries": ["vanilla JS"],
      "best_for": ["E-commerce", "Product", "Portfolio"],
      "html": "...",
      "css": "...",
      "js_init": "..."
    }
  ]
}

Kesinleşen Kararlar

Tarz Seçimi

Mevcut /design/sectors/ kartları. Kuralları prompt'a ekleniyor.

Sektör = Text Input

Kullanıcı yazar.

Ek Bilgiler = Textarea

1000+ satır destekler.

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

Token önemli değil. 150+ hero, section hepsi dahil.

Premium Hero ZORUNLU

Her tasarımda animasyonlu, dinamik hero olacak.
Statik/sıkıcı hero yasak.

3 Alternatif Sunma

AI istendiğinde 3 farklı hero veya 3 farklı tam tasarım sunabilir.

Dosya Yapısı

public/design/

├── data/

├── styles.json ← Tarz kuralları

├── premium-heroes.json ← Animasyonlu hero'lar (ZORUNLU)

├── heroes.json ← Statik hero layoutları

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

└── sectors/

└── index.html ← Güncellenecek

Yapılacaklar

1 styles.json - Tarz kuralları

2 premium-heroes.json - Animasyonlu hero'lar (html + css + js)

3 heroes.json - Statik hero layoutları

4 sections.json - About, Services, Contact, Footer

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

6 Niş tarzları kaldır

7 Test - 3 alternatif sunma, Premium Hero kontrolü