Mobil web deneyimi: gerçek görevlerle kullanılabilirlik kontrolü

Mobil siteni yalnız ekran boyutuyla değil; gezinme, form doldurma ve bilgi bulma görevleriyle değerlendirmek için rehber.

Bir sitenin telefona sığması, telefonda kullanılabildiğini göstermeye yetmez. Menü açılıyor olabilir ama ziyaretçi hangi seçeneği izleyeceğini anlayamayabilir. Form alanları görünür olabilir ama klavye açıldığında gönder düğmesine ulaşmak zorlaşabilir. Mobil deneyimi kontrol etmek için ekranın fotoğrafına bakmanın yanında gerçek işleri tamamlamak gerekir. İncelemenin konusu yalnız görünüm değil; bilgi bulma, karar verme ve işlem yapma akışıdır.

Bu rehberde bir hizmet sitesini, ziyaretçinin gerçekleştireceği görevlerle değerlendiriyoruz. Amaç her projeye aynı puanı veren soyut bir liste oluşturmak değildir. Hangi sorunun hangi kişiyi, hangi aşamada etkilediğini kaydetmek ve düzeltmenin işe yarayıp yaramadığını kontrol etmek için uygulanabilir bir yöntem kurmaktır. Telefonu elinize alıp siteyi aşağı kaydırmak başlangıç olabilir; asıl bulgular belirli bir ihtiyaçla hareket ettiğinizde ortaya çıkar.

Testten önce dört görev seçin

Hizmet alanını belirleme, kapsamı inceleme, örnek çalışmaya ulaşma ve iletişim talebi gönderme gibi görevler seçilebilir. Görevleri sayfadaki düğmelerin adlarıyla yazmayın. “Menüden hizmetlere tıkla” derseniz yolu tarif etmiş olursunuz. Bunun yerine “Şirketiniz için sosyal medya desteği arıyorsunuz; hangi işlerin hizmete dahil olduğunu bulun” ifadesini kullanın. Katılımcının nereden başlayacağı gözlemin bir parçasıdır.

Görevleri mevcut içerikle tamamlanabilir tutun. Sitede fiyat açıklaması yokken “Fiyatı bulun” görevi vermek, kullanılabilirlikten önce içerik eksikliğini gösterir. Bu da değerlidir; ancak gözlemi doğru sınıflandırmak gerekir. Eksik bilgi, anlaşılmayan etiket ve çalışmayan etkileşim farklı sorunlardır. Aynı çözümü gerektirmezler. Önceden beklenen yanıtı yazmak, sonucu sonradan keyfî değerlendirmeyi önler.

İlk görev: hangi hizmetin uygun olduğunu bulmak

Siteyi ilk kez gören birinden ihtiyacına uygun hizmeti seçmesini isteyin. Ana sayfadaki başlık, hizmet isimleri ve kısa açıklamalar bu görevi destekliyor mu? Kartlarda yalnız yaratıcı sloganlar varsa ziyaretçi aralarındaki farkı anlayamayabilir. Özellikle dar ekranda art arda görünen benzer kartlar, kişinin önceki seçeneği unutarak ilerlemesine neden olabilir. Hizmetin ne olduğunu söyleyen açıklama bu yüzden önemlidir.

Sayfaya doğrudan bir bağlantıyla giriş senaryosunu da deneyin. Ziyaretçinin her zaman ana sayfadan geleceğini varsaymayın. Hizmet detayında bulunduğu yerin anlaşılması, diğer ilgili hizmetlere geçilebilmesi ve ana gezinmeye ulaşılabilmesi gerekir. Üstte büyük bir görsel varsa ilk anlamlı açıklamanın çok aşağıda kalıp kalmadığını kontrol edin. Bu, görseli kaldırmak için otomatik bir gerekçe değildir; içerik sırasını sorgulamak için bir bulgudur.

Menüyü açmak kadar kapatmak da önemli

