UX/UI · Seyahat Uygulaması

Vera

Vera; yeni destinasyonlar keşfetmekten kişiselleştirilmiş rotalar oluşturmaya, seyahat masraflarını ve hazırlık listelerini yönetmeye kadar tüm seyahat sürecini tek bir yerde kolaylaştıran kullanıcı odaklı bir mobil uygulamadır.

Vera app hero visual

Seyahat Arkadaşınızla Tanışın

Vera, seyahat ihtiyaçlarınızı tek bir yerde toplayan bir mobil uygulamadır. Destinasyon aramaları, harita özellikleri, gezi planı oluşturma, seyahat arkadaşlarını yönetme, kontrol listesi hazırlama, harcama takibi ve seyahat fotoğrafları ve videolarınız için galeri sunar.

Neden “Vera”?

“Vera” ismi, güven ve doğruluğu ifade eden Latince kökenli bir kelimedir. Bu isim, uygulamanın kullanıcılarına her adımda rehberlik etme misyonunu ve seyahatlerini planlamaktan keşfe kadar keyifli bir deneyim sunmayı hedeflediğini mükemmel bir şekilde yansıtır.
Vera mobile app interface

Problem

Aile veya arkadaşlarla bir tatil planlamak, gezi programı oluşturma, bütçe yönetimi, turistik yerler bulma, konaklama rezervasyonu ve ulaşım düzenlemeleri yapmayı içerir. Bu süreç, karmaşık ve yorucu olabilir.

Çözüm

Gezi programı yönetimi, bütçe takibi, destinasyon keşfi, konaklama rezervasyonu ve ulaşım düzenlemelerini entegre eden bir uygulama ile tatillerinizi zahmetsizce planlayın. Vera, süreci kolaylaştırır ve aile ya da arkadaşlarınızla stressiz bir seyahat organize etmenizi sağlar.

Sektör
Seyahat Yönetimi
Hizmet
Mobil Uygulama
Tasarımcı
Hüdaverdi Ural

Kullanıcı Yolculuğu

Kullanıcı yolculuğu, bir gezginin uygulamayı keşfetmesinden seyahatini yönetmesine kadar olan adımları detaylandırır. Vera’da kullanıcı yolculuğu; destinasyon arama, gezi planlama, kontrol listesi hazırlama ve harcama takibi gibi kilit noktaları içerir. Bu süreç, sorunsuz ve keyifli bir seyahat deneyimi sağlamak için tasarlanmıştır.

Seyahat
Planlama

  • Gezi hakkında arkadaşlardan bilgi alma
  • Tarihleri ve uygunluk durumunu kontrol etme
  • Destinasyon hakkında araştırma yapma
  • Gezi planını hazırlama

Turistik Yerleri
Keşfetme

  • Turistik yerleri arama
  • Daha önceki ziyaretçilerden bilgi toplama
  • Kullanıcı yorumlarını okuma
  • Keşfedilecek en iyi yerleri seçme

Konaklama
Bulma

  • Yakınlardaki konaklamalar için arama yapma
  • Kullanıcı yorumlarını okuma
  • Farklı sitelerde fiyat karşılaştırması yapma
  • Konaklama rezervasyonunu tamamlama

Ulaşım
Arama

  • Ulaşım detaylarını arama
  • Kullanıcı geri bildirimlerini inceleme
  • Araç sahibine dair bilgi araştırma
  • Araç rezervasyonunu tamamlama

Gezi Planı
Hazırlama

  • Destinasyonu seçme
  • Turistik aktiviteleri arama
  • Turistik noktalar arasındaki mesafeyi kontrol etme
  • Zaman ve mesafeye göre aktiviteleri planlama
🙂Normal
☹️Üzgün
☹️Üzgün
☹️Üzgün
😐Nötr

Tasarım Sürecine Derinlemesine Bakış

Tasarım Odaklı Düşünme süreci, kullanıcı deneyimini oluştururken karşılaşılan sorunların nasıl ele alındığını ve çözüme ulaştırıldığını göstermek için oldukça önemlidir. Bu süreçte, kullanıcı ihtiyaçlarını anlamaya ve onlara uygun çözümler sunmaya odaklanan Kullanıcı Merkezli Tasarım yaklaşımını uyguladım. Bu yöntem, çözümlerin baştan sona kullanıcıyı dikkate alarak tasarlanmasını ve yüksek düzeyde kullanılabilir sonuçlar elde edilmesini sağlar.

01

Empati Kurma

  • Rekabet Analizi
  • Nicel Araştırma
  • Nitel Araştırma
02

Tanımlama

  • Persona Oluşturma
  • Empati Haritalama
03

Fikir Üretme

  • Kullanıcı Akışı
  • Bilgi Mimarisi
  • Kağıt Üzerinde Çizim
04

Tasarım

  • Orta Seviyede Wireframe’ler
  • Yüksek Seviyede Wireframe’ler
  • Prototipleme
05

Test Etme

  • Kullanılabilirlik Testlerinden Geri Bildirimler

