Anex Tour B2C Project

Anex Tour, çatısı altında birden fazla destinasyon markasını barındıran büyük bir seyahat grubu. Bu projede önce Anex Tour için genel bir tasarım ve bileşen kütüphanesi (design system) kurdum; bu kütüphane üzerinden de tüketiciye yönelik ana ürün olan Anex Tour B2C rezervasyon platformunu tasarladım. Aynı sistem, grubun sahip olduğu diğer destinasyon sitelerinde de kullanılıyor; ancak her sitenin hedef kitlesi farklı olduğu için bileşen bazında küçük mimari farklılıklarla (filtre önceliklendirmesi, kart yerleşimi, içerik ağırlığı gibi) her pazara özel bir deneyime dönüştürülüyor. Bu yazıda süreci sorun–çözüm mantığıyla ve kullanıcı akışı üzerinden detaylı şekilde anlatıyorum.

Projeye başladığımda karşımda ortak bir tasarım dili olmayan, her destinasyon sitesinin kendi içinde farklı geliştiği dağınık bir yapı vardı. Yeni bir pazar açılacağı zaman ekip sıfırdan arayüz tasarlıyor, bu da hem tasarımda hem geliştirmede zaman kaybına ve markalar arası tutarsızlığa yol açıyordu. Rezervasyon akışı tarafında ise otel ve uçuş seçimi ayrı ayrı ekranlarda ilerliyor, kullanıcı seçim yaptıkça bağlamını kaybediyordu; toplam fiyat yalnızca ödeme adımının son ekranında görünüyordu ve bu da güven sorunu yaratıyordu.

Mobil deneyim ise neredeyse masaüstünün küçültülmüş bir versiyonuydu: filtreleme paneli küçük ekranlarda kullanılamaz haldeydi, kullanıcı doğru filtreyi bulmak için sürekli aşağı yukarı kaydırmak zorunda kalıyordu. Sonuç olarak kullanıcılar arama yapmaya başlıyor ama filtreleme ve karşılaştırma adımlarında akıştan kopuyor, rezervasyonu tamamlamadan platformdan ayrılıyordu.

İlk adım olarak Anex Tour çatısı için token bazlı (renk, tipografi, spacing, radius) bir tasarım kütüphanesi kurdum. Otel/uçuş kartları, arama çubuğu, filtre paneli, rezervasyon özeti, form elemanları gibi tüm temel bileşenleri tek bir yerde, varyantlarıyla birlikte tanımladım. Bu kütüphane sayesinde yeni bir destinasyon sitesi artık sıfırdan tasarlanmıyor; mevcut bileşenler yeni marka token'larıyla yeniden renklendirilip, ihtiyaca göre birkaç bileşen varyantı değiştirilerek devreye alınabiliyor. Bu, hem tasarım hem geliştirme sürecini önemli ölçüde hızlandırdı ve markalar arası tutarlılığı garanti altına aldı.

Kurduğum tasarım kütüphanesi olgunlaştıktan sonra, bu sistemi kullanarak Anex Tour'un tüketiciye dönük ana ürünü olan B2C rezervasyon platformunu tasarladım. Burada amaç, kullanıcıyı arama anından ödeme onayına kadar tek bir kesintisiz akışta tutmaktı: destinasyon ve tarih seçimi, sonuç listesi, otel/uçuş detayı, sepet özeti ve ödeme adımlarını aynı görsel dil ve aynı etkileşim mantığıyla birbirine bağladım. Artık kullanıcı hangi ekranda olursa olsun toplam fiyatı ve seçimlerini yan panelde sabit şekilde görebiliyor; bu da eskiden ödeme adımına gelene kadar belirsiz kalan fiyat sorununu ortadan kaldırdı.

Mobilde filtreleme paneli artık alttan açılan (bottom-sheet) bir yapıya taşındı; en çok kullanılan filtreler (bölge, yıldız, konsept, fiyat aralığı) her zaman ilk ekranda, geri kalanı ise 'daha fazla filtre' altında yer alıyor. Bu sayede kullanıcı, eskiden olduğu gibi doğru filtreyi bulmak için ekranı defalarca kaydırmak zorunda kalmıyor.

Rezervasyon akışını altı temel adıma böldüm ve her adımda hem eski deneyimdeki sorunu hem de getirdiğim çözümü netleştirdim. Amaç, kullanıcının hiçbir noktada 'nerede olduğumu, ne seçtiğimi, ne kadar ödeyeceğimi' sorgulamak zorunda kalmamasıydı.

1. Giriş & Arama

Eskiden anasayfadaki arama formu destinasyon, tarih ve kişi sayısını ayrı ayrı, çok adımlı bir modallar dizisiyle soruyordu. Yeni tasarımda tüm arama kriterlerini tek bir yatay arama çubuğunda topladım; destinasyon alanı otomatik tamamlama ve popüler destinasyon önerileriyle destekleniyor, tarih seçimi tek takvim üzerinden gidiş-dönüş olarak yapılabiliyor. Kullanıcı artık aramaya iki dokunuşla başlayabiliyor.

2. Sonuç Listesi & Filtreleme

