WEB SAYFASI

Japon Kiraz Çiçeği Vadisi 3D Web İstemcisi

GPT-6 Astra üzerinde test edilen, HTML/CSS/JS ve Three.js kullanarak etkileşimli bir 3D Japon kiraz çiçeği vadisi web sitesi oluşturmak için detaylı istem.

Bu promptla web sayfası oluştur

KomutJapon Kiraz Çiçeği Vadisi 3D Web İstemcisi

Lütfen tarayıcıda gerçek zamanlı olarak etkileşim kurulabilen, yüksek sadakatli (high-fidelity) bir 3D manzara web sayfasını doğrudan oluşturun.

Tema: Japon kiraz çiçeği vadisi.
HTML, CSS ve JavaScript kullanarak uygulayın. Görüntü üretmeyin, sadece tasarım önerileri sunmayın,
Arka plan görseli artı paralaks efektleri ile sahte 3D yapmayın. Gerçekten çalıştırılabilir ve keşfedilebilir bir ürün istiyorum.

[1. Ürün Konumlandırması]

Bu, derinlik katmanlarına sahip tam ve kesintisiz bir vadi manzarasıdır;
izole küçük süslemeler, yüzen adalar, tabanlı kum havuzları veya basit teknik demolar değildir.

Stil modern, ince dokulu voxel sanatıdır:
Küp geometrisinin modelleme dilini koruyun, ancak ekran yüksek çözünürlüklü, kenar yumuşatmalı (anti-aliased) ve hassas ışık-gölge oyunlarına sahip olmalıdır.
Retro düşük çözünürlüklü pikselleştirme yok, kaba blok yığınlama yok, ekrana uygulanan piksel filtreleri yok.

Görsel kalite önceliklidir. Kompozisyon, malzemeler ve aydınlatma pahasına daha az özellik sunmayı tercih edin.

[2. Referans Görsellerin Kullanımı]

Eğer referans görseller eklenmişse, önce bunların kompozisyon hiyerarşisini, ölçeğini, aydınlatmasını ve renk ilişkilerini anlayın.
Sadece atmosferi ve görsel dili ödünç alın, sahneyi yeniden tasarlayın,
binaların, ağaçların, dağların ve yolların konumlarını kopyalamayın, birebir (1:1) taklit etmeyin.

Referans görseller web sayfasındaki arka plan varlıkları değildir. Sahne kendisi gerçek 3D geometrilerden oluşmalıdır.

[3. Sahne Kompozisyonu]

Varsayılan olarak açıldığında, tam ve çekici bir resim sunmalıdır,
kullanıcılar iyi bir açı bulmak için önce kamerayı döndürmek zorunda kalmamalıdır.

Perspektif kamera kullanın, kum havuzu tarzı izometrik yukarıdan bakan kamera değil.
Ekran net ön plan, orta plan ve arka plana sahiptir:

Ön Plan:
Varlıklı, antik bir kiraz çiçeği ağacı; kayalar, bitki örtüsü, taş fenerler ve düşen bazı yapraklarla birlikte,
ekranda doğal bir çerçeve oluşturur ancak nehir, köprü ve ana binaları engellememelidir.

Orta Plan:
Kıvrılan bir nehir bakış açısını ekrana yönlendirir, kırmızı ahşap bir köprü nehrin üzerinden geçer;
köyler, çay evleri, tapınaklar ve yollar arazi boyunca dağılmıştır, binalar arasında gerçek geçiş ilişkileri vardır.
Zemin dalgalanmalara, kıyı şeritlerine ve doğal geçişlere sahiptir, düz bir zemine eşit şekilde yerleştirilmiş modeller değildir.

Arka Plan:
Yamaçlardaki çok katlı kuleler, farklı mesafelerdeki ormanlar ve sırtlar, uzak karlı dağlar.
Mesafeyi ölçek değişiklikleri, örtüşme (occlusion), sıcak/soğuk değişimleri ve atmosferik perspektifle ifade edin,
sadece uzak nesneleri küçültmekle yetinmeyin.

Tüm unsurları eşit şekilde yaymayın. Birincil/ikincil, yoğun/seyrekleşme, boşluk alanları ve net bir görsel odak noktası gereklidir.

[4. Modelleme ve Ekran Kalitesi]

Kiraz Çiçeği Ağaçları:
Gövdelere kıvrımlar, dallanmalar ve kökler verin, tepeler düzensiz çiçek kümelerinden oluşur,
boşluklar, kalınlık varyasyonları ve görünür dallar olsun. Onları birkaç düzenli küre veya blok yığını haline getirmeyin.

Binalar:
Çatılarda katmanlı kiremitler, saçaklar, kirişler, sütunlar ve pencere kafesleri var;
farklı binalar amaç, hacim ve yükseklik açısından farklılıklar gösterir, vadiyi doldurmak için aynı evi kopyalamayın.

Arazi:
Kıyı şeritlerinde nemli taşlar, çimen ve bitki örtüsü geçişleri var.
Aşırı düzenli basamaklardan, tekrarlayan çizgilerden, dama desenlerinden ve belirgin prosedürel üretim gridlerinden kaçının.