Proje Zaman Çizelgesi

Empati Kur

Nicel Araştırma Nitel Araştırma

Tanımlama

Persona Empati Haritalama

Fikir Üretme

Kullanıcı Akışı Bilgi Mimarisi

Tasarım

Kağıt Üzerinde Çizim Orta Düzey Wireframe İleri Düzey Wireframe Prototip

Test Etme

Kullanıcı Testleri
Gün
51015202530354045505560657075

Kullanıcı Görüşmeleri ve İhtiyaçların Belirlenmesi

Kullanıcıların seyahatle ilgili ihtiyaçlarını ve beklentilerini anlamak amacıyla yapılan nicel araştırmalar kapsamında onlara belirlenen sorular yönlendirildi. Bu sorular, kullanıcıların yaşadığı sorunları ve bir uygulamadan beklentilerini daha iyi anlamak için tasarlandı. Elde edilen sonuç, sorunlu noktaların belirlenmesine yardımcı oldu ve uygulamanın kullanıcı beklentilerini ve gereksinimlerini daha iyi karşılayacak şekilde geliştirilmesine rehberlik etti.

Görüşmelerde Sorulan Sorular

  1. Ne sıklıkla seyahat ediyorsunuz?
  2. Seyahat planlama ve rezervasyon sırasında karşılaştığınız en büyük zorluklar nelerdir?
  3. Seyahat programınızı kağıt üzerinde mi yoksa mobil cihazınızda mı tutuyorsunuz?
  4. Turistik yerleri araştırma süreciniz nasıl ilerliyor?
  5. Bir seyahat uygulamasında en önemli bulduğunuz özellikler neler?
  6. Yerel aktiviteleri veya deneyimleri keşfetme ve rezervasyon yapma süreçleriniz nasıl gerçekleşiyor?
  7. Seyahat masraflarınızı takip etmek için hangi uygulamaları kullanıyorsunuz?
  8. Grup seyahatlerini planlama ve organize etme süreciniz nasıl işliyor?
  9. Bir seyahat programı hazırlamak sizin için ne kadar zaman alıyor?
  10. Tüm işlemler için tek bir uygulama mı yoksa her biri için özelleşmiş uygulamalar mı tercih ediyorsunuz? Örneğin bilet rezervasyonu, konaklama ve aktiviteler.

Kullanıcıların Seyahat Sırasında Karşılaştığı Sorunlar ve Öne Çıkan Tespitler

Güvenli Konaklama ve Ulaşım Bulma Zorluğu

Seyahat eden kullanıcılar, güvenilir konaklama seçeneklerini belirlemekte ve şehir içi ulaşım alternatiflerini bulmakta güçlük yaşıyor.

Zaman Alıcı Planlama Süreci

Rotalar ve aktiviteler hakkında bilgi aramak, kullanıcılar için planlama sürecini yorucu ve uzun hale getiriyor.

Çoklu Rezervasyon Uygulamaları Karmaşası

Farklı rezervasyon uygulamalarını kullanmak, en uygun fiyatı bulmayı zorlaştırıyor ve bazı tekliflerin geçersiz olması sorunu yaratıyor.

Güvenilir Seyahat Uygulaması Eksikliği

Kullanıcılar, seyahat planlama ve bilet rezervasyonu süreçlerini bir arada yönetebilecekleri güvenilir bir uygulama bulmakta zorlanıyor.

Nicel Araştırma Bulguları

Nicel araştırma kapsamında, seyahat eden kullanıcıların alışkanlıkları, tercihleri, karşılaştıkları sorunlar ve ihtiyaçları hakkında ölçülebilir veriler toplamak amacıyla Excel kullanılarak bir anket tasarlandı. Elde edilen veriler analiz edilerek Vera’nın özelliklerini ve kullanıcı deneyimini geliştirmeye yardımcı olacak ortak davranışlar, ihtiyaçlar ve eğilimler belirlendi.

Restoranlar, konaklama yerleri ve turistik noktalar için incelemeleri nasıl kontrol edersiniz?

1
  • Google Yorumları≈74%
  • Sosyal Medya≈16%
  • Ağızdan Ağıza≈10%

Seyahat harcamalarını yönetmek için hangi uygulamaları kullanıyorsunuz?

2
  • Google Pay≈70%
  • Splitwise≈9%
  • Diğer≈21%

Gezi planlama ve rezervasyon sırasında karşılaştığınız başlıca zorluklar nelerdir?

3
  • Güvenli Konaklama≈20%
  • En İyi Fiyatları Bulmak≈20%
  • Gezi Programı Hazırlama≈40%
  • Güvenilir Seyahat Rezervasyonları≈20%

Bir seyahat uygulamasında aradığınız en önemli özellikler nelerdir?

  • Haritalar ve Güzergâh Doğruluğu33%
  • İncelemeler ve Puanlar33%
  • Turistik Nokta Bilgileri22%
  • Bütçe Yönetimi11%