Mobil menüyü açın, alt başlıkları inceleyin, bir sayfaya gidin ve geri dönün. Menü açıkken arka sayfanın kayıp kaymadığını, kapatma kontrolünün görünür olup olmadığını ve seçili bölümün anlaşılmasını değerlendirin. Katılımcı menü dışında bir yere dokunduğunda ne olacağını tahmin edebiliyor mu? Menünün davranışı site boyunca değişiyorsa her sayfa türünde yeniden öğrenme ihtiyacı doğabilir.

Uzun menülerde son seçeneklere ulaşmayı deneyin. Ekranın altındaki iletişim bağlantısı görünürken telefonun kendi arayüzü tarafından örtülüyor olabilir. Alt grupların açılma biçimi de önemlidir. Hem başlık bağlantısı hem alt menü açma işlemi aynı küçük bölgeye konmuşsa yanlış sayfaya gitmek kolaylaşabilir. Gözlem notunda “menü kötü” yerine hangi seçeneğin hangi durumda karıştığını yazın.

Dokunma davranışını gerçek cihazda gözlemleyin

Masaüstünde fareyle kolay seçilen bir bağlantı, parmakla kullanıldığında farklı hissedebilir. Yan yana duran küçük kontrolleri, kartın tıklanabilir alanını ve sabit düğmelerin diğer içeriklerle ilişkisini inceleyin. Teknik uygunluk değerlendirmesi ayrı uzmanlık gerektirebilir; burada önce gerçek görevde yanlış dokunmanın oluşup oluşmadığını gözlemliyoruz. Sayısal bir eşik ezberlemek, sorunlu etkileşimin nedenini anlamanın yerine geçmez.

Özellikle telefon numarası, dosya indirme ve dış bağlantı gibi işlemleri kontrol edin. Düğmenin ne yapacağı metninden anlaşılmalı. Ziyaretçi bir belgeyi açacağını sanırken telefon aramasının başlaması, kontrolün etiketini gözden geçirmeyi gerektirir. İndirme işlemi yeni bir sayfa açıyorsa dönüş yolunu da değerlendirin. Görev, bağlantıya dokunulduğu anda bitmez; kişinin işine devam edebilmesi gerekir.

İkinci görev: uzun içerikte gerekli ayrıntıyı bulmak

Bir hizmet sayfasında kapsam dışı işleri veya teslim edilen materyalleri bulmasını isteyin. Başlıklar kişinin tarama yapmasına yardımcı oluyor mu? Uzun metin tek blok halindeyse gerekli bilgi içeride bulunsa da keşfedilmesi zorlaşabilir. Öte yandan her cümleyi ayrı kart yapmak da konunun bütünlüğünü dağıtabilir. Düzenin başarısını bölüm sayısından değil, görev sırasında bilgiye ulaşma biçiminden değerlendirin.

Açılır içerikler kullanılıyorsa başlıkların yeterince açıklayıcı olduğunu kontrol edin. Bütün soruların tek başına “Detaylar” diye adlandırılması hangi bölümü açmak gerektiğini belirsizleştirir. Bir bölüm açıldığında başka bölüme sıçrama oluyorsa veya metin sabit kontrollerin altında kalıyorsa bunu kayıt altına alın. Katılımcının aradığı bilgiyi bulduktan sonra doğru yorumlayıp yorumlamadığı da önemlidir; yalnız ekranda görünmesi yeterli değildir.

Yatay taşmayı sadece ana sayfada aramayın

Uzun bir eposta adresi, teknik tablo, gömülü içerik veya büyük bir görsel bazı sayfalarda yatay kaymaya yol açabilir. Bu nedenle farklı içerik örnekleri seçin. İki sütunlu karşılaştırma, uzun başlık ve belge listesi bulunan sayfalar özellikle yararlıdır. Sayfanın tamamı yana kayıyorsa hangi öğenin bu davranışı oluşturduğunu geliştirme ekibi belirlemelidir. Test notunda ilgili içerik ve ekran durumunu kaydedin.

Tablonun kendi alanında kaydırılması ile bütün sayfanın taşması aynı şey değildir. Büyük veri tablosunda yatay hareket gerekebilir; ancak ziyaretçinin tablonun devamını anlayabilmesi gerekir. Başlıkla değer arasındaki bağ kopuyorsa verinin farklı sunumu düşünülmelidir. Mobil kontrolün amacı bütün içerikleri zorla daraltmak değil, anlamlı biçimde okunabilir ve kullanılabilir tutmaktır.

