Android uygulamanız varsa ve görsel stilini korumak istiyorsanız bu tasarım dilini Android XR'de de kullanabilirsiniz. Yeni uygulamalar veya yeniden tasarımlar için kullanıcı arayüzü boyutu, erişilebilirlik, yazı tipi, renk şemaları ve bileşenler ile ilgili Materyal Tasarım yönergelerini uygulayabilirsiniz.
2D mobil veya büyük ekran Android uygulamaları, çok az ek geliştirme çalışmasıyla Tam Alan özelliklerinden yararlanabilir. Yüksek XR etkisi için panelleri mekansallaştırmayı ve uzamsal kullanıcı arayüzü oluşturmayı deneyin. Daha sürükleyici kullanıcı yolculukları için 3D modeller ve ortamlar ekleyebilirsiniz.
Unity, Open XR veya WebXR uygulaması oluşturduysanız ya da oluşturmaya çalışıyorsanız dilediğiniz tasarım dilini kullanabilirsiniz. Material Design tarafından sağlanan tasarım önerileri, renk, boşluk, ölçek, düğme ve yazı tipi uygulamanıza yardımcı olabilir.
Uygulamanızın görsel tasarımını test etme
Rahat ve erişilebilir bir kullanıcı deneyimi sunmak için uygulamanızın görsel tasarımını test etmek çok önemlidir. Farklı XR platformları ve ortamlarında test yapma hakkında bilgi edinin.
Emülatörleri, simülasyon araçlarını ve gerçek cihazları kullanma
- Android uygulaması geliştiriyorsanız uygulamanızı Android XR emülatöründe test edin. Bu sayede olası sorunları belirleyebilir ve fiziksel bir cihaz olmadan hızlıca iterasyon yapabilirsiniz.
Görsel tasarım testi yapılacaklar listesi
- Hareket veya animasyonların hareket hastalığını tetiklemediğinden emin olmak için bunları test edin. Sorunsuz geçişler, sabit kare hızları ve tahmin edilebilir hareketler olup olmadığını kontrol edin.
- Sanal öğelerin fiziksel çevreyle uyumlu olmasını sağlamak için gerçek dünyadaki ayarlarda geçişi deneyin.
- Uygulamanızı parlak ve loş ortamlar da dahil olmak üzere farklı ışık koşullarında test edin.
- Farklı mesafe ve açılardan metnin okunabilirliğini kontrol edin.
- Erişilebilirlik ve konfor açısından renk düzenini değerlendirin.
Kullanıcı geri bildirimi toplama
İyileştirilebilecek alanları belirlemek için kullanıcı testi yapın. Kapsamlı bir bakış açısı için farklı düzeylerde XR deneyimi ve görsel yetenekleri olan kullanıcıları dahil edin.
Android XR'de hedefler
Bir XR uygulamasında hedef, kullanıcıların etkileşimde bulunduğu dokunulabilir veya işaretlenebilir alandır. Daha büyük hedefler hassasiyeti, rahatlığı ve kullanılabilirliği artırır. Uygulamanızı erişilebilir hale getirmek için Materyal Tasarım hedef yönergelerini uygulayın. Bu API'ler Android, Unity, OpenXR ve WebXR uygulamalarıyla çalışır. Uygulamanız zaten Materyal Tasarım önerilerine uyuyorsa hedef boyutlarınız minimum boyutu karşılar ancak 56 dp en uygun boyuttur.
Tüm etkileşimli kullanıcı arayüzü öğelerinde aşağıdakiler dikkate alınmalıdır:
- Önerilen hedef: 56 dp x 56 dp veya daha büyük
- Görsel kolaylık: 48 dp x 48 dp veya daha büyük
- Hedef ile görsel kolaylık arasındaki ofset: 4 dp
- Doğru etkileşimler için farklı kullanıcı arayüzü öğelerinin işaretçi hedefleri örtüşmemelidir.
Fareyle üzerine gelme durumlarını eklediğinizden emin olun
Etkileşimli bileşenler için temel etkileşimli durumlara ek olarak fareyle üzerine gelme ve odak durumları da erişilebilirliği artırmak için dahil edin. Fareyle üzerine gelme durumları herkes için yararlı olabilir ve özellikle kullanıcı arayüzü öğelerini seçmek için işaretçi girişlerine güvenen kullanıcılar için çok önemlidir.
Üzerine gelme durumları, sistemde göz izleme işlevini etkinleştirmede önemli bir rol oynar. Ancak göz izleme etkinleştirildiğinde, kullanıcı gizliliğini korumak ve veri paylaşımını önlemek için uygulama, fareyle üzerine gelme durumlarını erişemez. Sistem, hangi kullanıcı arayüzü bileşenlerinin etkileşime açık olduğunu belirtmek için yalnızca kullanıcı tarafından görülebilen bir vurgu durumu çizer.
Hedefler arasındaki mesafe
Material Design, düğmeler dahil olmak üzere hedefler arasında en az 8 dp boşluk bırakılmasını önerir. Bu boşluk, kullanıcıların etkileşimli öğeleri kolayca ayırt etmesini ve yanlışlıkla seçim yapmamasını sağlar.
Düğmeler arasındaki mesafe, bağlamlarına ve boyutlarına göre değişebilir. Göz önünde bulundurulması gereken bazı faktörler:
- Düğme boyutu: Görsel netliği korumak için büyük düğmeler arasında daha fazla alan gerekebilir.
- Düğme gruplandırma: İşlevsel olarak birbirine yakın düğmeler daha yakın gruplandırılabilir. İlişkisiz düğmeler ise daha uzakta olmalıdır.
- Düzen: Ekranın genel düzeni, düğmeler arasındaki boşluğu etkileyebilir. Örneğin, araç çubuğundaki düğmeler, iletişim kutusundaki düğmelere kıyasla daha yakın aralıklarla yerleştirilebilir.
Panel boyutu ve ölçeği
Android XR, uygulamanızı geniş bir kitle için rahat, okunaklı ve erişilebilir hale getirmek için tasarlanmıştır. Android XR, en iyi deneyim için 0,868 dp/dmm kullanır.
Panel kullanıyorsanız XR uygulamanız büyük olasılıkla kullanıcıdan fiziksel ekrandan daha uzakta olacaktır. Kullanıcının kulaklık taktığını varsayalım. Kullanıcıların etkileşimde bulunmak için başlarını hareket ettirmek zorunda kalmaması amacıyla, birincil içeriği 41° görüş alanına yerleştirerek en iyi konforu sağlayın.
Öneriler
- Panellerin köşeleri 32 dp yuvarlatılmıştır. Bu varsayılan ayarı geçersiz kılabilirsiniz.
Panel derinliği davranışları
- Ev Alanı: Uygulamalar, kullanıcıdan 1,75 metre uzaklıkta açılır ve geliştiriciler bu ayarı geçersiz kılamaz.
- Tam Alan: Varsayılan olarak uygulamalar, Ana Alan'daki konumlarında açılır. Panelleri kullanıcının konumuna göre yerleştirmek için uzamsal mantığı kullanabilirsiniz.Ancak 1,75 metrelik bir başlatma mesafesi öneririz.
Bir uygulama kullanıcıdan 1,75 metre uzaktayken:
- 1024 dp, 1.556,24 milimetre olarak algılanır.
- 720 dp, 1093,66 milimetre olarak algılanır.
- Fiziksel gerçeklikte 1 metre = XR'de 1 metre
Düğmeler ve simgeler
Mevcut bir Android uygulamanız varsa Android XR için özel bileşenler tasarlamanıza gerek yoktur. Düğmeler ve simgeler ile ilgili Materyal Tasarım yönergelerini uygulayın. Unity, OpenXR veya WebXR uygulamanız varsa düğmelerinizi ve simgelerinizi olduğu gibi bırakabilir veya Material Design'dan ilham alabilirsiniz.
Kendi düğmelerinizi veya simgelerinizi oluşturmaya karar verirseniz basit formlar, net çizgiler, temel şekiller ve sınırlı bir renk paleti kullanın. Aşırı ayrıntılı tasarımlardan kaçının. Bunları farklı çözünürlüklerde ve izleme mesafelerinde ölçeklenebilir ve okunaklı hale getirin. Erişilebilirlik için bileşen ile arka planı arasında yeterli kontrast olduğundan emin olun ve ekran okuyucu veya diğer yardımcı teknolojileri kullanan kullanıcılar için metin açıklamaları ya da ipuçları sağlayın.
Renkler
Android XR, tutarlı ve görsel açıdan ilgi çekici bir arayüz sağlamak için Materyal Tasarım'ın renk sistemini kullanır. XR'ye özel, etkileyici bir görsel stil oluşturmak için yeterli kontrasta sahip bir tasarım yapın, dengeli bir palet seçin, renk körlüğü olan kullanıcılar için erişilebilir renkler kullanın ve göz yorgunluğuna veya yön kaybına neden olabilecek rahatsız edici kombinasyonlardan kaçının.
XR'de koyu ve açık temalar
Koyu ve açık temaları bir Android mobil uygulamasında kullandığınız gibi kullanın. Kullanıcılar, Android XR'de koyu ve açık temalar arasında geçiş yaparak kendi tercihlerine en uygun görsel stili seçebilir.
Materyal Tasarım renk şemaları hakkında daha fazla bilgi edinin.
XR yazı biçimi
XR'de rahat bir kullanıcı deneyimi için yazı tipi okunaklılığı önemlidir. Daha iyi okunabilirlik için 14 dp veya daha büyük yazı tipi boyutu ve normal veya daha yüksek yazı tipi kalınlığıyla yazı tipi ölçeği seçeneklerini kullanmanızı öneririz.
Kullanımı kolay bir uygulama oluşturmak için Materyal Tasarım'ın yazım kılavuzundan yararlanabilirsiniz.
XR'de yazı tipleriyle ilgili en iyi uygulamalar
- Değişken mesafeler için boyut: Kullanıcıların hareket edeceğini ve metni farklı konumlardan görüntüleyeceğini unutmayın. Yazı tipi boyutlarının uzaktan okunabilecek kadar büyük olduğundan emin olun.
- Metni kullanıcının doğal görüş alanına yerleştirin: Bu sayede aşırı kafa hareketi ve boyun ağrısı önlenir.
- Derinlik ve ölçeği göz önünde bulundurun: 3D alanda hiyerarşi oluşturmak için derinlik ipuçları ve ölçek kullanın.
- Metnin, kullanıcının arka planına karşı okunaklı olduğundan emin olun: Daha kalın yazı tipleri daha fazla kontrast sunar. Ortamdaki renklere, ışığa ve karmaşıklığa göre ayarlayın.
- Uyarlanabilir yazı tipleri kullanın: Paneller kullanıcıya çok yakın, çok uzak veya garip bir açıdan gösterilebilir.
- Hareket eden nesnelere eklenen metni sınırlayın: Bu, hareket hastalığına neden olabilir.
XR'de erişilebilir yazı tipi
- Okunaklı yazı tipleri seçin: Küçük boyutlarda ve uzak mesafelerde net harf biçimlerine sahip yazı tiplerine öncelik verin.
- Normal cümle düzeni kullanın: Normal cümle düzeni, büyük harf düzeninden daha kolay okunur.
- Satır uzunluğunu sınırlayın: Okunabilirliği artırmak için daha kısa satır uzunlukları kullanın.
- Erişilebilir renkler seçin: Renk görme farklılıkları olan kullanıcılar için okunaklı renk kombinasyonları kullanın.
- Yer daraltıcı öğelerden kaçının: Metne yeterli alan bırakın.
- Metin ölçeklendirmeye izin ver: Kullanıcıların metin boyutunu kendi ihtiyaçlarına göre ayarlamalarına izin verin.