Turistik noktaları nasıl buluyorsunuz?

  • Google43%
  • Sosyal Medya25%
  • Ağızdan Ağıza19%
  • Web Siteleri13%

Pazar Rakiplerini Analiz Etme

Rakip analizi, rakiplerin güçlü ve zayıf yönlerini, stratejilerini ve pazar konumlarını değerlendirmeyi içerir. Bu süreç, doğrudan, dolaylı ve potansiyel rakiplerin yanı sıra onların özelliklerini incelemeyi kapsar. Diğer seyahat uygulamalarını analiz ederek Vera’yı geliştirecek kilit özellikler belirlendi. Böylece kullanıcı memnuniyetini artırmak ve düzenli kullanımı teşvik etmek hedeflendi.

Özellik Polarsteps Tripadvisor TripIt Wanderlog Visit A City Tripoto Lambus
Doğru güzergâh ××××××
Her kategori için arama özelliği ××××××
Konumları mesafeye göre sıralama ×××××
Yakındaki konum önerileri ×××
Web sitesi
Uygulama içi harita özelliği ××
Seyahat planına katılımcı davet etme ××
Çevrimdışı erişim ××

Personalar

Projemizde, farklı türde gezginleri temsil etmek için kullanıcı kişilikleri geliştirildi. Bu kişilikler, seyahat alışkanlıkları, hedefleri ve karşılaştıkları zorluklar gibi detayları içerir. Bu kişilikleri anlamak, Vera uygulamasını gerçek kullanıcıların ihtiyaçlarını ve beklentilerini daha iyi karşılayacak şekilde tasarlamaya yardımcı olur ve uygulamayı daha kullanışlı ve kullanıcı dostu hale getirir.

Asya
01

Asya

“Seyahat, sıradan günleri unutulmaz anılara dönüştürür.”
Cinsiyet
Kadın
Yaş
24 yaş
Meslek
Kimya Öğretmeni
Konum
İstanbul

Hakkında

Asya, İstanbul’da özel bir okulda kimya öğretmeni olarak çalışmaktadır. Yılda iki kez seyahat ederek hem rahatlamayı hem de sevdikleriyle bağ kurmayı tercih eder.

Zorluklar

  • Gezi planı oluşturmak için günler harcamaktan sıkılıyor.
  • Güvenli konaklama ve şehir içi ulaşımı organize etmekte zorlanıyor.
  • Organizasyon ve bilet rezervasyonu için güvenilir tek bir uygulama bulamıyor.

Hedefler

  • Entegre haritalar.
  • Yakındaki aktivite ve mekan önerileri.
  • Doğru puanlama, güvenlik önlemleri ve fiyat bilgileri.
Okan
02

Okan

“Uzağa seyahat et, hayatı dolu dolu yaşa ve her anın tadını çıkar.”
Cinsiyet
Erkek
Yaş
27 yaş
Meslek
UI/UX Designer
Konum
İstanbul

Hakkında

Okan, İstanbul’daki bir IT şirketinde UI/UX tasarımcısı olarak çalışmaktadır. Genellikle ayda iki kez ailesini ziyaret etmek ve arkadaşlarıyla seyahat etmek için gezi planları yapar.

Zorluklar

  • Seyahat planını kağıt üzerinde tutmak zahmetli ve hızlı değişiklikler yapmak zor.
  • En iyi fiyatı ve geçerli teklifleri bulmak için birden fazla rezervasyon uygulaması kullanıyor.

Hedefler

  • Gezi grubu, üye, kontrol listesi, masraf bölme ve medya paylaşımı için tek araç.
  • TalkBack, çeviri ve metinden sese erişilebilirliği.
  • Yalnız gezginler için yakındaki turistler, eğlence, acil yardım ve SOS.

Empati Haritası

Vera’da empati haritalama, kullanıcı etkileşimlerinden elde edilen içgörüleri özetlemeye yardımcı olur ve gezginlerin duygularını, hayal kırıklıklarını ve ihtiyaçlarını daha net anlamamızı sağlar. Bu süreç, kullanıcıların hissettiklerine, gördüklerine, duyduklarına ve deneyimlediklerine odaklanarak uygulamanın tasarımını yönlendirir ve onların zorluklarını daha iyi ele alır.

01

Kullanıcı Ne Söyler?

  • Herkes benzersiz seyahat fikirleri sunduğu için planlamaya arkadaşlarını ve ailesini dahil eder.
  • Henüz seyahat uygulamaları kullanmamış olsa da kullanıcı dostu ve güvenilir bir uygulama denemeye heveslidir.
  • Destinasyonlar eskiden ağızdan ağıza seçilirken artık YouTube vlogları ve Instagram fenomenlerine dayanır.
02

Kullanıcı Ne Düşünür?

  • Otel ve restoran yorumlarıyla turistik noktaların saatlerini içeren doğru güzergâh haritalarına ihtiyaç duyar.
  • Seçili konaklamalara yönelik entegre haritalar ve yönlendirmeler seyrek seyahat edenler için faydalıdır.
  • Grup, üye, kategori bazlı liste, masraf bölme, finans takibi ve medya paylaşımı için tek araç ister.
  • Puan, yorum ve fotoğraflarla yakın mekanlar; bisiklet, konaklama, restoran ve aktivite filtreleri ister.