Üçüncü görev: formu klavye açıkken tamamlamak

Form alanlarına sırayla girin. Alan isimlerinin yazarken görünür kalıp kalmadığına, açıklamaların ilgili alana yakınlığına ve klavyenin işlemi nasıl etkilediğine bakın. Eposta alanında kullanıcıdan ne istendiği anlaşılmalı, seçenek gruplarının başlıkları net olmalıdır. W3C’nin form etiketleri rehberi, kontrollerin amaçlarını açıklayan etiketler ve bunların kontrollerle ilişkisi için temel bir başvuru sunar.

Uzun bir formda ekranı kaydırın, bir önceki alana dönün ve seçim değiştirin. Telefon numarası gibi alanlara kullanılan biçimin dışında değer girildiğinde ne olduğuna bakın. İşletme yalnız belirli bir biçimi kabul ediyorsa gerekli açıklama kullanıcı hata yaptıktan sonra değil, uygun yerde önceden bulunmalıdır. Formu doldururken kaybolan değerler varsa hangi adımda kaybolduğunu not edin.

Hata ve başarı durumlarını ayrı görev sayın

Bir zorunlu alanı boş bırakıp gönderin. Hata mesajı yalnız renk değişimiyle mi belirtiliyor, yoksa neyin düzeltilmesi gerektiği söyleniyor mu? Genel bir “Hata oluştu” ifadesi, ziyaretçinin işlem yapmasına yardımcı olmayabilir. W3C, form sonucuna ilişkin açık geri bildirim verilmesini ve hataların anlaşılır düzeltme yönergeleriyle açıklanmasını önerir. Uygulama ayrıntıları için form bildirimleri rehberine bakılabilir.

Ardından geçerli test bilgileriyle gönderimi tamamlayın. Başarı mesajı görünür mü, talebin alındığı anlaşılıyor mu, sonraki adım açıklanıyor mu? Sayfa yeniden yüklenip aynı boş formu gösteriyorsa kullanıcı işlemin başarısını sorgulayabilir. Aynı talebi tekrar göndermeyi engelleyen veya açıklayan davranış da incelenmelidir. Gerçek kişilere test mesajı gitmemesi için testi işletmeyle planlayın.

Dördüncü görev: kesintiden sonra devam etmek

Gerçek kullanım sürekli ve kusursuz değildir. Ziyaretçi başka bir uygulamaya geçebilir, gelen çağrıyı yanıtlayabilir veya ekrandaki başka bir bağlantıyı açabilir. Bir formu kısmen doldurup kısa süre başka ekrana geçin; sonra geri dönün. Girilen değerler, açık bölümler ve kaydırma konumu ne durumda? Her veriyi süresiz saklamak gerekmez; fakat beklenmedik kayıp varsa bunun kullanıcıya etkisini bilin.

Tarayıcının geri düğmesini de deneyin. Özellikle filtreli listeden detay sayfasına geçip dönerken kişinin kaldığı yeri bulması önemlidir. Hizmet sitesinde bu durum daha basit olabilir; yine de blog listesi veya proje arşivi gibi alanlarda tekrar eden bir ihtiyaçtır. Testin kapsamını seçerken sitede gerçekten kullanılan etkileşimleri önceliklendirin. Bulunmayan özellikler için varsayımsal sorun listesi hazırlamayın.

Bulgu kaydını çözümü tarif edecek kadar somutlaştırın

Bir bulgu şu şekilde yazılabilir: “İletişim sayfasında telefon klavyesi açıkken sabit alt çubuk gönder düğmesini örtüyor. Katılımcı formu tamamladığını düşünmesine rağmen gönderim yapamıyor. Klavye kapatılınca düğme görülüyor.” Bu kayıt, hangi sayfada, hangi durumda ve hangi etkiyle sorun yaşandığını anlatır. Ekran görüntüsü veya kısa kayıt eklenebilir; ancak gerçek kişinin form bilgileri görünmemelidir.

