طراحی رابط کاربری برای نابینایان

من یه دوست نابینا دارم به اسم امید هاشمی که اتفاقا در زمینه دسترسی پذیری هم خیلی فعاله و دانش خوبی داره و به شرکتهای زیادی کمک کرده که محصولشون را دسترس پذیر کنند. یکبار داشت میگفت:

این ATM های مخصوص نابینایان برای ما قابل استفاده نیست! چرا که مبالغ و اسم سرویسها که کنار دکمه‌های مانیتور ظاهر میشن، بصورت صوتی خوانده نمیشن! و فقط رو مانیتور نوشته شده! ثانیا: هنگام انجام یک عملیات بانکی مانند کارت به کارت وقتی مبلغی را وارد میکنید، یا شماره کارت مقصد کسی را مینویسیم، نام دارنده کارت مقصد و مبلغ را برای تایید روی مانیتور نشون میده، ولی بازم صوت نداره که برای ما بخونه! خب من باز باید از یه فرد بینا کمک بگیرم تا اینا رو برام بخونه! پس کارکرد این خودپردازها چیه؟
خودپردازهای مخصوص نابینایان
خودپردازهای مخصوص نابینایان

راهکار طراحی محصول برای نابینایان

اولین قدم برای طراحی UI برای نابینایان اینه که چشماتون را ببندید. چشم از دریبل بردارید و رابط کاربری صوتی یا متنی را مقدم بر آن قرار دهید. (این تجربه قبلا در رابط کاربری USSD انجام شده. جایی که محدودیت‌های ویژوال در حداکثر است و فقط با متن و چند گزینه باید با کاربر ارتباط برقرار بشه و داده هایی به کاربر داده بشه یا ورودی هایی ازش گرفته بشه)

دوم: رابط کاربری، دو وظیفه دارد:

  • دادن اطلاعات به کاربر
  • دریافت اطلاعات از کاربر

همه داده‌های خروجی یا باید صوتی باشه یا قابلیت تبدیل شدن به محتوای صوتی رو داشته باشند. چه متنِ ثابت (مثلا Alert ها) و چه داده‌های داینامیک مثل نام دارنده کارت مقصد در یک فرانید کارت به کارت بانکی. برای تبدیل متن به صوت هم میتوانید از اِنجین‌های تبدیل متن به صوت فارسی کمک بگیرید (شرکت عصرگویش پرداز یک موتور تبدیل متن فارسی به صوت داره).

برای اپ ها و موبایلها، لازم نیست شما صوت آنرا کنترل و تهیه کنید. اپلیکیشن های صفحه خوان (screen Reader) کارشون اینه که صفحات متنی رو تبدیل به متن میکنند و برای کاربران نابینا میخونن.فقط لازم است که هنگام پیاده سازی یک سایت (یا اپ موبایل)، متنها را درست و بهینه نوشته باشید و از تگ های مناسب در کدنویسی (alt attribute , semantic tags , ARIA attributes) استفاده کرده باشید تا برنامه صفحه خوان راحت تر بتونه متون رو به صدا تبدیل کنه.

سوم: مطالعه درباره رابط های کاربری صوتی

مطالعه در این حوزه شامل دو بخش است. یکی رابط های متنی (مانند وب سایتها و اپلیکیشن های موبایل) که امکان تبدیل شدن به محتوای صوتی را دارند. و یکی رابط های کاربری که کاملا صوتی هستند (مانند نرم افزارهای نقشه و ناوبری)

برای یادگیری در حوزه دسترس پذیرسازی رابط های کاربری متنی، باید درباره کدنویسی استاندارد و همچنین تگ ARIA در کدهای HTML مطالعه کنید. ARIA استانداردی است که گوگل آنرا ابداع کرد و به UI های متنی کمک میکند که محتوای غنی تری را به نرم افزارهای screen reader ارایه کنند.

برای یادگیری درحوزه نرم افزارهایی که ذاتا صوتی هستند، پیشنهاد می کنم نرم افزارهای صوتی مانند نرم افزار بلد را نصب کنید و با آنها کار کنید. این نرم افزار در این حوزه خیلی خوب کار کرده است.

Accessibility Books
Accessibility Books

برای یادگیری از کتابهایی که در این لینک معرفی شده کمک بگیرید. با جستجوی عبارت Voice User Interface میتوانید به مقالات جذابی در این حوزه برسید.

چهارم: تست دسترس پذیری

پس از اینکه کار طراحی محصول را به پایان رساندید، تست دسترس‌پذیری بگیرید و رابط کاربری خود را با کمک یک فرد نابینا تست کنید تا مطمئن شوید که این افراد که کاربر اصلی این محصول هستند میتوانند از آن استفاده کنند. (نه مثل برخی بانکها که سرویس نابینایان را با چند کاربر بینا تست کرده اند)

سخن پایانی

بهبود دسترس پذیری محصولات بخصوص برای نابینایان، کار گرافیکی نیست و نیازمند دانش frontend نیز هست. شما باید کمی از مفهوم UI/UX فراتر بروید. زیرا رابط کاربری در مدیاهای مختلفی ظاهر می شود و مطالعه کدنویسی وب و موبایل می تواند به شما در پیدا کردن یک زبان مشترک با بچه های فرانت کمک کند.