Su Yüzeyi:
Çevredeki manzarayı yansıtabilmeli, orta düzeyde dalgalanmalar, derinlik varyasyonları ve kıyı geçişleri olmalı.
Gerçek sahne yansımalarını kullanmaya çalışın; performans düşüşü gerektiğinde bile görsel güvenilirliği koruyun.
Suyu titreyen gürültü, güçlü bozulma veya tümüyle mavi bir düzlemle değiştirmeyin.

Detaylar:
Bazı koi balıkları, düşen çiçekler, ateş böcekleri, şelaleler ve uzak kuşlar olabilir,
ancak hepsi atmosfere hizmet etmeli, ekranı gürültülü göstermemelidir.
Sadece model miktarını iddia etmek için detayları yığmayın.

[5. Renk ve Atmosfer]

Varsayılan "mavi saat" (blue hour):
Soğuk vadiler ve uzak dağlar, yumuşak pembe kiraz çiçekleri, sıcak ama aşırı pozlanmamış fenerler ve pencere ışıkları.
Sıcak ışık insanların aktif olduğu yerde yoğunlaşır, tüm ortamı turuncuya boyamayın.

Yumuşak gölgeler, nesne temas noktalarında ışık/karanlık dengesi, makul pozlama,
kısıtlı bloom, kenar yumuşatma ve mesafe katmanlarıyla ince sis gerekir.

Beyazlamadan, puslu görünümden, aşırı doygunluktan, tam ekran kalın sisten, aşırı pozlanmış ışıklardan ve belirgin kenar tırtıklanmasından (aliasing) kaçının.
Blok geometrisi net olabilir, ancak render'ın kendisi kaba olmamalıdır.

Ayrıca "Sabah" ve "Yağmurlu" atmosferlerini sağlayın;
değiştirirken gökyüzü, ortam ışığı, sis ve yerel efektleri senkronize olarak değiştirin,
sadece arka plan rengini değiştirmekle yetinmeyin.

[6. Etkileşim ve Arayüz]

Dört adet tasarlanmış kamera sağlayın:
Vadi panoraması, nehir kenarı alçak konum, tapınak yolu, yamaçtan kuşbakışı.
Geçişler akıcı olmalı, her kamera bağımsız kompozisyon değerine ihtiyaç duyar.

Temel etkileşim:
Fare sürükleyerek gözlemleme, tekerlek ile yakınlaştırma veya ilerleme, dokunmatik ekranlar sürükleme ve sıkıştırarak yakınlaştırmayı destekler.
Görünümü sıfırla, arayüzü gizle ve mevcut ekranı kaydet işlevlerini sağlayın.

İsteğe bağlı geliştirmeler:
Serbest keşif, yavaş kamera turu, ortam sesi.
Ortam sesi varsayılan olarak kapalıdır, yalnızca kullanıcı aktif olarak tıkladıktan sonra çalar.
Ekstra işlevler varsayılan ekranın bütünlüğünü etkileyemez.

Arayüz ölçülü ve tasarımlı olmalı, manzaraya odaklanmalıdır.
Başlıklar ve kontrol çubukları kenarlarda yer almalı, görsel odağı engellememelidir.
Masaüstü ve mobilde buton taşması, metin üst üste binmesi veya operasyon yapılamama sorunları olmamalıdır.

[7. Mühendislik ve Performans]

Three.js / WebGL kullanımına ve sürüm sabitlenmiş, birbirleriyle uyumlu CDN bağımlılıklarına izin verilir.
Olgun render yeteneklerine öncelik verin, "sıfır bağımlılık" uğruna tüm motoru yeniden yazmayın.

Kendi yazdığınız HTML, CSS, JavaScript tek bir HTML dosyasında organize edilmeye çalışılmalıdır.
Manzara, prosedürel geometri ve malzemelerle üretilir, harici görüntülere veya 3D model kaynaklarına güvenmez.

Tekrarlanan nesneler için uygun toplu (batch) veya örneklenen (instanced) çizim yöntemleri kullanın;
Alt bölümleme (subdivision), gölgeler, yansımalar ve render çözünürlüğünü makul seviyede tutun.
Yüksek kaliteli ve hafif modlar sağlayın, telefonlar varsayılan olarak daha hafif ayarlara geçer.
Detay uğruna voxel sayısında sonsuz artış sağlamayın.

Yükleme uyarıları, WebGL desteklenmiyor uyarıları ve gerekli hata yönetimini ekleyin.
Ses etkinleştirilmediyse otomatik oynatma yapmayın; hareket azaltma sistem tercihlerine saygı gösterin.

[8. Teslim Öncesi Kabul]

Kodu yazdıktan hemen sonra teslim etmeyin.

Eğer mevcut ortam tarayıcıda çalıştırmayı ve ekran görüntüsü almayı destekliyorsa, lütfen önce sayfayı gerçekten açın,
varsayılan kamerayı, dört görünümü, atmosfer geçişini, masaüstü ve mobil düzenleri kontrol edin,
ardından ekran görüntülerine göre belirgin kompozisyon, pozlama, örtüşme ve render sorunlarını düzeltin.