03

Kullanıcı Ne Yapar?

  • Google Chrome ile konaklama, yorum, fiyat, güvenlik ve konfor kontrol eder.
  • Google Pay ve Splitwise ile masraf yönetir.
  • Bilet, konaklama ve aktiviteler için farklı uygulamalar kullanır.
  • Mobil ve kağıt üzerinde plan ve kontrol listesi oluşturur.
  • Web siteleri, Instagram ve bölgeyi ziyaret eden kişiler üzerinden turistik yer bulur.
04

Kullanıcı Ne Hisseder?

  • Güvenli konaklama ve ulaşımı organize etmekte zorlanır.
  • Planlama zaman aldığı için hayal kırıklığı yaşar.
  • Çok sayıda rezervasyon uygulaması, geçersiz teklifler ve fiyat karşılaştırması nedeniyle zorlanır.
  • Son dakika değişiklikleri yakın yerlerin kaçırılmasına ve acele ziyaretlere yol açar.

Çözüm Bulma Süreci

Fikir Üretme süreci, kullanıcı sorunlarını çözmek için çeşitli fikirler keşfetmeyi ve yaratıcı yollar geliştirmeyi içerir. Bu aşamada, empati haritalama bulgularını kullanıcı hikâyelerine dönüştürdüm ve çözümleri beyin fırtınası yaparak belirledim. Kullanıcı hikâyelerine dayanarak aşağıdaki gereksinimleri özetledim.

01

Seyahat planı oluşturma

Kullanıcı Hikâyesi

Kullanıcı, dengeli bir seyahat planı oluşturmak için birkaç gün harcıyor.

Özellik

Popüler seyahat destinasyonları için önceden hazırlanmış güzergâh şablonları, kullanıcıların bu şablonları tercihleri doğrultusunda hızlıca özelleştirmelerine olanak tanır.

Çözüm

  1. Mevcut konumu belirleme
  2. Varış noktası detaylarını girme
  3. Seyahat tarihi ve saat detaylarını belirleme
  4. Hazır güzergâh yükleme
  5. Güzergâhı özelleştirme
02

En uygun konaklama fiyatını bulma

Kullanıcı Hikâyesi

Çok sayıda rezervasyon uygulaması mevcutken en iyi fiyatı tek bir yerde bulmak zorlaşıyor ve sunulan tekliflerin çoğu geçerli olmuyor.

Özellik

Konaklama seçerken farklı ve bilinen rezervasyon sitelerindeki fiyatlar tek yerde listelenir. Kullanıcı, ilgili bağlantıya tıkladığında rezervasyonun yapılacağı siteye yönlendirilir.

Çözüm

  1. Varış noktasını girme
  2. Konaklama sekmesini seçme
  3. Otel, hostel ve diğer konaklama seçeneklerini listeleme
  4. Farklı web sitelerindeki fiyat farklarını gösterme
03

Şehir içi ulaşım seçeneklerini bulma

Kullanıcı Hikâyesi

Kullanıcı, şehir içerisindeki ulaşım seçeneklerini bulmakta zorlanıyor.

Özellik

Uygulama, kullanıcı yorumları, puanlar ve iletişim bilgileriyle birlikte kiralık araç seçeneklerini gösterir.

Çözüm

  1. Varış noktasını girme
  2. Kiralama sekmesini seçme
  3. Araç, bisiklet ve turist vanı seçeneklerini filtreleme
  4. İletişim detaylarıyla birlikte kiralama bilgilerini gösterme
04

Uygulama içinde rota oluşturma

Kullanıcı Hikâyesi

Bir gezgin olarak kullanıcı, konumlar arasındaki rotaları Google Haritalar’a bağımlı kalmadan bulmakta zorlanıyor. Bu durum, farklı uygulamalara bağımlılık yaratıyor ve seyahat deneyimini kesintiye uğratıyor.

Özellik

Uygulama, kullanıcıların bir varış noktası seçmesine ve seçilen noktaya nasıl ulaşacaklarını öğrenmesine olanak tanır. Ayrıca kullanıcılar haritayı indirerek internet bağlantısına ihtiyaç duymadan kullanabilir.

Çözüm

  1. Mevcut konumu belirleme
  2. Varış noktası detaylarını görüntüleme
  3. Telefonun konum özelliğini etkinleştirme
  4. Varış noktasına uygulama içi haritayla yönlendirme
  5. Çevrimdışı haritayı indirme

… ve daha fazla fikir!

Uygulama Özelliklerini Düzenleme: Bilgi Mimarisi

