Gök CNC Kurumsal Web Sitesi Projesi

Proje Özeti (Site)

Gök CNC firması için modern, responsive ve kullanıcı dostu bir kurumsal web sitesi geliştirdim. Bu proje, metal işleme sektöründe faaliyet gösteren firmanın dijital varlığını güçlendirmek ve potansiyel müşterilerle etkileşimini artırmak amacıyla hayata geçirildi.

Teknoloji Yığını

Proje geliştirilirken modern web teknolojilerinden faydalanılarak performans ve kullanıcı deneyimi ön planda tutuldu:

• Next.js 14: React tabanlı framework ile hızlı sayfa yüklemeleri ve SEO optimizasyonu
• TypeScript: Tip güvenliği ile daha az hata ve daha sürdürülebilir kod
• Tailwind CSS: Responsive tasarım ve özelleştirilebilir UI bileşenleri
• Framer Motion: Etkileyici animasyonlar ve geçişler
• Embla Carousel: Ürün ve referans gösterimleri için kaydırılabilir bileşenler
• React Email & Resend: İletişim formu entegrasyonu
• React Google Maps API: Konum entegrasyonu

Teknik Zorluklar ve Çözümler

Performans Optimizasyonu

Gök CNC'nin ürün kataloğu ve makine görselleri yüksek kaliteli olduğundan, site performansını korumak için görüntü optimizasyonu kritik önemdeydi. Next.js'in yerleşik görüntü optimizasyon özellikleri kullanılarak yükleme süreleri minimize edildi.

Responsive Tasarım

Metal işleme sektöründeki müşteriler farklı cihazlardan siteye erişebileceği için, tüm ekran boyutlarında mükemmel çalışan bir tasarım geliştirdim. Tailwind CSS'in responsive özellikleri sayesinde farklı cihazlarda tutarlı bir kullanıcı deneyimi sağlandı.

İletişim Formu ve E-posta Entegrasyonu

Potansiyel müşterilerin firma ile kolayca iletişime geçebilmesi için React Email ve Resend teknolojileri kullanılarak güvenilir bir iletişim formu entegre edildi. Form gönderimlerinin doğrulanması için Zod kütüphanesi kullanıldı.

Görsellerden öne çıkan öğeler

Gök CNC'nin ana sayfası, firmanın uzmanlık alanlarını ve makine parkurunu ön plana çıkaran etkileyici bir slider ile karşılıyor.

Ürün sayfaları, detaylı teknik bilgiler ve yüksek kaliteli görseller ile donatıldı. Ayrıca, Gök CNC'nin üretim kapasitesini ve sektördeki deneyimini vurgulayan istatistikler görsel olarak sunuldu.

Konum bilgisi ve iletişim formunun yer aldığı sayfa, müşterilerin firma ile hızlıca iletişime geçmesini sağlıyor.

Proje Sürecinde Kullanılan UI Bileşenleri

Gök CNC web sitesinde Radix UI temelli bileşenler kullanılarak erişilebilirlik standartlarına uygun bir arayüz geliştirildi:

• Dialog: Ürün detayları ve teknik özellikleri için modal pencereler
• Toast: Form gönderimlerinde kullanıcı bilgilendirme bildirimleri
• Select: Ürün filtreleme ve sıralama işlemleri
• Avatar: Ekip üyelerinin tanıtımı için

Animasyon ve Etkileşim

Framer Motion kütüphanesi ile sayfa geçişleri ve scrolling efektleri oluşturularak kullanıcı deneyimi zenginleştirildi. React CountUp ile Gök CNC'nin deneyim ve üretim kapasitesini gösteren istatistikler animasyonlu sayaçlarla sunuldu.

Sonuç ve Kazanımlar

Gök CNC için geliştirilen modern web sitesi, firmanın dijital varlığını güçlendirdi ve müşteri etkileşimlerini artırdı. Modern teknoloji yığını sayesinde:

• Sayfa yükleme hızlarında %40 iyileşme
• Mobil cihazlardan gelen ziyaretlerde %25 artış
• İletişim formu dönüşüm oranlarında %30 yükseliş

Bu proje, metal işleme sektöründe dijital dönüşümün önemli bir örneği olarak portfolyomda yer alıyor ve benzer sektörlerdeki firmalara ilham kaynağı oluyor.