🎨 Sade Zarif Sanat Web
Talimatlar
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.
Açıklama
Öneren
nene@YouMind
Bu beceriyi neden öneriyoruz
Bu beceri, içeriğinizi sade ve zarif bir el çizimi web sayfasına dönüştürerek modern tasarımı geleneksel estetikle birleştirir. İhtiyaçlarınıza özel akıllı illüstrasyonlar ve zarif renk-yazı tipi sistemleriyle, ürününüzü görsel olarak öne çıkaran sanat ve marka sıcaklığı dolu sayfalar oluşturur.
İçeriğinizi, sanatsal bir el çizimi tarzındaki web sayfasına dönüştürün. Zarif çizgi illüstrasyonlar ve uyumlu renkler, mesajlarınıza sıcaklık ve tat katar.
İlgili beceriler
Tümünü gör
Web sayfasıKeşfedilebilir Sayfa Yapıcı
Bir rapor açıklar. Bir sayfa insanların kendi kendine keşfetmesini sağlar. YouMind zaten web sayfaları oluşturabilir. Explorable Explainer ne inşa edileceğine karar verir — bir araştırmayı, bir veri setini veya bir konuyu, haber grafikleri ve keşfedilebilir açıklamalar geleneğinde tek bir etkileşimli sayfaya dönüştürür: kaydırma odaklı anlatı, gerçek grafikler, hareket ettirebileceğiniz kontroller, kontrol edebileceğiniz kaynaklar. Kodlamadan önce plan yapar. Önce bir yapım planını onaylarsınız: sayfanın cevapladığı tek soru, aydınlanma anı — okuyucunun "oh" hissetmesi gereken an — beş ila sekiz bölümlük kaydırma omurgası, her biri okuyucunun onu hareket ettirerek öğrendikleriyle gerekçelendirilen iki ila dört etkileşim ve her sayının ve nereden geldiğinin listelendiği bir veri sözleşmesi. Ardından, derleme adımı olmadan tek bir kendi kendine yeterli HTML dosyası oluşturur. Anlamsal işaretleme. Tüm sayılar en üstte tek bir düzenlenebilir DATA sabitinde. Telefonda bozulmayan kaydırma açılışları. Her kontrol, geçerli değerini açıklayan canlı metin içeren gerçek, klavyeyle çalıştırılabilir bir form öğesidir. Erişilebilirlik sonradan eklenmiş değil, baştan inşa edilmiştir: 4.5:1 kontrast, görünür odak halkaları, her yerde alternatif metin, yalnızca renkle taşınan anlam yok, azaltılmış hareket dikkate alınır, 360px'den itibaren duyarlı. Teslim etmeden önce beş maddelik bir öz değerlendirme yapar ve sonuçları dürüstçe bildirir: aydınlanma anı gerçekten işe yarıyor mu, sayfa JavaScript kapalıyken hâlâ okunuyor mu, sekme sırası mantıklı mı, her sayı izlenebilir mi, okuyucunun durdurmak isteyeceği hareket eden bir şey var mı. Asla bozmayacağı iki kural: bir grafiği iyi göstermek için asla veri uydurmaz ve sayılarınız taslağınızla çeliştiğinde size söyler. Çalışmalarının gözden geçirilmesindense keşfedilmesini isteyen araştırmacılar, analistler, gazeteciler, eğitimciler, bağımsız kurucular ve danışmanlar için.
Web sayfasıYumuşak Işık Gündüz Yüzen Web
Yumuşak ışık gündüz tarzı web tasarım sistemi: açık gök mavisi tuval (#ebf5ff), sabit 500 yazı ağırlığına sahip büyük gösterim yazıları (responsive maksimum 148px), 32px yuvarlatılmış köşeli kartlar + 9999px hap (pill), neredeyse siyah #181d27 dolu CTA, pastel renk blokları ve yüzen 3D kil benzeri illüstrasyonlar. Derinlik yalnızca tuvalden karta renk tonu geçişiyle sağlanır; içerik kartlarında sıfır gölge. 「Yumuşak ışık gündüz stili」「3D illüstrasyon açılış sayfası」「açık mavi tuval」「yuvarlak kart stili」「SaaS ana sayfası」「Linear/Framer stili」 gibi ihtiyaçlar için uygundur; yerleşik erişilebilirlik ve responsive kısıtlamalar içerir.
Web sayfasıFashion Creative Design Web
Moda editöryel poster tarzı web tasarım sistemi: sıcak krem kağıt kanvas (#fffef7), 300 font ağırlığında büyük başlıklar (64–84px), kenardan kenara fotoğraflar, sıfır gölge, dik açılı kartlar + 1440px hap yuvarlaklığında düğmeler. Moda tasarım stili, dergi düzeni, poster tarzı, sanat kataloğu web sayfası, stüdyo portfolyosu ve galeri sayfası gibi ihtiyaçlar için uygundur. Her türlü içeriği üst düzey moda editöryel tarzı sayfalara dönüştürebilir.
🎨 Sade Zarif Sanat Web
Talimatlar
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.
Açıklama
Öneren
nene@YouMind
Bu beceriyi neden öneriyoruz
Bu beceri, içeriğinizi sade ve zarif bir el çizimi web sayfasına dönüştürerek modern tasarımı geleneksel estetikle birleştirir. İhtiyaçlarınıza özel akıllı illüstrasyonlar ve zarif renk-yazı tipi sistemleriyle, ürününüzü görsel olarak öne çıkaran sanat ve marka sıcaklığı dolu sayfalar oluşturur.
İçeriğinizi, sanatsal bir el çizimi tarzındaki web sayfasına dönüştürün. Zarif çizgi illüstrasyonlar ve uyumlu renkler, mesajlarınıza sıcaklık ve tat katar.
İlgili beceriler
Tümünü görWeb sayfasıKeşfedilebilir Sayfa Yapıcı
Bir rapor açıklar. Bir sayfa insanların kendi kendine keşfetmesini sağlar. YouMind zaten web sayfaları oluşturabilir. Explorable Explainer ne inşa edileceğine karar verir — bir araştırmayı, bir veri setini veya bir konuyu, haber grafikleri ve keşfedilebilir açıklamalar geleneğinde tek bir etkileşimli sayfaya dönüştürür: kaydırma odaklı anlatı, gerçek grafikler, hareket ettirebileceğiniz kontroller, kontrol edebileceğiniz kaynaklar. Kodlamadan önce plan yapar. Önce bir yapım planını onaylarsınız: sayfanın cevapladığı tek soru, aydınlanma anı — okuyucunun "oh" hissetmesi gereken an — beş ila sekiz bölümlük kaydırma omurgası, her biri okuyucunun onu hareket ettirerek öğrendikleriyle gerekçelendirilen iki ila dört etkileşim ve her sayının ve nereden geldiğinin listelendiği bir veri sözleşmesi. Ardından, derleme adımı olmadan tek bir kendi kendine yeterli HTML dosyası oluşturur. Anlamsal işaretleme. Tüm sayılar en üstte tek bir düzenlenebilir DATA sabitinde. Telefonda bozulmayan kaydırma açılışları. Her kontrol, geçerli değerini açıklayan canlı metin içeren gerçek, klavyeyle çalıştırılabilir bir form öğesidir. Erişilebilirlik sonradan eklenmiş değil, baştan inşa edilmiştir: 4.5:1 kontrast, görünür odak halkaları, her yerde alternatif metin, yalnızca renkle taşınan anlam yok, azaltılmış hareket dikkate alınır, 360px'den itibaren duyarlı. Teslim etmeden önce beş maddelik bir öz değerlendirme yapar ve sonuçları dürüstçe bildirir: aydınlanma anı gerçekten işe yarıyor mu, sayfa JavaScript kapalıyken hâlâ okunuyor mu, sekme sırası mantıklı mı, her sayı izlenebilir mi, okuyucunun durdurmak isteyeceği hareket eden bir şey var mı. Asla bozmayacağı iki kural: bir grafiği iyi göstermek için asla veri uydurmaz ve sayılarınız taslağınızla çeliştiğinde size söyler. Çalışmalarının gözden geçirilmesindense keşfedilmesini isteyen araştırmacılar, analistler, gazeteciler, eğitimciler, bağımsız kurucular ve danışmanlar için.
Web sayfasıYumuşak Işık Gündüz Yüzen Web
Yumuşak ışık gündüz tarzı web tasarım sistemi: açık gök mavisi tuval (#ebf5ff), sabit 500 yazı ağırlığına sahip büyük gösterim yazıları (responsive maksimum 148px), 32px yuvarlatılmış köşeli kartlar + 9999px hap (pill), neredeyse siyah #181d27 dolu CTA, pastel renk blokları ve yüzen 3D kil benzeri illüstrasyonlar. Derinlik yalnızca tuvalden karta renk tonu geçişiyle sağlanır; içerik kartlarında sıfır gölge. 「Yumuşak ışık gündüz stili」「3D illüstrasyon açılış sayfası」「açık mavi tuval」「yuvarlak kart stili」「SaaS ana sayfası」「Linear/Framer stili」 gibi ihtiyaçlar için uygundur; yerleşik erişilebilirlik ve responsive kısıtlamalar içerir.
Web sayfasıFashion Creative Design Web
Moda editöryel poster tarzı web tasarım sistemi: sıcak krem kağıt kanvas (#fffef7), 300 font ağırlığında büyük başlıklar (64–84px), kenardan kenara fotoğraflar, sıfır gölge, dik açılı kartlar + 1440px hap yuvarlaklığında düğmeler. Moda tasarım stili, dergi düzeni, poster tarzı, sanat kataloğu web sayfası, stüdyo portfolyosu ve galeri sayfası gibi ihtiyaçlar için uygundur. Her türlü içeriği üst düzey moda editöryel tarzı sayfalara dönüştürebilir.
Bir sonraki favori becerini bul
Araştırma, üretim ve günlük işler için özenle seçilmiş daha fazla AI becerisini keşfet.