Bilgi mimarisi, uygulama içerisindeki içeriklerin ve işlevlerin kullanıcıların zihinsel modellerine uygun, anlaşılır ve tutarlı bir hiyerarşiyle düzenlenmesini sağlar. Vera’nın bilgi mimarisi; kullanıcıların yeni yerler keşfetme, beğendikleri noktaları kaydetme, harita üzerinde konum arama ve seyahat oluşturma gibi temel işlemlere kolayca ulaşabilmeleri üzerine kurgulandı. Seyahat oluşturulduktan sonra rota, yol arkadaşları, medya, masraflar ve hazırlık listesi gibi seyahat yönetimi araçları tek bir yapı altında toplandı.

01

Başlangıç ve Kimlik Doğrulama

Giriş Yap Kaydol
Vera
02

Ana Navigasyon

Ana Sayfa

  • Profil
  • Bildirimler
  • Etkinlikler
  • Ara
  • En İyi Şehirler

Keşfet

  • Konaklama
  • Restoranlar
  • Araç Kiralama
  • Turistik Noktalar

Listem

  • Beğenilenler

Harita

  • Konum Ara
03

Seyahat Yönetimi

Listem Mevcut Seyahatler Seyahat Oluştur

Rota

  • Otomatik Rota
  • Özel Rota

Yol Arkadaşları

  • Arkadaş Ekle
  • Arkadaş Sil

Fotoğraflar ve Videolar

  • Fotoğraf ve Video Görüntüle
  • Fotoğraf ve Video Ekle

Seyahat Masrafları

  • Harcama
  • Borç

Hazırlık Listesi

  • Öğe Ekle
  • Öğe Sil
Giriş Yap
Kaydol
Ana Sayfa
Keşfet
Listem
Harita
Profil
Bildirimler
Etkinlikler
Ara
En İyi Şehirler
Konaklama
Restoranlar
Araç Kiralama
Turistik Noktalar
Beğenilenler
Konum Ara
Listem
Mevcut Seyahatler
Seyahat Oluştur
Rota
Yol Arkadaşları
Fotoğraflar ve Videolar
Seyahat Masrafları
Hazırlık Listesi
Otomatik Rota
Özel Rota
Arkadaş Ekle
Arkadaş Sil
Fotoğraf ve Video Görüntüle
Fotoğraf ve Video Ekle
Harcama
Borç
Öğe Ekle
Öğe Sil

Kullanıcı Akışı

Kullanıcı akışı, kullanıcıların uygulamada nasıl gezindiğini ve davrandığını anlamak için tasarlanmıştır. Vera uygulamasında kullanıcı akışı; yeni destinasyonlar keşfetmekten seyahat planları oluşturmaya, seyahat harcamalarını yönetmekten temel bilgilere erişime kadar olan yolculuğu detaylandırır. Bu süreçte her adımın sezgisel ve sorunsuz olması sağlanır.

Vera home screen
Açılış Ekranı
Başlangıç Ekranları
Başlayın
Giriş Ekranı
Kayıt Ekranı
Yeni Hesap Oluştur
Kayıt Ol
Kullanıcı Adı Girin
Şifre Girin
Giriş Yap
Ana Sayfa
Etkinlikler
Konum
Keşfedilecek En İyi Şehirler
Profil
Bildirimler
Listem
Favorilerde Ara
Favorileri Görüntüle
Keşfet
Konaklama
Restoranlar
Turistik Noktalar
Araç Kiralama
Harita
Konum Ara
Rota Oluştur
Planla
Mevcut Planlar
Plan Ayrıntıları
Planlamaya Başla
Seyahat Başlığı
Kişi Sayısı
Planla
Yol Arkadaşları
Rotanı Planla
Gezi Medyası
Gider
Hazırlık Listesi
Arkadaşları Görüntüle
Yeni Kişi Ekle
Kişileri Sil
Listeyi Görüntüle
Öğe Ekle
Fotoğrafları ve Videoları Görüntüle
Fotoğraf ve Video Ekle
Otomatik Plan
Özel Plan
Varış Noktası
Seyahat Tarihleri
Varış Noktası
Seyahat Tarihleri
Tercih
Günlük Planlar
Planla
Otomatik Güzergahla Plan
Oluşturulan Güzergahla Plan
Seyahat Planı Ekranı
Seyahat Planı Liste Görünümü
Seyahat Planı Harita Görünümü
Seyahat Planını PDF İndir
Konum Ekle
Seyahat Planı Düzenle
Seyahat İsmi Belirle
Hedef Seçin
Tarih - Saat
Hedefi Düzenle
Hedefi Sil
Seyahat İsmi Belirle
Hedefi Düzenle
Tarih - Saat
Harcanan
Borçlar
Grubun Toplam Gider Detayı
Bireysel Gider Detayları
Yeni Gider Ekle
Harcayan Kişiyi Seç
Harcama Tarihi
Gider Paylaşımı İçin Kişileri Seç
Borç Ekle
Bireysel Borçları Listele
Borç Detaylarını Görüntüle
Ödeme Bilgisi

Kullanıcı Akışı Sembolleri

  • Ekranın ana işlevini veya temel yapısını temsil eder.
  • Kullanıcının doldurması veya etkileşimde bulunması gereken giriş alanlarını ifade eder.
  • Bir işlemi veya gerçekleştirilen bir eylemi gösterir.

