Web Sitesinin Önemi
Mevcut backend yapısına KESİNLİKLE dokunma. Hiçbir API, servis, veri akışı, business logic, state yönetimi veya backend bağlantısını değiştirme. Sadece frontend tarafında çalış.
Amaç:
Uygulamaya gelişmiş ve profesyonel bir tema sistemi ekle.
İstekler:
- Kullanıcı ayarlardan tema değiştirebilsin.
- En az 6 farklı kurumsal ve premium tema oluştur.
- Temalar sadece renk değişimi olmasın; her temanın kendine ait karakteri ve tasarım dili olsun.
- Tema geçişleri animasyonlu ve akıcı olsun.
- Responsive yapıyı koru.
- Mevcut fonksiyonelliği bozma.
- Kod yapısını modüler ve sürdürülebilir şekilde geliştir.
Oluşturulacak tema örnekleri:
1. Executive Dark
- Siyah, antrasit ve platin tonları
- Finans ve kurumsal şirket hissi
- Premium görünüm
2. Corporate Blue
- Lacivert, beyaz ve mavi tonları
- Bankacılık ve SaaS şirketleri tarzı
- Güven veren tasarım
3. Modern Light
- Açık gri, beyaz ve minimal renkler
- Apple ve Notion benzeri modern görünüm
4. Emerald Business
- Koyu yeşil ve zümrüt tonları
- Profesyonel ve prestijli görünüm
5. Graphite Pro
- Gri tonları ve soft kontrastlar
- Kurumsal dashboard odaklı
6. Luxury Gold
- Koyu arka plan + altın detaylar
- Premium üyelik ve yönetici paneli hissi
Tasarım Kuralları:
- Yapay zeka ile otomatik üretilmiş hissi vermesin.
- Gerçek bir Senior Product Designer ve UI/UX ekibi tarafından tasarlanmış gibi görünmeli.
- Görsellik ön planda olsun.
- Modern SaaS ürünleri seviyesinde kalite hedeflenmeli.
- Kartlar, tablolar, formlar, modallar, navbar, sidebar ve dashboard bileşenleri tema sistemine tam uyumlu olmalı.
- Hover, focus ve transition efektleri profesyonel seviyede tasarlansın.
- Tipografi hiyerarisi güçlendirilsin.
- Boşluk (spacing), gölge (shadow), border ve radius değerleri kurumsal standartlarda yeniden düzenlensin.
- Tasarım dili tutarlı olsun.
Teknik Gereksinimler:
- Theme Provider yapısı oluştur.
- Tema tercihleri localStorage'da saklansın.
- Yeni tema eklemek kolay olsun.
- Hardcoded renk kullanımını kaldır ve theme token sistemi oluştur.
- CSS Variables veya Design Token mimarisi kullan.
- Dark/Light varyasyonları desteklenebilir şekilde tasarla.
Önemli:
Backend'e, API'lere, veritabanına, servis katmanına veya mevcut iş mantığına hiçbir şekilde müdahale etme. Sadece frontend tasarım sistemi ve tema altyapısını geliştir.