157 lines
6.8 KiB
Markdown
157 lines
6.8 KiB
Markdown
# SCC Enerji — Antigravity Design Prompt
|
||
|
||
---
|
||
|
||
## demos.ts Verisi
|
||
|
||
```typescript
|
||
{
|
||
slug: "scc-enerji",
|
||
template: "enerji", // YENİ ŞABLON — aşağıda tarif edildi
|
||
firma: {
|
||
adi: "SCC Enerji",
|
||
slogan: "Yeşil Enerji, Yeşil Dünya",
|
||
sehir: "Ankara / İstanbul",
|
||
adres: "Söğütözü Mah. Söğütözü Cad. No:2/A Çankaya, Ankara",
|
||
adres2: "Yenişehir Mah. Millet Cad. No:4/19 Pendik, İstanbul",
|
||
telefon: "0 (312) 945 04 24",
|
||
email: "info@sccenerji.com",
|
||
logoEmoji: "⚡",
|
||
renkAna: "#2E7D32", // koyu yeşil (mevcut sitenin ana rengi)
|
||
renkKoyu: "#1B5E20", // derin orman yeşili
|
||
renkAcik: "#E8F5E9", // soluk yeşil bg
|
||
renkVurgu: "#76FF03", // elektrik yeşili — enerji hissi için accent
|
||
},
|
||
istatistikler: [
|
||
{ deger: "16+", etiket: "Uluslararası Proje" },
|
||
{ deger: "14", etiket: "Yıllık Deneyim" },
|
||
{ deger: "7+", etiket: "Ülkede Aktif" },
|
||
{ deger: "500+", etiket: "Desteklenen Firma" },
|
||
],
|
||
hizmetler: [
|
||
{ ikon: "🌱", baslik: "Yenilenebilir Enerji", aciklama: "Güneş, rüzgar ve biyokütle enerji sistemleri kurulum ve danışmanlığı" },
|
||
{ ikon: "♻️", baslik: "Sürdürülebilirlik Danışmanlığı", aciklama: "Şirketlerin karbon ayak izi hesaplama ve azaltma stratejileri" },
|
||
{ ikon: "📋", baslik: "Sertifikasyon & Fon", aciklama: "KOSGEB, TÜBİTAK, World Bank ve AB fon başvuru yönetimi" },
|
||
{ ikon: "🎯", baslik: "NET Zero Karbon", aciklama: "2050 hedefleri doğrultusunda net sıfır karbon yol haritası" },
|
||
{ ikon: "💡", baslik: "Dijital Dönüşüm & Yeşil Markalaşma", aciklama: "Kurumsal yeşil kimlik ve ESG raporlama" },
|
||
{ ikon: "🏗️", baslik: "Kurumsal Mühendislik", aciklama: "Endüstriyel tesis ve altyapı için sürdürülebilirlik çözümleri" },
|
||
],
|
||
fonlar: [
|
||
"KOSGEB", "TÜBİTAK", "World Bank", "Enerji Bakanlığı 1832/1833 VAP", "AB Fonları"
|
||
],
|
||
projeler: [
|
||
{ ulke: "Bulgaristan", alan: "Yenilenebilir Enerji" },
|
||
{ ulke: "Abu Dhabi", alan: "Sürdürülebilirlik" },
|
||
{ ulke: "Danimarka", alan: "Net Zero" },
|
||
{ ulke: "Kenya", alan: "Enerji Altyapısı" },
|
||
{ ulke: "Hırvatistan", alan: "AB Fon Yönetimi" },
|
||
{ ulke: "Almanya", alan: "Yeşil Markalaşma" },
|
||
],
|
||
yonetim: {
|
||
ceo: "Serdar Kayhan",
|
||
deneyim: "14 yıl",
|
||
unvan: "Kurucu & CEO",
|
||
},
|
||
yorumlar: [
|
||
{ yazar: "Ahmet Kara", unvan: "Fabrika Müdürü", yorum: "SCC Enerji sayesinde tesisimizin karbon emisyonunu %40 düşürdük ve TÜBİTAK hibesi aldık.", puan: 5, tarih: "2024", emoji: "🏭" },
|
||
{ yazar: "Zeynep Arslan", unvan: "CFO, Lojistik Firması", yorum: "ESG raporlaması ve yeşil sertifikasyon sürecinde mükemmel bir rehberlik aldık.", puan: 5, tarih: "2024", emoji: "📊" },
|
||
{ yazar: "Mehmet Yılmaz", unvan: "Genel Müdür, İnşaat", yorum: "AB fon başvurumuz SCC Enerji'nin desteğiyle onaylandı. Sonuç inanılmaz.", puan: 5, tarih: "2023", emoji: "🏗️" },
|
||
],
|
||
sosyal: {
|
||
twitter: true,
|
||
instagram: true,
|
||
youtube: true,
|
||
linkedin: true,
|
||
},
|
||
}
|
||
```
|
||
|
||
---
|
||
|
||
## Mevcut Site Analizi
|
||
|
||
- **Platform:** WordPress (Caria Digital yapımı), eski, JS-rendered hero slider (yüklenmiyor)
|
||
- **Renk paleti:** Beyaz zemin + koyu yeşil aksant
|
||
- **His:** Kurumsal ama donuk — animasyon yok, fotoğraflar stock, hiyerarşi zayıf
|
||
- **Güçlü yan:** İçerik zengin (6 hizmet, 16+ proje, fon listesi, CEO bilgisi)
|
||
- **Dönüşüm fırsatı:** Bu firma Awwwards-level bir enerji sitesi hak ediyor — Tesla Energy veya Vestas seviyesi
|
||
|
||
---
|
||
|
||
## Antigravity Komutu
|
||
|
||
Aşağıdaki metni kopyala, Antigravity'e gönder:
|
||
|
||
---
|
||
|
||
TEMPLATE_BRIEF.md dosyasındaki tüm kurallara uy. Şimdi `EnerjiTemplate` adında yeni bir şablon yazıyoruz.
|
||
|
||
**Firma:** SCC Enerji — Ankara & İstanbul merkezli, 16+ uluslararası proje yapmış yenilenebilir enerji ve sürdürülebilirlik danışmanlık şirketi.
|
||
|
||
**Demos.ts verisi:** (Yukarıdaki TypeScript objesini yapıştır)
|
||
|
||
---
|
||
|
||
### İMZA MOMENT — Zorunlu
|
||
|
||
**"Enerji Akışı Parallax"**
|
||
|
||
Hero section'da tam ekran koyu arkaplan (`#030A03` — saf gece siyahı, yeşil tonu ile).
|
||
Üzerinde **SVG parçacık ağı** — ince çizgilerle birbirine bağlı noktalar, mouse hareketi ile etkileşimli.
|
||
Sayfa yüklenince büyük başlık kelime kelime yukarıdan düşer: **"YEŞİL ENERJİ"** — devasa, beyaz, cesur.
|
||
Hemen altında elektrik yeşili (`#76FF03`) ince bir yatay çizgi soldan sağa çizilir (stroke animation, 1.2s).
|
||
Bu çizginin altında küçük ve ince font ile: *"Sürdürülebilir geleceğin mühendisleri"*
|
||
|
||
Hero CTA butonu: yeşil outline, hover'da içi dolup metin rengi siyah olur (fill animation).
|
||
|
||
---
|
||
|
||
### Renk Paleti
|
||
|
||
```
|
||
Arkaplan (hero): #030A03 — neredeyse siyah, yeşil tonu
|
||
Arkaplan (sections): #F0F7F0 — çok açık yeşil beyaz (nefes verir)
|
||
Ana yeşil: #2E7D32
|
||
Koyu yeşil: #1B5E20
|
||
Elektrik vurgu: #76FF03 — sadece accent olarak, aşırı kullanma
|
||
Metin (açık bg): #0A1A0A
|
||
Metin (koyu bg): #FFFFFF
|
||
```
|
||
|
||
---
|
||
|
||
### Section Sırası
|
||
|
||
1. **Hero** — imza moment (yukarıda tarif edildi), fullscreen, parçacık ağı
|
||
2. **İstatistikler** — koyu arkaplan `#0A1A0A`, 4 sayaç yan yana, scroll-triggered AnimatedCounter
|
||
3. **Hizmetler** — açık arkaplan, 6 kart, hover'da sol kenar `#76FF03` renk geçişi + kart hafifçe yukarı kalkar
|
||
4. **Fon & Destek Logolar** — "Bu fonları size biz getirebiliriz" başlığı, 5 fon logosu/etiketi yatay sıra, subtle marquee animasyon
|
||
5. **Küresel Projeler** — dünya haritası SVG üzerinde noktalar (Bulgaristan, Abu Dhabi, Danimarka, Kenya, Hırvatistan, Almanya, Adana) — Framer Motion ile tek tek belirir
|
||
6. **CEO / Hakkımızda** — yarım bölüm metin + yarım büyük fotoğraf (placeholder), CEO quote büyük ve italik
|
||
7. **Referanslar** — 3 yorum kartı, subtle yeşil border
|
||
8. **İletişim** — iki adres (Ankara + İstanbul) yan yana, telefon ve e-posta, form
|
||
9. **Footer** — sosyal medya ikonları, ince elektrik yeşili accent çizgisi
|
||
|
||
---
|
||
|
||
### Teknik Gereksinimler
|
||
|
||
- Next.js 14 App Router, TypeScript strict
|
||
- Framer Motion v11 — `useInView`, `staggerChildren`, `viewport: { once: true }`
|
||
- Lenis smooth scroll (TEMPLATE_BRIEF'teki setup kodu ile)
|
||
- Tailwind CSS v3 — custom colors `energyGreen`, `electricLime` olarak `tailwind.config.ts`'e ekle
|
||
- SVG parçacık ağı için vanilla JS Canvas veya basit CSS dots grid de kabul edilir
|
||
- AnimatedCounter component'ini kullanan istatistik section
|
||
- Komponent: `components/templates/EnerjiTemplate/index.tsx`
|
||
- Routing: `app/[slug]/page.tsx`'e `if (data.template === "enerji") return <EnerjiTemplate data={data} />;` ekle
|
||
- `data/demos.ts`'e interface ve veri ekle
|
||
|
||
---
|
||
|
||
### Kalite Hedefi
|
||
|
||
Bitince tarayıcıda açtığında şunu hissettirmeli:
|
||
**"Bu Tesla Energy'nin Türk versiyonu gibi görünüyor."**
|
||
|
||
Eğer "idare eder" diyorsan — yeniden başla.
|