Konsept Tasarım

Orta seviye wireframes, kağıt eskizlerinden sonraki adımdır. Son tasarım öğeleri olmadan yapıya ve kullanıcı akışına odaklanarak düzene daha fazla ayrıntı eklerler. Yeni fikirlere dayanarak, düşük sadakat sürümlerinden farklılaştıran iyileştirmeler yapıldı.

Mid-fidelity wireframes for the Vera app

Renkler

Vera’nın renk paleti; güven, huzur ve keşif duygularını destekleyen dengeli bir görsel dil oluşturmak amacıyla tasarlandı. Ana renk olarak kullanılan mavi, seyahat deneyiminde güvenilirliği ve sakinliği temsil ederken; yeşil, dengeli ve destekleyici bir etki yaratır. Mercan kırmızısı, önemli aksiyonları ve dikkat gerektiren noktaları öne çıkarmak için kullanılır. Açık ve nötr tonlar ise içeriğin rahat okunmasını sağlayarak sade, ferah ve kullanıcı odaklı bir arayüz oluşturur.

  • Parlak
  • Temiz
  • Sakinleştirici
  • Canlı

Birincil Renkler

Birincil renkler; uygulamanın marka kimliğini oluşturan metinlerde, aktif butonlarda, bağlantılarda, önemli durumlarda ve vurgu alanlarında kullanılır. Bu renkler, arayüz genelinde tutarlı ve kolay tanınabilir bir görsel dil oluşturur.

  • #1C1C1C Midnight Shadow
  • #00AB67 Emerald Touch
  • #5D9CEC Skyline Blue
  • #FF595D Coral Red

İkincil Renkler

İkincil renkler; yardımcı metinlerde, ikonlarda, arka planlarda, ayırıcılarda, yer tutucularda ve pasif durumlarda kullanılır. Bu nötr tonlar, birincil renklerin öne çıkmasını sağlarken arayüzde görsel bir denge oluşturur.

  • #6E6E6E Stone Grey
  • #929292 Nickel Grey
  • #CBCBCB Cloud Mist
  • #F6FBFF Arctic White

Font Seçimi

Uygulamanın yazı tipleri, kullanıcı deneyimini artırmak ve okunabilirliği en üst düzeye çıkarmak için özenle seçildi. Poppins yazı tipi ailesi, modern ve temiz tasarımıyla ön plana çıkarak, uygulamanın görsel olarak çekici ve sezgisel bir arayüz sunmasını destekler.

Poppins font ailesi

Light / 14px, 24px

ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 ! @ # $ ^ * ( ) _ + - = : ; " ' < > , . ? /

Regular / 14px, 16px

ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 ! @ # $ ^ * ( ) _ + - = : ; " ' < > , . ? /

Medium / 12px, 14px, 16px, 18px, 24px, 32px

ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 ! @ # $ ^ * ( ) _ + - = : ; " ' < > , . ? /

Bold / 14px, 16px, 18px, 24px

ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 ! @ # $ ^ * ( ) _ + - = : ; " ' < > , . ? /

Grid Yapısı

Vera uygulamasında kullanılan 4 sütunlu ve 8’li grid sistemleri, temiz, düzenli bir düzen ve tutarlı boşluklar sağlayarak uygulamanın genel kullanıcı deneyimini geliştirir.

Vera layout grid: 390px screen width, 4 columns, 20px gutters, 16px margins and an 8pt spacing grid

UI Bileşenlerine Genel Bakış

Bileşenler bölümü, uygulama genelinde kullanılan temel UI öğelerini kapsar; bunlar arasında düğmeler, kartlar, metin alanları ve gezinme çubukları bulunur. Bu öğelerin uygulamanın her yerinde aynı şekilde görünmesini ve çalışmasını sağlayarak tasarımın tutarlı ve kullanımı kolay olmasını garanti eder.

Vera UI component library: navigation tabs, filters, inputs, buttons, the bottom navigation bar study and illustrations

İkonografi ile Tasarımı Geliştirme

İkonlar, uygulama içinde işlemleri, özellikleri veya içeriği görsel olarak temsil ederek kullanıcı deneyimini geliştirmede önemli bir rol oynar. Netlik sağlar ve genel estetiği iyileştirerek uygulamayı daha sezgisel ve kullanıcı dostu hale getirir.

Vera icon set: navigation, map, media, action and status icons

Benzersiz Bir Uygulama Logosu Oluşturma

Logo tasarımı, bir marka veya projeyi temsil eden benzersiz ve tanınabilir bir görsel sembol oluşturmayı içerir. Vera’nın uygulama logosu, seyahat odaklı özelliklerini yansıtmak için bir konum simgesini uçak simgesiyle birleştirir.

The Vera app icon on an iPhone home screen, shown next to the logo mark that combines a location pin with a plane

Kullanıcı Arayüzü Ekranları