Önceliği de gözlenen etkiye göre belirleyin. Temel işlemi tamamen engelleyen sorun, daha az önemli bir açıklamadaki hizalama hatasından önce ele alınabilir. Etkilenen sayfa türünü ve sorumlu ekibi yazın. Tasarım sorunu diye görünen durum içerikten, içerik sorunu diye görünen durum etkileşimden kaynaklanabilir. Çözüm konusunda erken hüküm vermek yerine, gözlem ve öneriyi ayrı alanlarda tutun.

İncelemeyi kiminle yapmalısınız?

Siteyi yapan kişi bütün yolları zaten bildiği için bazı belirsizlikleri fark etmeyebilir. İlk kontrolü ekip içinde yaptıktan sonra siteye aşina olmayan kişilerle görevleri yürütmek yararlıdır. Katılımcının hedef kitlenize yakın olması gözlemi anlamlı hale getirir. Teknik satın alma sorumlularına yönelik sayfayı yalnız genel tasarım beğenisi üzerinden inceleyen bir grupla değerlendirmek, gerekli bilgilerin bulunup bulunmadığını yeterince göstermez. Kullanılan ifadeleri anlayan, fakat sitenin yapısını ezbere bilmeyen biri iyi bir başlangıç olabilir.

Katılımcının sessizce zorlanmasını hemen yardım ederek sonlandırmayın. Önce ne düşündüğünü sorun. “Bu başlık bana fiyat bilgisi gibi geldi” veya “Formun gönderildiğini anlayamadım” gibi açıklamalar, davranışın arkasındaki beklentiyi gösterir. Yardım gerekirse verdiğiniz ipucunu not edin. İpucuyla tamamlanan bir görevi yardımsız tamamlanmış gibi kaydetmek, tasarımın anlaşılabilirliğini olduğundan iyi gösterebilir. Testi kişiyi değerlendiren bir sınav gibi sunmamak da önemlidir.

Örnek bir kontrol oturumunu planlayın

Başlangıçta katılımcıya hayali bir işletme ve ihtiyaç verin. Örneğin büyüyen bir danışmanlık şirketi için web sitesi desteği araştırıyor olsun. Önce uygun hizmeti bulsun, sonra hangi teslimleri alacağını anlatsın, ardından soru sormak için iletişim yolunu seçsin. Son aşamada test formunu doldursun. Her adımda sayfa isimlerini söylemek yerine ihtiyacı hatırlatın. Böylece aynı oturumda hem gezinme hem içerik hem form davranışı hakkında birbirine bağlı gözlemler elde edebilirsiniz.

Oturum sonunda katılımcıdan sayfanın anlattığını kendi kelimeleriyle özetlemesini isteyin. Hizmetin kapsamını yanlış anlamışsa hangi cümlenin bu yoruma yol açtığını araştırın. Bulgunun kaynağı her zaman küçük ekran olmayabilir; aynı metin masaüstünde de belirsizdir. Mobil kontrol sırasında çıkan içerik sorunlarını ayrı kaydetmek, çözüm sorumluluğunu doğru kişiye yönlendirir. Rapor, yalnız ekran görüntülerinden değil görev, gözlem, etki ve yeniden kontrol notlarından oluştuğunda ekip için kullanılabilir hale gelir.

Düzeltmeyi aynı görevle yeniden kontrol edin

Bir değişiklik yapıldıktan sonra yalnız sorunlu bölgeye bakmak yerine görevi baştan yürütün. Gönder düğmesi görünür olmuş ama başarı mesajı kaybolmuş olabilir. Yeniden kontrolün amacı yeni hata aramak kadar önceki engelin gerçekten kalktığını doğrulamaktır. Aynı cihaz ve benzer koşullarda tekrar etmek karşılaştırmayı kolaylaştırır; farklı cihazlarda kontrol ise sorunun kapsamını anlamaya yardımcı olur.

Bu inceleme erişilebilirlik değerlendirmesinin veya bütün teknik testlerin yerine geçmez. Ekibin gerçek kullanıcı görevlerini erken görmesini sağlayan bir çalışma biçimidir. Sayfa sırası gibi daha temel konular karışıyorsa sayfa mimarisi rehberine dönmek gerekebilir. Digitalismo’nun web tasarım ve geliştirme yaklaşımında mobil kontrol, görünümü onaylama anıyla sınırlanmaz; ziyaretçinin işini tamamlayıp tamamlayamadığıyla birlikte ele alınır.

