30 Saniyede
Bir çalışan, arkadaşı için küçük bir dijital hediye kutusu hazırlar: bir not, şarkılar, videolar, podcast önerileri ve “senlik bilgiler”. Kutunun bağlantısı alıcıya e-postayla gider; alıcı linke tıklar, kutuyu tıklayıp açar ve kartlar animasyonla saçılır. Hesap açmak, ödeme yapmak yok — sadece bağlantı. Referans alınan ücretli üründen (alittleboxofgoodies.com) farkı: tamamen ücretsiz, kurum içi ve markaya uyarlanmış.
İş Problemi & Fırsat
Kurum içi takdir ve kutlama çoğunlukla bir Teams mesajına sıkışıyor; kişisel his taşımıyor. Hazır “hediye kutusu” ürünleri ise ücretli ve kurum dışı. Fırsat: aynı duygusal deneyimi kurumun kendi platformunda, ödeme ve üyelik olmadan vermek — düşük maliyetli ama hatırlanır bir çalışan deneyimi dokunuşu.
Kullanıcı Deneyimi
Gönderen, tek sayfalık kurucu ekranda alıcının adını/e-postasını yazar, beş kart tipinden istediklerini doldurur (her tipten en fazla bir tane) ve canlı önizlemede kutunun alıcıda nasıl görüneceğini aynen görür. “Gönder” deyince bağlantı alıcıya e-postayla gider. Alıcı linki açar; karşısında robotlu, markalı bir sahne ve kapalı bir koli vardır. Koliye tıklayınca kutu sallanır, açılır, kartlar içinden fırlayıp yüzer; her karta tıklayınca içerik (not, gömülü Spotify/YouTube oynatıcı, madde listesi) bir panelde açılır. Deneyim telefonda da tam çalışır — dar ekranda sahne otomatik olarak sütun düzenine döner.
Sahibin Amacı / Vizyon
Amaç “e-kart” değil, açması keyifli bir an tasarlamak: merak (kapalı koli) → küçük tören (sallanma, açılış) → keşif (kartlar). Tasarımcının sabit 1920×1080 kompozisyonu, karta ve ekrana göre esneyen bir sahne sistemine çevrildi. Bilinçli sadelik kararları: dosya yükleme yok (beş kart tipinin hepsi metin/bağlantı), hesap yok, ödeme yok. Yol haritasında MS Entra SSO ile “Borusan hesabınla gir, alıcıyı listeden seç” var [?].
Nasıl Çalışır (sade)
- Gönderen formu doldurur; kartlar tek bir pakete yazılır.
- Sistem pakete tahmin edilemez bir bağlantı üretir ve alıcıya e-postayla yollar.
- Alıcı bağlantıyı açar; sayfa herkese açıktır ama adresi bilmeyen bulamaz.
- Kutu açıldığında sistem “açıldı” bilgisini sayar (gönderene geri bildirim zemini).
- Kart içindeki müzik/video bağlantıları tanınan servislerdense sayfada gömülü çalar.
Teknik özet: Next.js 15 (App Router) + tek tablolu Postgres (kartlar jsonb), self-hosted useSend ile e-posta, Coolify/Docker deploy.
Yeniden Kullanılabilir Yetenekler
- tahmin-edilemez-baglanti-paylasimi — Üyelik istemeden “sadece linki bilen görsün” paylaşımı. Davetiyeler, kişisel raporlar, teklif/sertifika paylaşımı gibi her senaryoya taşınır.
- guvenli-link-embed — Kullanıcının yapıştırdığı Spotify/YouTube/Vimeo bağlantısını (listeler dâhil) güvenle sayfada oynatır. İçerik kürasyonu olan her ürüne hazır parça.
- olcek-bagimsiz-sahne-kompozisyonu — Tasarımcının sabit ölçülü kompozisyonunu her ekranda ve küçük önizlemede aynı bileşenle gösterir. Kampanya mikrositeleri ve builder+önizleme ekranları için ideal.
- eposta-bildirim-sistemi — Bağlantıyı alıcıya kendi altyapımızdan (useSend) ulaştırır; gönderen bazlı saatlik hız sınırı ile kötüye kullanım frenli.
İş Etkisi / Sonuç
Canlıda, Borusan iç kullanımına sunulmuş durumda; kutu açılışları sayılıyor. Yaygın kullanım metrikleri henüz yok [?]. Ağustos 2026’daki güvenlik olayı (framework RCE’si üzerinden env sızıntısı) hızlı müdahaleyle kapatıldı; ders çıkarımları deploy standardına işlendi (sır rotasyonu, erişim kilidi, is_buildtime=false).
Ekran görüntüleri
— Kurucu ekran: kart editörleri + canlı önizleme.
— Alıcı sayfası: kapalı koli + “hediyeni açmak için tıkla”.
— Açılmış kutu: saçılan kartlar ve robot.
— Kart paneli: gömülü Spotify/YouTube oynatıcı.
— Mobil sütun düzeni.
Teknik Detaylar (geliştiriciler için)
- Stack: Next.js 15 App Router + TypeScript; Postgres tek tablo (
packages), kartlarjsonb;pgiçinserverExternalPackageszorunlu. Şema, ilk sorgudan önce çalışan tembelready()adımıyla uygulanır (edge-runtime/pre_deployment_commandtuzaklarını aşar). - Sahne:
container-type: size+cqh/cqw; yerleşim yüzde cinsindenscene.ts’de. 720px altı (ve dikey tablet) sütun düzeni. - Güvenlik: paket id 16 karakter/~93 bit; bulunamayan/bozuk/silinmiş id’ler aynı 404. Yönetici yüzeyi geçici oturum kilidi arkasında (SSO’ya kadar); alıcı sayfaları ve statik varlıklar muaf. E-posta gönderiminde gönderen bazlı saatlik sınır + honeypot.
- Mail: useSend (Resend uyumlu, self-hosted).
fromdomaini useSend’de doğrulanmış olmalı. - Deploy: Coolify + Dockerfile build pack; tüm env’ler
is_buildtime=false.
Tekrar Kullanım Notları
Strateji: Aynı iskelet (kur → linkle paylaş → törenle aç) başka duygusal anlara taşınır: doğum günü/iş yıldönümü kutlamaları, hoş geldin paketleri, etkinlik davetiyeleri, müşteriye kişisel teşekkür sayfaları. Kart tipleri kolayca değişir (ör. “fotoğraf anısı”, “hediye çeki kodu”).
Teknik: Yeni kart tipi eklemek üç dokunuş (tip tanımı + ikon + sahne yuvası). Marka değişimi sahne görselleri + iki renk paletiyle sınırlı. SSO seam’i hazır (AUTH_MODE); kurumsal kimlikle alıcı seçimi eklenirken paket-link modeli aynen kalabilir.