Mobil arayüz tasarımında fiziksel kısıtlamalar

Tabletler ve akıllı telefonlar gibi yaygın olarak kullanılan mobil cihazların fiziksel formları ve dokunmatik ekran arayüzleri, bazı temel kullanılabilirlik kısıtlarını beraberinde getiriyor. Bir masaüstü cihaz kullanıcısı, daha geniş bir alan kullandığı için ilk bakışta daha fazla bilgi sahibi olabiliyor ancak mobil kullanıcılar için bunu söylemek fazlasıyla zorlaşıyor. Mobil kullanıcılar, masaüstü cihazlara kıyasla daha küçük bir alana sahip arayüze odaklanıyorlar ve etkileşimleri farklı şekillerde anlamaları gerekiyor. Tasarımcılar içinse kullanıcının hafızasında yer eden, mobil cihazlara özgü etkileşimleri tanımlayan detayları kullanarak, sezgisel bir mobil deneyim yaratma iddiası ortaya çıkıyor.

Kullanılabilir düzen

Mobil ekrandaki sınırlı alan dahilinde, içerik ve etkileşim en iyi düzene sahip olmalı. Kullanıcının hem akıcı bir içeriğe sorunsuz biçimde erişebilmesi, hem de odaklanabileceği bir düzen ile etkileşim halinde olması gerekiyor.

Mevcut ekran alanında daha kullanılabilir ve güçlü bir arayüz tasarımı sağlamak için, öncelikle kısıtlı ekrana ait kullanım kılavuzunu değerlendirmeye alarak başlamak gerek. Kullanım kılavuzu önceden tanımlanmış değerleri içerdiği için, arayüz tasarımcılarına projeyi tanımlarken yol gösterir.

Eşit aralıklı dikey ızgara yapısını, içeriği düzenlemek için bir rehber olarak ele alınabilir. Izgara yapısı hem görsel, hem içerik, hem de button hiyerarşisini, düzenli bir şekilde masaüstü, tablet ve akıllı telefon ekran arayüzleri için, ardışık temel düzen yapısı olarak kullanılabilir. Şu anda kullanılan standart ızgara yapılarının en yaygın olanlarından biri “Bootstrap” Grid ve düzen yapılarının iki önemli örneği “Responsive” ve “Adaptive” olarak sayılabilir.

Mobile-Image-1

Kullanıcı dostu etkileşimler

Kullanıcıların sunulan içeriklere, sayfada ilerlerken yapmayı amaçlamadıkları bir hamle yapmadan ve istemedikleri bir sayfa öğesini aktive etmeden göz gezdirebilmeleri büyük önem taşır. Başka bir deyişle sayfadaki öğeler arasındaki boşlukların, kullanıcının sayfada rahatça gezinebilmesine imkan verecek kadar yeterli olması gerekir.

Dokunmatik ekran arayüzü, bir mobil cihaz üzerinde görsel tasarım etkileşimini güçlendirmeyi gerekli kılar. Mobil cihazlarda tasarım öğelerini doğru boyutlandırmak ve konumlandırmak kullanım kolaylığı sağlar.

Mobile-Image-2

Mobil tıklanabilirlik kanunları başlığı altında belirttiğimiz gibi; MIT Touch Lab’ın yetişkin insanlar arasında yaptığı araştırmaya göre, ortalama işaret parmağı genişliği 1.6 ile 2 cm arasında değişkenlik gösterir. Bu değerleri piksele dönüştürdüğümüzde 45 ile 57 piksel arasında bir sonuca ulaşıyoruz. Yine yetişkinler için belirtilen standart değerlere göre; ortalama baş parmak genişliği yaklaşık 1 inç (72 piksel) civarında ölçümlenmiştir.

Ulaşılabilir kontroller

Her geçen gün yepyeni ebatlarda karşımıza çıkan akıllı telefonlar, farklı ekran boyutlarından kaynaklanan kısıtlamalar nedeniyle ulaşılabilirlik ve kullanım engelleri yaratmaktalar. Kullanıcının tasarlanan arayüze rahatça erişebilmesi ve kolayca etkileşime geçebilmesi için her etkileşim öğesi birbirine yakın konumlandırılmış olmalıdır.

Beraberinde, arayüz tasarımındaki etkileşim öğe tasarımlarının da birbirinden ayırt edici olması gerekir. Kullanıcının, yapması olası karmaşık işlemler için hem hızlı, hem ulaşılabilir, hem de farkedilebilir bir arayüz hazırlanarak, kontrolü eline alması sağlanmalıdır.

Mobile-Image-3

Görselliğin gücü

Mobil cihazlar için tasarlarken karşılaştığımız sorunlardan yarısı fiziksel kısıtlamalar, diğer yarısı ise bilgi iletişimidir. İnsan beyni görsel verileri çok daha yorumlar. Bunun anlamı tasarımda iletişimi geliştirmek için imgelerin kullanımı son derece değerli olabilir. İyi bir görsel stil, içerik veya etkileşim amacını destekler; genel olarak kullanıcı deneyimi dönüşümünü geliştirir.

Mobil geleceği

Günümüzde mobil ekranlar, akıllı saatler ve akıllı gözlükler gibi güncel örnekleri dikkate aldığımızda, daha da küçülme eğilimindeler. Bu yüzden fiziksel kısıtlamalar yakın gelecekte daha da önem kazanacağa benziyor. Bu kadar da değil, mobil cihazların geleceğine baktığımızda, hala geliştirilmeye devam edilen akıllı giysiler var. Bunların ekranlarının çoğunluğu 2-3 santimetreyi geçmemesi, hatta bir kısmının hiç ekranı da olmaması sözkonusu. Dolayısıyla mobil ekran alanları, giderek daha da değerli bir hale geliyor ve bu alanların verimli kullanımı büyük önem kazanıyor.

Sonuç olarak; bir mobil kullanıcı arayüzü tasarlarken, öncelik fiziksel kısıtlamaları tanımlamak gerekiyor. Sık kullanılan düzen yapılarını daha kullanılabilir arayüzler tasarlama konusunda rehber edinebilir; kullanıcı dostu etkileşim ilkesiyle kullanıcıların içeriklere daha kolay ve hızlı erişmesini sağlayabilirsiniz. Tasarımlarınızın daha Kullanılabilir, ulaşılabilir ve farkedilebilir olması için, gelişen teknolojinin beraberinde getirdiği farklı ekran boyutlarını takipte kalmanızda, yeni boyutlarda denemeler ve kullanıcı testleri yapmanızda yarar var.

Adobe Creative Cloud aboneliklerinde öğrencilere ve öğretmenlere özel %60 indirim fırsatlarını kaçırmayın.

Her bir tasarım öğesi için mutlaka kullanıcıya odaklanın; tasarım bütününüzü bu yönde araştırın ve geliştirin. Tanımlama sürecinde öncelikli önerimiz: Kağıt üzerinde hızlı bir iskelet oluşturmanız ve kullanıcı testleri için prototip uygulamarıyla çalışmanız.

Bugün 0 makale daha okuyabilirsin. Sınırsız okumaya devam etmek için
Ücretsiz Kaydol

Bu içerik SHERPA Blog okurlarına özel.

Devamı ve daha fazlası için sadece okur girişi yapman yeterli.

Kullanıcı deneyimi (UX), tasarım ve teknoloji alanında bilgini pekiştir.

Kullanım koşullarını okudum ve kabul ediyorum.
Neden kaydolmalıyım?