REFERANSLAR

İşin arkasında,
gerçek çalışmalar.

Ekibimizin çalışmalarından bir seçki.
Tüm referansları incele ↗
Dentkartepe web sitesi sunumu

Dentkartepe

  • Web sitesi tasarımı

Diş kliniği için web sitesi tasarımı

Dentkartepe için kliniğin hizmetlerini ve kurumsal kimliğini dijitalde sunan web sitesini tasarladık. Ziyaretçilerin kliniği tanıyabilmesi, tedavi ve hizmetler hakkında bilgi edinebilmesi ve iletişim noktasına ulaşabilmesi için web deneyimini bir bütün olarak ele aldık. Proje, kliniğin dijitaldeki yüzünü oluşturan bir web sitesi çalışmasıydı. Hizmet anlatımı, sayfa düzeni ve görsel sunum aynı tasarım yaklaşımında bir araya getirildi.

Oto Anahtarım web sitesi sunumu

Oto Anahtarım

  • Web sitesi & CMS

Hizmet sitesi ve içerik yönetim altyapısı

Oto Anahtarım için web sitesi ve CMS çalışması gerçekleştirdik. Firmanın oto anahtar hizmetlerini dijitalde anlatabileceği ve web içeriklerini yönetebileceği bir altyapı hazırladık. Hizmetlerin ziyaretçiye aktarılması ile sitenin yönetilebilir olması, proje kapsamında birlikte ele alındı. Bu çalışma bir web sitesi ve içerik yönetimi projesidir. Markanın dijital sunumunu, günlük içerik ihtiyaçlarını da karşılayabilecek bir site yapısı içinde hazırladık.

Lucid Biyokimya web sitesi sunumu

Lucid Biyokimya

  • E-ticaret sitesi

Ürün odaklı e-ticaret sitesi

Lucid Biyokimya için markanın ürünlerini dijitalde sunduğu e-ticaret sitesini hazırladık. Marka anlatımı ile ürünlerin alışveriş ortamında sunulmasını aynı web projesi içinde ele aldık. Çalışmanın kapsamı, firmanın e-ticaret amacıyla kullanacağı site yapısının oluşturulmasıydı. Ürünlerin ziyaretçiye aktarılmasını ve markanın dijital alışverişteki sunumunu birlikte değerlendirdik.

Finlit Partners web sitesi sunumu

Finlit Partners

  • Web çalışmaları

Uluslararası marka için web ve içerik çalışmaları

Finlit Partners ile web sitesi ve içerik çalışmaları kapsamında çalıştık. Firmanın faaliyetlerini ve hizmetlerini dijitalde sunuş biçimini ele aldık; web çalışmasını marka anlatımıyla birlikte değerlendirdik. Projenin odağında firmanın uzmanlığını ziyaretçilere aktarabilen bir dijital sunum yer aldı. Web tarafındaki çalışmalar ve bunları tamamlayan içerik çalışmaları bu referansın kapsamını oluşturuyor. Finlit Partners ile yürüttüğümüz işi, tek başına bir görsel tasarım örneği olarak değil, web ve içerik projesi olarak paylaşıyoruz.

Up4Fit web sitesi sunumu

Up4Fit

  • Web & içerik çalışmaları

Spor markasının web ve içerik çalışmaları

Up4Fit ile web ve içerik çalışmaları kapsamında çalıştık. Markanın spor ve yaşam deneyimini dijitalde anlatabilmesi, sunduğu hizmetleri ziyaretçilere aktarabilmesi ve web tarafındaki sunumunu geliştirmesi üzerine odaklandık. Web sitesiyle içerik anlatımını birbirinden kopuk işler olarak ele almadık. Markanın dijital ortamda nasıl tanıtıldığı ve ziyaretçinin hangi bilgilerle karşılaştığı, çalışmanın ortak çerçevesini oluşturdu.