6 Haziran rozet stüdyosu web uygulaması
  1. Ana sayfa
  2. Referanslar
  3. 6 Haziran Rozet Stüdyosu

6 Haziran Rozet Stüdyosu: Tarayıcıda çalışan bir web uygulaması

Özel Yazılım · Web Uygulaması · Grafik Tasarım

Özet

6 Haziran Ceza İnfaz Personeli Günü’nde personeli onurlandırmak için, kendi girişimimizle, personelin kendi fotoğrafını kurumsal bir rozete yerleştirip indirebildiği bir web uygulaması geliştirdik. Kullanıcı adını, kurumunu ve unvanını yazıyor, fotoğrafını seçiyor, kırmızı ya da mavi temayı belirleyip rozetini indiriyor. Fotoğraf sunucuya yüklenmiyor; işlem tamamen kullanıcının tarayıcısında yapılıyor.

Başlangıçtaki durum

Özel günlerde herkes aynı çerçeveyi kullanmak ister ama bunu herkese tek tek tasarlatmak mümkün değildir. Hazır “çerçeve” uygulamaları ise fotoğrafı bilinmeyen sunuculara yükler. İhtiyaç; telefondan saniyeler içinde kullanılabilen, kurumsal görünümlü ve kişisel veriyi hiçbir yere göndermeyen bir araçtı.

Bu proje bir kurumun ya da kişinin siparişi değil; fikir bizden çıktı. Amacımız 6 Haziran Ceza İnfaz Personeli Günü’nde personeli onurlandırmak, bu güne destek olmak ve sosyal medyada farkındalık oluşturmaktı. Uygulama resmî bir kurum ürünü değildir; herkesin ücretsiz kullanımına açtık.

Rozet tasarımı

6 Haziran için iki temalı (kırmızı ve mavi) bir rozet tasarladık: yuvarlak fotoğraf alanı, özel gün tipografisi ve kullanıcının adı, kurumu ve unvanı için ayrılmış alanlar.

Tarayıcıda çalışan uygulama

  • Basit form: ad soyad, kurum, meslek/unvan, isteğe bağlı sosyal medya hesabı.
  • Fotoğraf seçme ve yerleştirme: görsel, HTML5 Canvas ile tarayıcıda işleniyor.
  • Tema seçimi: tek tıkla kırmızı ya da mavi.
  • İndirme: hazır rozet, paylaşmaya uygun bir görsel dosyası olarak cihaza iniyor.
  • Veri gizliliği: Fotoğraflar sunucuya yüklenmiyor ve saklanmıyor. Yalnızca katılım sayısını görmek için bir sayaç kullanılıyor; kullanıcı bu konuda sayfada KVKK kapsamında bilgilendiriliyor.
  • Uygulama içi tarayıcı uyarısı: Instagram veya WhatsApp içinden açanlara, indirmenin sorunsuz çalışması için harici tarayıcı kullanmaları hatırlatılıyor.
  • WordPress kullanmadan, hafif ve hızlı açılan özel HTML/JavaScript ile geliştirildi.

Mobil görünüm

Site telefonda; menü, içerik ve iletişim butonları tek elle kullanılacak şekilde tasarlandı.

6 Haziran web sitesinin masaüstü anasayfa görünümü
6haziran.com · masaüstü görünüm

Sonuçlar

  • Personel, rozetini telefonundan, bir dakikadan kısa sürede hazırlayıp indirebiliyor.
  • Kişisel fotoğraf hiçbir sunucuda tutulmuyor.
  • 700’den fazla rozet oluşturuldu. 500’ü aşkın kişi kendi rozetini hazırladı; geri kalanı aynı kullanıcıların farklı tema ve versiyon denemeleri.

Kullanılan teknoloji

HTML5 · CSS · JavaScript · Canvas API · Google Analytics 4

Diğer vakalar

Sırada kim var?

Benzer bir proje mi düşünüyorsunuz?

Kampanya uygulaması, hesaplama aracı, randevu sistemi ya da işletmenize özel bir panel... Fikrinizi anlatın, size uygun teknolojiyi ve kapsamı birlikte belirleyelim.