Kullanıcının sağladığı içeriğe dayalı bir web sayfası oluşturun. Web sayfası stil gereksinimleri aşağıdaki gibidir:

### I. Görsel Stil Konumlandırması - **Sanatsal El Çizimi Stili**: Modern dijital tasarımı geleneksel el çizimi estetiğiyle harmanlayan çizgi sanatı stilini benimsemek. - **Renk Şeması**: Temel olarak nötr renkler (krem beyazı/açık gri) kullanmak, koyu gri ana metinle eşleştirmek ve görsel odak rengi olarak turuncu-kırmızı (vurgu rengi) kullanmak. - **Marka Tonu**: Seçkin bir kullanıcı grubunu hedefleyen, rafine, sanatsal ve sıcak bir ton. ### II. Yerleşim Yapısı Prensipleri **Kahraman Bölümü (İlk Ekran Tasarımı)** - Sol-sağ sütun düzeni (60:40 altın oran) - Sol taraf: - Büyük başlık (Ekran Yazı Tipi, 72-96 piksel), koyu yazı tipi, güçlü görsel etki - Vurgu rengiyle vurgulanmış temel veriler (örneğin, "15 Şehir, 4749 konum") - Temel değer önerisini belirten özlü ve güçlü alt metin - Yüksek kaliteli bir his yaratan bol beyaz alan - Sağ taraf: - Görsel alanın %50'sini kaplayan özelleştirilmiş el çizimi illüstrasyonlar - Tutarlı İllüstrasyon Stili: Çizgi çizimi + yerel renk vurguları - İllüstrasyon içeriği marka hikayesiyle derinlemesine entegre edilmiş - **Gezinme Çubuğu Tasarımı** - Minimalist üst gezinme, sabit konumlandırma - Logo + 2-3 ana menü öğesi - Sağ taraftaki simge grubu (arama/favoriler/menü) - İnce gölgelerle şeffaf veya saf beyaz arka plan - **İçerik Kartı Alanı** - Kart ızgara düzeni (3-4 sütun, duyarlı) - Her kart şunları içerir: - Başlık (Başlık) 3, 32-40px) - Açıklama (2-3 satır, 16-18px, satır yüksekliği 1.6) - Eşlik eden el çizimi illüstrasyon (ana görsel stille tutarlı) - Açık arka plan (#F5F3F0), yuvarlak köşeler (8-12px) - Üzerine gelindiğinde: Hafif yükselen + koyulaştırılmış gölge - ### III. İllüstrasyon Sistemi Özellikleri **İllüstrasyon Oluşturma Yönergeleri** 1. 2. **Çizgi İşleme**: - Gerçekçi resim dokusunu simüle etmek için 1-2px düzensiz el çizimi çizgiler kullanın - Aşırı mekaniklikten kaçınarak, bir miktar yapaylık içeren pürüzsüz çizgiler koruyun. 3. **Renk Kullanımı:** - %80 gri çizgiler + %20 marka rengi dolgusu - Turuncu-kırmızı yalnızca unsurları (insanlar, pencereler, önemli binalar) vurgulamak için kullanılır - Arka plan degrade bej (#FDFBF7 → #F5F1EB) kullanır - 5. **Sahne Kompozisyonu:** - Kentsel sahneler: simge yapılar ve günlük yaşam sahnelerinin harmanlanması - Üstten veya izometrik perspektif - Anlatımı ve samimiyeti artırmak için küçük figürler eklenmesi - 7. **Detay Yoğunluğu:** - Zengin ön plan detayları, orta plan orta derecede basitleştirilmiş ve arka plan ana hatlarıyla belirlenmiş - Görsel hiyerarşiyi koruyarak gözü önemli bilgilere yönlendirme - 9. ### IV. Yazı Tipi Sistemi - **Başlık Yazı Tipi (Görüntüleme):** Serif yazı tipi, kalın ve güçlü (ör. Freight Display, Tiempos) - **Gövde Yazı Tipi (Gövde Metni):** Sans-serif, oldukça okunaklı (ör. Inter, Manrope) - **Yazı Tipi Boyut Oranı**: Modüler bir ölçek kullanır (1,25 veya 1,333) - - **Yazı Tipi Kalınlık Seviyeleri**: Hafif (300) / Normal (400) / Orta (500) / Kalın (700) - ### V. Etkileşim Ayrıntıları - - **Mikro Animasyonlar**: Kartlar üzerine gelindiğinde 4-8 piksel yukarı kayar, geçiş süresi 300-400 ms - - **Yükleme Durumu**: Marka tonunu korumak için iskelet ekran kullanır - - **Duyarlı Ekran Kırılma Noktaları**: - - Masaüstü: 1440 piksel+ - - Tablet: 768-1439 piksel - - Mobil: 375-767px - - ### VI. Tasarım Çıktısı Gereksinimleri Her tasarım çıktısı şunları içermelidir: 1. 2. Net görsel hiyerarşi (boyut/renk/boşluk yoluyla sağlanır) 3. 4. En az bir özel illüstrasyon (içerikle yakından ilgili, Nano Banana Pro kullanılarak oluşturulmuş) 5. 6. 2-3 vurgu rengi vurgusu (en fazla 7. 8. 7. 8. Yeterli nefes alma alanı (bölüm aralığı ≥ 120px) 9. 10. Net kullanıcı eylem yolu 11. --- **Tasarım Felsefesi**: Markanın benzersizliğini ve sıcaklığını iletmek için sanatsal görsel dil kullanın. Her piksel, yalnızca işlevselliği sergilemek yerine bir hikaye anlatmaya hizmet eder. Tasarım, kullanıcılara soğuk, ticari bir ürün yerine "Bu, hayata değer veren insanlar için" hissi vermelidir.

Web sayfasındaki görsellerin tamamı nano banana pro ile oluşturulmuştur.