Anahtar kontroller:
Boş ekranlar, yükleme hataları, konsol hataları var mı?
Kesilmeler (clipping), titremeler, gölge banding'i, aşırı pozlama, su yüzeyi anomalileri var mı?
Varsayılan ekran gerçekten tam bir manzara gibi mi görünüyor, yoksa küçük bir kum havuzu mu?
İşlev butonları gerçekten kullanılabilir mi, mobilde taşma var mı?

Kabul için tarayıcı ekran görüntülerini kullanabilirsiniz, ancak görüntü üretim araçlarını çağırmayın.
Tamamlanmamış testleri dürüstçe belirtin, doğrulanmış diye iddia etmeyin.

Son Teslim:
1. Gerçekten var olan, açılabilir bir HTML dosyası veya mevcut ortam tarafından desteklenen etkileşimli önizleme.
2. Eğer mümkünse, gerçek bir tarayıcı render ekran görüntüsünü ekleyin.
3. Çalıştırma yöntemi ve gerekli koşullar hakkında kısa açıklama.

Lütfen üretimi doğrudan tamamlayın; kritik olmayan detaylar için tutarlı tasarım seçimlerini kendiniz yapın,
çözebileceğiniz uygulama sorunlarını bana geri gönderip karar vermemi beklemeyin.

Bu prompt nasıl kullanılır

1
Yukarıdaki tam prompt'u kopyalayın.
2
GPT 6 Astra'i destekleyen bir platform açın (örneğin YouMind) ve prompt'u yapıştırın.
3
Konuyu, stili veya ayrıntıları fikrinize göre değiştirin ve üretin.

Bu, YouMind'ın prompt kütüphanesinden ücretsiz bir AI prompt'udur. Kopyalayıp uyarlayabileceğiniz binlerce web sayfası prompt'u daha keşfedin.

Daha fazla web sayfası prompt'u keşfet

GPT 6 Astra için daha fazla

Daha Fazla Prompt Özelliği

Yapay Zekâ Kütüphanesi

Yapay zekayla prompt arama

Yapay zekanın on binlerce komutu taramasına izin ver. Modele, tarih aralığına ve anahtar kelimeye göre filtrele; görüntülenme, kaydetme, paylaşım gibi etkileşim metriklerine göre sırala.

Ücretsiz dene

Görsel Araçlar

Görselden Prompt'a

Her fotoğrafı ayrıntılı bir AI görsel prompt'una dönüştürün. Ücretsiz görselden prompt'a dönüştürücü kompozisyonu, stili ve ışığı analiz eder; istediğiniz görünümü saniyeler içinde yeniden yaratırsınız.

Görseli Prompt'a Dönüştür

Diğer Prompt Özellikleri

Modele göre

GPT Image 2.5 istemleri GPT Image 2 komutları Nano Banana Pro komutları Seedream 4.5 komutları GPT Image 1.5 komutları Gemini video komutları Seedance 2.0 komutları Grok Imagine Prompts Gemini 3 Pro web sitesi promptları

Ortama göre

Görsel komutları Video komutları Yapay zekâ ile web sitesi oluşturma promptları

Yapay Zeka Araçları

Görselden prompt Fotoğraf promptları GPT Image 2 slaytları

Yaratıcılar için geliştirildi. Sonsuza kadar ücretsiz.

YouMind, dünya çapında yaratıcıların güvendiği AI yaratıcı yardımcıdır. Buradaki her prompt daha hızlı ve daha iyi üretmen için özenle seçildi.

Prompt ile Web Sayfası Oluştur Daha fazla prompt keşfet

Ürün

İndir Fiyatlandırma Yenilikler

Kaynaklar

Skilller Kullanım Senaryoları Blog Markdown'dan 𝕏 Makalesine Agentlar içinWriting Sense değerlendirmesi

Araçlar

Ücretsiz Araçlar

Karşılaştır

Notion NotebookLM ChatGPT Codex GenSpark Gamma Lovart Manus MyMind Perplexity

Şirket

Gizlilik Şartlar Çerez Politikası

AI Summary

Japon Kiraz Çiçeği Vadisi 3D Web İstemcisi

Bu promptla web sayfası oluştur

Bu prompt nasıl kullanılır

GPT 6 Astra için daha fazla

Blender Kamp Ateşi Sahnesi Oluşturma

It Takes Two Tarzı Mini Oyun

GPT-6 Astra 3D Sollama Oyunu İstem Promptu

TRIPO CLI + GPT-6 Astra Hazine Sandığı

Crossy Road Klon Oyun İstemi

Three.js Roadster Sürüş Oyunu

Daha Fazla Prompt Özelliği

Yapay zekayla prompt arama

Görselden Prompt'a

Diğer Prompt Özellikleri

Yaratıcılar için geliştirildi. Sonsuza kadar ücretsiz.