UI ekranları, renkler, tipografi, simgeler ve etkileşimler gibi ayrıntılı görsel öğelere odaklanarak son tasarım aşamasını temsil eder. Bitmiş ürüne çok benzerler ve tasarımın kullanıcı dostu ve geliştirmeye hazır olmasını sağlarlar.

Açılış Ekranları

Uygulama başlatıldığında açılış ekranı projenin logosunu ve başlığını göstererek kullanıcılara sıcak bir karşılama sunar ve uygulamanın kimliğini tanıtır. Tonu ayarlamaya ve uygulamanın bir sonraki bölümüne sorunsuz bir geçiş sağlamaya yardımcı olur.

Vera splash screens showing the app icon and the Vera wordmark

Başlangıç Ekranları

Yerleştirme ekranları, uygulamanın temel özelliklerini tanıtır ve kullanıcıları uygulamada nasıl gezinecekleri ve etkili bir şekilde nasıl kullanacakları konusunda yönlendirir. Bu ekranlar, kullanıcıların uygulamaya girmeden önce uygulamanın amacı ve işlevleriyle tanışmalarına yardımcı olur.

Vera onboarding screens introducing destination discovery, trip planning and sharing

Giriş ve Kayıt Ekranları

Giriş ve kayıt ekranları, kullanıcılara mevcut hesaplarına giriş yapmaları veya yeni bir hesap oluşturmaları için basit bir arayüz sağlar. Bu ekranlar, uygulamanın özelliklerine kolay ve güvenli erişim sağlar.

Vera log in and sign up screens

Ana Ekran

Ana ekran; yeni varış noktalarını keşfetme, kayıtlı noktaları görüntüleme ve haritalara erişme gibi temel özelliklere hızlı erişim sağlayan merkezi bir yapı sunar. Kullanıcılar ayrıca konumları arayabilir, keşfedilecek en iyi şehirleri görüntüleyebilir, etkinlikleri kontrol edebilir ve profillerini yönetebilir; tüm bunları akıcı ve sezgisel bir arayüzden gerçekleştirebilir.

Vera home screen with search, events and top cities to explore

Keşfet Ekranı

Keşfet ekranı konaklama bulma, popüler restoranları keşfetme, turistik yerleri keşfetme ve kiralama acentelerini bulma gibi seçenekleri tek bir yerde sunuyor.

Vera explore screen listing accommodation, restaurants, tourist attractions and vehicle rental

Listem Ekranı

Favorilenen Noktalar ekranı, kullanıcıların seyahat planlamaları sırasında kolayca erişebilmeleri için favori konaklama yerlerini, restoranları, turistik noktaları ve kiralama hizmetlerini yer imlerine eklemelerine ve saklamalarına olanak tanır.

Vera saved places screen with bookmarked accommodation, restaurants, attractions and rentals

Harita Ekranı

Harita ekranı kullanıcıların varış noktalarını aramasına ve restoranlar, konaklama yerleri ve turistik yerler gibi filtreler uygulamasına olanak tanır. Bir filtre seçildiğinde, harita seçilen kategoriye göre yakındaki seçenekleri görüntüler ve çevrenin kişiselleştirilmiş bir görünümünü sağlar.

Vera map screen with category filters and nearby restaurant results

Planla Ekranı

Planla ekranı, mevcut tüm gezilerin listesini görüntüler ve ayrıca yeni bir gezi planlama seçeneği de sunar.

Yeni Plan Ekranı

Kullanıcıların seyahati oluşturmaya başlamadan önce seyahat başlığını girmeleri ve grup boyutunu belirtmeleri gerekmektedir.

Oluşturulan Gezi Ekranı

Gezi oluşturulduktan sonra kullanıcılar bir güzergah oluşturabilir, arkadaşlarını davet edebilir, kontrol listeleri oluşturabilir, seyahat masraflarını takip edebilir ve grup üyeleri tarafından yüklenen fotoğraf ve videoları görüntüleyebilir.

Vera plan screen, the new trip dialog and the created trip screen

Rota Planı

Rota planı seçeneği belirlendiğinde, kullanıcılardan özel bir rota planı oluşturmaları veya tercihlerine göre otomatik olarak bir rota planı oluşturmaları isteniyor.

Özel Rota

Kullanıcıların seyahat hedeflerini ve tarihlerini girmeleri gerekiyor, ardından daha sonraki planlamalar için seyahat planı ekranı oluşturuluyor.

Otomatik Rota

Kullanıcılar varış noktasını, seyahat tarihlerini, günlük konum sayısını ve seyahat tercihlerini girer. Sağlanan tercihlere göre kişiselleştirilmiş bir güzergah oluşturulur.

Vera route planning flow: choosing between an automatic and a custom route, entering dates and building the itinerary on the map

Otomatik Rota

Kullanıcılar varış noktasını, seyahat tarihlerini, günlük konum sayısını ve seyahat tercihlerini girer. Sağlanan tercihlere göre kişiselleştirilmiş bir güzergah oluşturulur.

