İçeriğe geç
A—49

Arvo Decor

Kişiye özel mutfak ve mobilya atölyesi için koyu tonlu, galeri ağırlıklı bir site

Sektör
Mimarlık & yapı
Ülke
Türkiye
Kategori
Web tasarım
Hizmetler
Web tasarım & geliştirme
Teknoloji
Next.js 16, React 19, TypeScript, Tailwind CSS 4, Framer Motion, Zod, Nodemailer, Vitest
Arvo Decor sitesinin masaüstü ve mobil görünümü

01 /

İhtiyaç

Arvo Decor, İstanbul Ataşehir’de kişiye özel mutfak ve mobilya üreten butik bir atölye; işe Artpoint Mimarlık bünyesinde bir üretim atölyesi olarak başlamış. Atölye, ürünlerini katalog gibi değil, mimari bir bakışla sunan bir site istiyordu: mutfaklar, yemek ve yatak odaları, genç odaları ve tamamlanan projeler. Koyu, sıcak tonlu bir arayüzle Next.js üzerinde bir site geliştirdik. Ana sayfada manşet slaytı, kategori ızgarası ve öne çıkan koleksiyon var. Mutfak sayfası stilleri, kapak malzemelerini ve keşiften montaja dört adımlı süreci anlatıyor. Projeler türe göre filtreleniyor, ürün sayfalarında büyütülebilir bir galeri var. Ziyaretçi teklif butonu, WhatsApp ya da iletişim formuyla atölyeye ulaşıyor. Site henüz yayında değil; görseller yerel kurulumdan alındı.

Ekranlar

Canlı siteden alınmış güncel ekran görüntüleri: sayfanın tamamı, iç sayfalar ve telefondaki görünüm.

Ana sayfa

Arvo Decor — Ana sayfa
Arvo Decor — Bölümler ve iç sayfalar

Bölümler ve iç sayfalar

Arvo Decor — Bölümler ve iç sayfalar
Arvo Decor — Bölümler ve iç sayfalar
Arvo Decor — Bölümler ve iç sayfalar
Arvo Decor — Telefonda

02 /

Yaklaşım

Projeyi şekillendiren üç karar.

  1. 01

    İçerik tek yerde, erişim tek katmanda

    Ürünler, kategoriler, iletişim bilgileri ve menü tipli tek bir veri dosyasında duruyor. Sayfalar bu veriyi doğrudan değil, asenkron okuma fonksiyonları üzerinden alıyor; ileride bir içerik yönetim sistemine geçildiğinde yalnızca bu katman değişecek.

  2. 02

    Mutfağa ayrı bir sayfa

    Atölyenin asıl işi mutfak. Bu yüzden mutfağı kategori listesine sıkıştırmadık; stil seçenekleri, lake, akrilik, masif ahşap ve membran kapaklar ile keşif, tasarım, üretim ve montaj adımları kendi sayfasında anlatılıyor.

  3. 03

    Form doğrulaması iki tarafta aynı

    İletişim formu tarayıcıda ve sunucuda aynı Zod şemasıyla doğrulanıyor, bu şema Vitest ile test ediliyor. Sunucu tarafında IP başına istek sınırı var; mesaj SMTP üzerinden atölyeye iletiliyor.

03 /

Neler yaptık

  • Manşet slaytı ve kategori ızgarası olan ana sayfa
  • Stil, malzeme ve süreç anlatan mutfak sayfası
  • Türe göre filtrelenen proje portföyü
  • Büyütülebilir galerili ürün sayfaları
  • Doğrulamalı iletişim formu ve bülten kaydı
  • WhatsApp butonu, sabit teklif butonu ve site içi arama
  • Açık ve koyu tema, site haritası ve paylaşım görseli

Kullanılan teknolojiler

  • Next.js 16
  • React 19
  • TypeScript
  • Tailwind CSS 4
  • Framer Motion
  • Zod
  • Nodemailer
  • Vitest

Kod ve alan adı tamamen müşterimize ait.

Sonraki proje

A—50

Nargilecix

Ana sayfası, kataloğu ve blogu tek panelden yönetilen nargile mağazası

Perakende & e-ticaret · Türkiye