کاربرد پذیری(Usability) بخشی از تجربه ی کاربری(User Experience) در استفاده از یک محصول فیزیکی و یا دیجیتال است و به سهولت دسترسی و استفاده از آن میپردازد.ویژگی های یک محصول بنا به خواسته و انتظار کاربر از آن، میزان کاربردپذیری آن را تعیین می کند.در نظر داشته باشیم اگر کاربر در اولین برخورد با وب سایت یا اپلیکیشن نتواند به راحتی با آن کار کند و یا استفاده از محصول به نحوی باشد که کاربر را به هدفی که در به کارگیری آن داشته نرساند تجربه ی خوبی در استفاده از محصول به دست نیاورده و ممکن است دیگر از آن استفاده نکند.
اصول دهگانه ی کاربرد پذیری جیکوب نیلسون(Jakob Nielsen), ارزیابی ابتکاری است که کمک به شناسایی مشکلات قابلیت استفاده در رابط کاربری محصولات دیجیتال میکند.
در این نوشته برآنیم تا به کمک 10 اصل کاربرد پذیری جیکوب نیلسون میزان کاربرد پذیری رابط کاربری وب اپلیکیشن بانک رسالت از نقطه ی شروع(صفحه نخست وب اپ) تا انجام عملیات کارت به کارت را بررسی کنیم. شایان ذکر است که بررسی کاربرد پذیری این رابط کاربری با کاربر ثانویه ای انجام نشده و این پژوهش از روش شناخت گام به گام(Cognitive walkthrough) توسط خودم انجام شده.
سیستمها باید همیشه کاربران را از طریق بازخورد مناسب در زمان معقول در جریان آنچه اتفاق می افتد ،قرار دهند.هنگامی که کاربران وضعیت فعلی سیستم خود را می دانند, نتیجه ی تعاملات قبلی خود را با سیستم به خاطرسپرده و مراحل بعدی را تعیین می کنند.تعاملات قابل پیشبینی باعث ایجاد اعتماد به محصول می شود.
در تصویر زیر وقتی مشخصات کارت را وارد میکنیم برای دریافت رمز دوم صفحه ای باز می شود و وقتی دکمه ی دریافت رمز را میفشاریم سیستم از طریق پیامی که در کادر زیر مشخص شده به کاربر اعلام میکند که چه اتفاقی در حال رخ دادن است.
ولی در مثال های زیر: "تصویر یک" صفحه ی نخست اپلیکیشن می باشد اما به دلیل فعال بودن فیلترشکن روی گوشی, صفحه ی اول نمایش داده نمیشود.(بهتر می بود اگر با نمایش پیامی روی صفحه کاربر را متوجه عدم کارکرد وب اپ در حضور فیلتر شکن کنیم). در تصویر دوم نیز با غیر فعال کردن فیلتر شکن این صفحه برای کاربر قابل رویت خواهد بود. حال آنکه کاربر از صفحه نخست اپ انتظار چیزی مثل صفحه ای برای ورود به حساب کاربری اش را دارد در صورتی که در صفحه ی پیش رو گزینه هایی برای کاربر قرار داده شده(کادر قرمز رنگ) که همگی ارائه دهنده ی خدمات کارت می باشند.(هم ارز هستند) در نگاه اول ممکن است فکر کنیم برای دسترس سریع تر کاربر این گزینه ها پیش روی او قرار گرفته شده اما گاهی ارائه گزینه های زیاد همگی روی یک صفحه نه تنها کاربری اصلی صفحه را مشخص نمیکند بلکه گاها موجب گیجی کاربر و زیاد شدن زمان تصمیم گیری او میکند.(قانون Hick's).
اصولا طراحی باید به زبان کاربران صحبت کند بدین صورت که در سیستم برای فهم بهتر کاربر باید از عبارات و مفاهیم آشنا بهره ببریم و از قرارداد های دنیای واقعی برای نشان دادن اطلاعات به صورت طبیعی و منطقی استفاده کنیم.
در مثال زیر آیکون هایی که برای هر گزینه استفاده شده منظور را به خوبی به مخاطب می رساند و مصداق آن در دنیای واقعی نیز وجود دارد.(برای خدمات کارت شکل آیکون مانند کارت بانکی در دنیای واقعی است) مخاطب حتی با دیدن صرفا خود آیکون میتواند عملکرد هر گزینه را تصور کند.
اما در مثال زیر با دیدن چرخ دنده برای کاربر بخش تنظیمات تداعی می شود, اما در اینجا عملکرد چرخ دنده فقط به روز رسانی صفحه می باشد.(شاید بهتر بود از آیکون دیگری برای نشان دادن به روز رسانی صفحه استفاده کرد.) شایان ذکر است که با توجه به سطح دسترسی بنده به عنوان کاربری که فقط قصد استفاده از خدمات کارت را داشتم و حساب کاربری در بانک رسالت ندارم این گزینه به این صورت است, با این حال با توجه به توضیح بالا حتی با این سطح دسترسی انتظار کاربر از گزینه ی چرخ دنده تنظیمات خواهد بود.
کاربران اغلب ممکن است در استفاده از سیستم گزینه ای را به غلط انتخاب کنند.سیستم باید امکان خروج یا رفتن به مرحله ی قبل را برای کاربر فراهم سازد و برای دست یابی به خروج, کاربر را درگیر پروسه ای طولانی و یا سخت نکند.زمانی که کاربر امکان بازگشت به مرحله یا صفحه قبل یا خروج از صفحه ی پیش رو را داشته باشد احساس رضایت, اعتماد و آزادی بیشتری در استفاده از محصول را خواهد داشت.
در تصویر زیر مشاهده میکنیم که کاربر اگر قصد خروج از مرحله و یا منوی پیش رو را داشته باشد به راحتی میتواند با فشردن علامت ضربدر کادر پیش روی خود را ببندد.
اما در مثال زیر وقتی کاربر از طریق صفحه ی اصلی به بخش ورود به سامانه ی مدیریت چک وارد می شود دیگر دکمه ای یا علامتی برای خروج و برگشت کاربر به صفحه ای اصلی(صفحه ای که کاربر در نقطه ی اول توسط آن به این صفحه هدایت شده) وجود ندارد.
طراحان رابط کاربری برای جاگذاری هریک از عناصر و المان ها در صفحه باید از ثبات عملکرد, شکل, سایز و ... همان المان ها در صفحات دیگر محصول نیز اطمینان حاصل کنند, به طوری که مثلا دکمه ثبت در همه جای سیستم عمل یکسانی را انجام دهد و یا در هر صفحه شکل ظاهری متفاوتی نداشته باشد. اصولا تجربه ی کاربران از دیگر محصولات انتظارات آن ها را تعیین میکند. عدم حفظ ثبات عناصر مورد استفاده در رابط کاربری باعث ایجاد بار شناختی برای کاربران شده و آن هارا مجبور به یادگیری موارد جدید میکند که تاثیراتی خوبی روی کاربر نخواهد داشت.مثلا کاربر همیشه انتظار دارد که دکمه ی ضربدر او را از صفحه خارج کند.
در مثال زیر آیکونی که با کادر قرمز مشخص شده در تمامی صفحات کاربرد یکسانی داشته و کاربر با فشردن آن به صفحه ی اصلی هدایت میشود.
در درجه ی اول بهتر است سیستم به گونه ای طراحی شود که از بروز خطا در آن جلوگیری شده یا آن را به حداقل برساند.
مثلا در تصویر زیر اگر از کادری گذر کنیم و آن را پر نکنیم. سیستم با قرمز کردن آن کادر و نمایش پیغام بالای صفحه به ما هشدار میدهد که کادر باید پر شود.
ولی در مثال های زیر سیستم قبل از بروز خطا کاربر را متوجه نساخته و وقتی کاربر تمامی مراحل را طی کرد در پایان عملیات طی شده سیستم هشدار لازمه را برای کاربر ارسال میکند.در تصویر شماره 1 با وجود اینکه شماره کارت مبدا یک رقم کمتر وارد شده اما سیستم به کاربر هیچ هشداری نداده و کاربر پس از ثبت اطلاعات در تصویر 2 حتی رمز دوم را نیز وارد کرده و پس از گزینه ی ثبت, سیستم متوجه اشتباه کاربر شده و کادر بالای تصویر 3 را نشان میدهد.نکته ی دیگر اینکه بهتر بود تا سیستم پس از ثبت رمز دوم توسط کاربر عملیات کارت به کارت را به طور مستقیم انجام نداده و بار دیگر برای اطمینان کاربر کادری روی صفحه از مشخصات عملیات کارت به کارت مذکور نشان دهد.(مدالی شامل مشخصات مقصد و مبلغ و اینکه آیا کاربر اطمینان کافی از جابه جایی مبلغ مورد نظر را دارد یا خیر.)
این اصل به این موضوع اشاره دارد که دستور العمل های استفاده از سیستم باید در صورت لزوم توسط کاربر قابل مشاهده باشد.این کار با نمایان کردن عناصر و گزینه ها کمک به حداقل رساندن بار حافظه ی کاربر می کند.
این اصل در مثال زیر به خوبی قابل مشاهده است. در جریان مسیر کارت به کارت کردن اعلان بالای صفحه, نشانگر حداکثر میزان جا به جایی پول به صورت کارت به کارت می باشد, پس کاربر نیازی به گشتن بخش های دیگر اپ برای دانستن میزان حداکثر مبلغ کارت به کارت را ندارد و یا در بخش تاریخ انتقضای کارت دو کادر برای کاربر مشخص شده که به راحتی کاربر را متوجه میکند که کادر اول از راست برای وارد کردن ماه و دومی برای وارد کردن سال انقضای کارت است. (زبان فارسی از راست به چپ نوشته میشود.)
در این اصل اشاره به آن داریم که رابط کاربری باید طوری طراحی شود که به کاربران اجازه دهد با روش های مختلف به عملیاتی که میخواهند در سیستم انجام دهند, دست یابند.مطمعنا کاربران جدید برای استفاده از محصول و انجام مراحل مختلف ممکن است نیاز به راهنمایی داشته باشند اما کاربران قدیمی که کار با سیستم را به خوبی میدانند بهتر است دسترسی شخصی سازی را داشته باشند. البته این ویرایش و شخصی سازی به هیچ وجه باعث تغییر یا حذف و اضافه ی مراحل اصلی و بنیادی پیش روی کاربر برای رسیدن به هدف نهایی نخواهد شد.
در تصویر زیر برای سهولت ورود کاربر به بخش ورود به سامانه ی مدیریت چک میتوان از هرکدام از موارد مشخص شده استفاده کرد که شامل کدملی, شناسه ملی, شناسه فراگیر می باشد.
بهتر بود اگر در وب اپلیکیشن بانک رسالت گزینه ای برای کاربران جهت ثبت کارت های بانکی وجود داشت تا آنها مجبور نشوند برای هربار عملیات کارت به کارت, اطلاعات کارت را از اول وارد کنند.و یا حتا گزینه ای برای اسکن کارت های مبدا برای سهولت کاربر به جای وارد کردن جز به جز اطلاعات کارت به صورت دستی.(البته گاها ممکن است برای جلوگیری از سو استفاده های مالی امکان ثبت کارت از طرف سیستم وجود نداشته باشد. حال آنکه در نسخه ی اندروید موبایل بانک رسالت با احراز هویت از طریق شماره موبایل امکان ثبت کارت وجود داشته و این موضوع کار کاربر جهت استفاده از اپ برای عملیات های بانکی را آسانتر میسازد.)
طراحی رابط کاربری نباید شلوغ بوده و حاوی اطلاعات اضافه یا مواردی که به ندرت استفاده میشود, باشد.این بدین معناست که برای طراحی رابط کاربری, طراح رابط کاربری باید همواره توجه داشته باشد که تمرکز را بر روی محتوا و طراحی بصری موارد ضروری بگذارد. بدین صورت که عناصر بصری رابط کاربری از اهداف اولیه کاربر پشتیبانی کند.
در مثال زیر عملیات کارت بانکی در زیر فهرست خدمات کارت قرار داده شده است و طراح رابط کاربری به خوبی کاربرد اصل هشتم را به تصویر کشیده.
اما همانطور که در بالاتر هم اشاره شد صفحه ی اولیه ای که کاربر بعد از باز کردن وب اپ مشاهده میکند(که انتظار می رود صفحه ی ورود کاربر باشد.) این مهم را رعایت نکرده.با استناد به قانون Hick's(زمان لازم برای تصمیم گیری با تعداد و پیچیدگی انتخاب ها افزایش می یابد).اگر به تصویر زیر دقت کنید مواردی که با کادر قرمز مشخص شده اند خدماتی است که کاربر میتواند از طریق کارت انجام دهد که این خدمات به صورت جداگانه در عکس بالا نیز قابل مشاهده است, صرف دسترسی سریع کاربر به آن ها از طریق صفحه ی ورود نباید این المان ها روی صفحه ی اصلی قرار میگرفته تا صفحه را شلوغ کند.از طرفی عنصری که با کادر زرد مشخص شده کاربر را به صفحه ی رو به رویی هدایت میکند که در آن دستورالعمل جایگذاری وب اپ روی صفحه ی گوشی را نمایش میدهد. برای جلوگیری از شلوغی و درهم ریختگی صفحه ی ورود شاید بهتر بود این گزینه و توضیحاتش در هنگام نصب وب اپ روی سایت به عنوان راهنمای دانلود و استفاده قرار میدادند.
پیام های خطا باید تا حد ممکن به زبان ساده برای کاربر باشد و از استفاده از اصطلاحات فنی اجتناب شود.همچنین باید دقیقا مشکل را نشان داده و راه حل را بیان کند.
در تصویر زیر وقتی کاربر نام کاربری و رمز ورود را وارد نمی کند و روی دکمه ی ورود کلیک میکند پیغامی واضح مبنی بر این دریافت میکند که باید نام کاربری و رمز عبور را وارد کند و مجدد وقتی اطلاعات را غلط وارد کرده و تلاش به ورود میکند, سیستم با پیغامی که در عکس مشخص شده به کاربر اطلاع میدهد که اطلاعات وارده نادرست است.
در مثال های زیر پیغام های خطا از سمت سیستم میتوانست جزئی تر و دقیق تر بیان شود.مثلا در تصویر اول کاربر تمامی اطلاعات کارت های مبدا و مقصد را به درستی وارد کرده ولی عملیات کارت به کارت وی با مشکل مواجه شده و سیستم فقط این خطا را نشان میدهد که کارت پشتیبانی نمیشود اما مشخص نیست منظور سیستم کارت مبدا یا مقصد بوده و دقیقا کدام بخش اطلاعات کارت دارای مشکل است.
در تصویر دوم کاربر هیچ کادری را پر نکرده ولی وقتی دکمه ی ورود را میفشارد تنها پیغام سیستم مبنی براین است که کاربر قسمت متن تصویر را کامل کند در صورتی که رابط کاربری میتوانست به گونه ای طراحی شود که این پیغام در تمامی کادر های خالی نمایش داده شود.
در تصویر سوم نیز تنها پیغام ارسالی از سوی سیستم به این صورت است که اطلاعات فرم را به درستی وارد کنید درصورتی که مشخصا منظور این پیغام از سمت سیستم پر کردن کادر های قرمز شده است یا ویرایش شماره کارت مبدا؟
در طراحی رابط کاربری بهتر است کاربری المان های موجود در سیستم نیاز به توضیح اضافه نداشته باشد. اما گاهی ممکن است برخی راهنمایی های کوچک جایگذاری شده در صفحه به سهولت فهم کاربر کمک کند.
به مثال زیر توجه کنید عبارت ریال در بخش کارت مقصد که در کنار کادر مبلغ گذاشته شده به راحتی به کاربر کمک میکند تا متوجه شود مبلغ باید به ریال وارد شود.
به طور حتم نقاط قوت و حتی نکاتی دیگری برای بهبود رابط کاربری وب اپلیکیشن بانک رسالت وجود دارد.خرسند خواهم شد اگر نقطه نظراتتان را مبنی بر بهبود کاربرد پذیری رابط کاربری این محصول با بنده در میان بگذارید.