Vera automatic route setup with travel preferences, and the generated itinerary on the map

Hedef Ekle

Kullanıcılar, başlık, lokasyon, seyahat tarihi ve saatini belirterek yeni destinasyonlar ekleyebiliyor.

Seyahat Planı Listesi Görünümü

Liste görünümünde, güzergah zaman, mesafe ve süre ile sunulur. Her konum bir konum işaretçisi içerir ve tamamlanan konumlar yeşil renkle vurgulanır.

Planı Düzenle

Kullanıcılar mevcut güzergahı değiştirebilir veya belirli yerleri kaldırabilir.

Vera itinerary list view, the add-a-place dialog, the editable list and the edit dialog

Gezi Anıları

Kullanıcılar seyahat arkadaşlarının paylaştığı fotoğraf ve videoları görüntüleyebilir ve yönetebilir.

Seyahat Arkadaşları

Kullanıcılar seyahatlerine arkadaş ekleyebilir veya mevcut üyeleri kaldırabilir.

Gider Takibi · Harcama Ekranı

Kullanıcılar harcamaları ekleyebilir ve grup harcamalarını takip edebilir, kimin ödediğini, ne için olduğunu ve tarihi gösterebilir. Ayrıca her kişinin bireysel harcamalarını takip etmenize olanak tanır.

Vera trip photo gallery, the trip menu and the travel companions screen

Yeni Gider Ekle

Kullanıcılar harcamanın ayrıntılarını harcayan kişiyi, tarihi, tutarı ve yiyecek, seyahat vb. gibi kategorileri seçerek girebilirler. Ayrıca maliyeti bölüştürmek için dahil olan kişileri seçebilir ve gerekirse harcamayı borçlara ekleyebilirler.

Gider Takibi · Borçlar Ekranı

Borçlar ekranı, ödenmesi gereken tutar ve kime ödenmesi gerektiği belirtilir. Ödeme işlemleri en az kombinasyonla olacak şekilde uygulama bunu ayarlar.

Vera travel expenses screen, the debts and settlements view and the add-expense dialog

Konaklama Ekranları

Seyahat edenler yakınlardaki konaklama yerlerine göz atabilir veya belirli yerleri arayabilir. Genel bakışı görüntüleyebilir, yorumları okuyabilir ve yakınlardaki ilgi çekici yerleri keşfedebilirler.

Fiyat ve Fırsatlar

Seyahat edenler bir tarih aralığı seçebilir ve kişi sayısını belirtebilirler.

Vera accommodation list, hotel overview, reviews, availability and price comparison screens

Restoran Ekranları

Restoran ekranında, gezginler genel bir bakış elde edebilir, yemek menüsünü inceleyebilir, yorumları okuyabilir ve yakındaki yerleri keşfedebilir.

Vera restaurant list, restaurant overview, reviews, menu and nearby places screens

Araç Kiralama Ekranları

Kiralama acenteleri ekranında, gezginler genel bakışı okuyabilir, mevcut araçlara göz atabilir, müsaitliklerini kontrol edebilir ve yakındaki yerleri keşfedebilir.

Vera vehicle rental list, agency overview, reviews, available cars and nearby places screens

Turistik Yerler Ekranları

Turistik cazibe merkezleri ekranlarında gezginler, cazibe merkezleri hakkında önemli ayrıntıları görüntüleyebilir, yorumları inceleyebilir ve yakındaki yerleri görebilir.

Vera tourist attraction list, attraction overview, reviews and nearby places screens

Testler ve Geri Bildirimler

Kullanılabilirlik testi, bir ürünle etkileşimde bulunan gerçek kullanıcıları gözlemleyerek herhangi bir sorunu tespit etmek, nasıl kolaylıkla kullanıldığını anlamak ve genel tasarımını ve işlevselliğini geliştirmek amacıyla yapılır.

Atanan Görevler

  • Ana ekrandan başlayarak Keşfet ekranına gidin ve konaklama yerlerini, restoranları, kiralık araçları ve turistik yerleri inceleyin.
  • Bir gezi oluşturun, güzergahı planlayın, seyahat masraflarını takip edin, fotoğraf ve videoları görüntüleyin ve seyahat arkadaşlarınızı kontrol edin.

Olumlu Geri Bildirimler

  • Navigasyon sorunsuz ve tasarım temiz.
  • Seyahat masraflarını ekleme ve yönetme seçeneği, grup gezileri için harika bir özellik.
  • Konaklama detayları ekranındaki fiyat teklifleri ve karşılaştırma özelliği oldukça düşünceli.
  • Güzergah oluşturma aracı sezgisel ve seyahat planlarını etkili bir şekilde düzenlemeye yardımcı oluyor.

Geliştirme Önerileri

  • Uluslararası geziler için bir döviz çevirici eklemeyi düşünün.
  • Güzergah bölümüne bildirimler veya hatırlatıcılar dahil edin.
  • Gece kullanımı sırasında göz yorgunluğunu azaltmak için bir karanlık mod uygulayın.