Bir derin deniz sitesi nasıl DRAPAI'nin moda bloguna dönüştü

Arkadaşımla internette rastgele şeylere bakıyorduk her zamanki gibi. Bir noktada NASA'nın deniz araştırmalarını neden bıraktığını konuşmaya başladık. Oraya nasıl geldiğimizi hatırlamıyorum. Ama bu bize bir siteyi hatırlattı: neal.fun/deep-sea. Okyanusun yüzeyinden dibine kadar aşağı kaydırıyorsunuz, bir derinlik sayacı artıyor ve her derinlikte yaşayan canlıların yanından geçiyorsunuz.

Sayfada gezinirken arkadaşım şöyle dedi:

"Bunu DRAPAI için kullanabiliriz. Yıllara göre moda.."

Bir saniye düşündüm, gerçekten olurdu. Derinlikte aşağı inmek yerine zamanda geriye gidiyorsunuz. Balıklar yerine kıyafetler. Sonra aklıma bir şey daha geldi:

"Sonuna uygulamamız için bir CTA koyarız!"

Arkadaşım da en iyi Walter White sesiyle:

"You goddamn right."

blog.drapai.com böyle başladı.

İş bölümü

Araştırmayı arkadaşım üstlendi. Wikipedia'dan başlayıp her dönemde insanların ne giydiğine dair bakabildiği her yere baktı; elinde bir görünüm listesi, yıllar, nereden geldikleri ve her biri için kısa bir açıklamayla döndü.

Ben siteyi üstlendim. Bileşenleri yaparken bir yandan isimleri ve kimsenin görmediği küçük şeyleri de düşünüyordum: sayfa başlıkları, sayfa açıklamaları, her görsel için alt text formatı. Sonunda iki sayfamız oldu: Kadınlar Nasıl Giyinirdi? ve Erkekler Nasıl Giyinirdi?, ikisi de "Modaya derin bir bakış" adlı bir ana sayfanın altında; bu isim fikrin nereden geldiğine bir gönderme.

Blogdaki giyilmiş görünümlerin hepsi DRAPAI'nin kendisiyle, uygulamanın kullanıcıları için çalıştığı şekilde yapıldı: bir kişi fotoğrafı ve bir kıyafet görseli giriyor, o kişinin o kıyafeti giymiş hâli çıkıyor. Modeller, lisansı bu kullanıma izin veren bir kaynaktan alınmış, yapay zekâyla üretilmiş modeller(ayo gpt...). Yani her dönemde kıyafetin tek başına hâli ve aynı kıyafetin giyilmiş hâli var.

Bugünden başlayıp geriye doğru kaydırıyorsunuz. Kadınlar sayfası 2025'ten MÖ 3400'e, 71 dönem. Erkekler sayfası 2022'den MÖ 2500'e, 60 dönem. İkisi de İngilizce ve Türkçe.

En altta da o kadar heyecanlandığım (niye bu kadar heyecan yaptım hatırlamıyorum, düşünürken çok iyiydi) şey: "Bu elbiseler üzerinizde nasıl dururdu merak ettiniz mi?" ve DRAPAI'yi denemek için bir buton cart curt.

Sonra yayınladık. Gidip kaydırabilirsiniz.

---

Teknik kısım

Nasıl çalıştığını merak edenler için.

Yerleşim

Masaüstünde ekran üç eşit sütuna bölünüyor: solda giyilmiş görünüm, sağda kıyafet, ortada yıl ile birlikte dönemin adı, kökeni ve açıklaması. Görseller kayarken orta sütun sabit kalıyor. Mobilde her dönem bir ekran kaplıyor; iki görsel solda alt alta, yıl ve metin sağda sabit. Her dönem ayrıca kendi renk paletinden bir arka plan gradyanı alıyor.

Yıl sayacı

Bu bizim derinlik sayacımız. İki dönem arasında sayaç, ne kadar kaydırdığınızı aradaki yıllara eşliyor; yani atlamak yerine her yılı tek tek sayıyor. Hızlı kaydırırsanız hızlı sayıyor. Durursanız duruyor.

Takvimde 0 yılı yok: MÖ 1'den hemen sonra MS 1 geliyor. Her dönem tek bir sayı olarak tutuluyor; MÖ için negatif, MS için pozitif. Sayaç sınırı geçerken 0'ı atlıyor. Yoksa kısa bir an "0" gösterir ve o sınırı geçen her aralık bir yıl uzun olurdu.

İçerik

Her sayfa tek bir JSON dosyasından okuyor. Bir kayıtta yıl, MÖ ya da MS bilgisi, dönemin adı, kökeni, bir renk paleti, iki görselin yolu ve iki dildeki etiketler ve açıklamalar var. Import script'leri DRAPAI'den dışa aktarılan görselleri WebP'ye çeviriyor ve ID'leri, yılları ve yolları dolduruyor.

Blog kapısı

Yayından önce sayfalar bir parolanın arkasındaydı; böylece önizlemeleri arama motorlarına yakalanmadan paylaşabiliyorduk. İçimize sinince kapıyı kapattık ve blogu herkese açtık.

Tek build, iki alan adı

blog.drapai.com ile drapai.com aynı build'den geliyor; yani yayınlanacak tek bir site var ve ikisi hiçbir zaman birbirinden farklılaşmıyor.