Önceki yapıda sonuç listesi ile filtre paneli birbirinden kopuk çalışıyor, filtre değiştiğinde sayfa yeniden yükleniyordu. Yeni akışta filtreler anlık (client-side) olarak uygulanıyor, sonuç sayısı filtre panelinin üzerinde canlı güncelleniyor. Sıralama seçenekleri (fiyat, popülerlik, puan) ve konsept bazlı hızlı etiketler (her şey dahil, aile dostu vb.) listenin hemen üstünde, tek dokunuşla erişilebilir konumda.

3. Otel / Uçuş Detayı

Detay sayfasında eskiden görsel galerisi, oda tipleri ve fiyat bilgisi farklı sekmelere dağılmış durumdaydı; kullanıcı karar vermek için sürekli sekme değiştirmek zorundaydı. Yeni tasarımda tek sayfalık, dikey kaydırmalı bir yapı kurdum: galeri üstte, oda/uçuş seçenekleri ortada, sabit bir alt bar üzerinden seçili oda ve güncel toplam fiyat her zaman görünür durumda.

4. Sepet Özeti

Sepet, eski yapıda yalnızca ayrı bir sayfada görülebiliyordu; kullanıcı aramaya geri dönmek istediğinde sepetini kaybetme riskiyle karşı karşıyaydı. Yeni tasarımda sepet özeti, arama sonucundan ödeme adımına kadar tüm süreç boyunca sağ tarafta sabit (sticky) bir panel olarak kullanıcıyı takip ediyor; otel, uçuş, kişi sayısı ve toplam fiyat her an tek bakışta görülebiliyor.

5. Ödeme

Ödeme adımını tek sayfalık bir forma indirdim: yolcu bilgileri, iletişim bilgileri ve ödeme bilgileri tek akışta, adım göstergesiyle (stepper) birlikte ilerliyor. Toplam fiyat kırılımı (oda, uçuş, vergi/hizmet bedeli) artık bu adımda bir sürpriz olarak değil, sürecin başından beri görünen sepet panelinin doğal bir devamı olarak karşılaşılıyor. Bu, satın alma sırasında güven hissini doğrudan artıran en kritik değişikliklerden biri oldu.

6. Onay

Son adımda kullanıcıya rezervasyon özeti, e-bilet/voucher bilgisi ve destek iletişim kanalları tek ekranda sunuluyor. Eskiden yalnızca e-posta ile iletilen bu bilgiler artık uygulama içinde de erişilebilir durumda, böylece kullanıcı rezervasyonuna dair her şeyi platformdan tekrar bulabiliyor.

Anex Tour B2C için kurduğum bu sistem, grubun sahip olduğu diğer destinasyon sitelerinde de temel altyapı olarak kullanılıyor. Ancak her sitenin hedef kitlesi farklı olduğu için bileşenler birebir aynı şekilde değil, bilinçli küçük mimari farklarla uygulanıyor. Örneğin daha genç ve fırsat odaklı bir kitleye hitap eden sitelerde fiyat ve kampanya vurgusu daha baskın; aile odaklı bir kitleye hitap eden sitelerde ise filtre panelinde 'çocuk dostu tesis', 'aile odaları' gibi kriterler daha üst sıralarda, kart yerleşimi de daha fazla görsel alan ayıracak şekilde genişletiliyor.

Bu farklılaşma; kart bileşeninin bilgi yoğunluğu, filtre panelindeki kriter sıralaması, anasayfa hero alanının içerik ağırlığı (kampanya odaklı mı, destinasyon keşfi odaklı mı) ve renk/typography token'ları gibi bileşen bazlı ayarlarla yönetiliyor. Mimarinin ve akışın çekirdeği (arama → filtreleme → detay → sepet → ödeme) tüm sitelerde aynı kalıyor; değişen yalnızca bu çekirdeğin hedef kitleye göre nasıl 'giydirildiği'. Bu yaklaşım sayesinde grup, yeni bir pazara girerken sıfırdan tasarım süreci başlatmak yerine, mevcut sistemi birkaç günde o pazara özel hale getirebiliyor.

Anex Tour B2C projesi, tek bir ürünü tasarlamanın ötesinde, bir grup şirketinin tüm dijital yüzünü destekleyebilecek bir sistem kurma çalışıydı. Rezervasyon akışını sadeleştirmek kadar, bu akışın farklı pazarlara bileşen bazlı küçük değişikliklerle nasıl taşınabileceğini kurgulamak da sürecin en kritik parçasıydı. Sonuç olarak yeni bir destinasyon sitesi artık haftalar süren bir tasarım sürecine değil, mevcut sistemin token ve bileşen seviyesinde yeniden yapılandırılmasına ihtiyaç duyuyor.

Bu projeden çıkardığım temel ders, iyi kurgulanmış bir UX akışının marka kimliğinden bağımsız, taşınabilir bir değer taşıdığıydı. Bilgi mimarisi ve akış doğru kurulduğunda, görsel kimlik ve hedef kitleye özel ince ayarlar bu sağlam temel üzerine çok daha hızlı ve tutarlı şekilde inşa edilebiliyor.