نمایش وضعیت سیستم در رابط کاربری (Visibility of system status)

تا‌به‌حال برایتان پیش آمده است که حین ثبت نام در سایتی، پس از ایجاد رمز عبور با خطای مستطیل قرمز رنگ مواجه شوید و اصلا متوجه نشوید چگونه می‌توان آن را درست کرد و فرآیند ثبت نام را ترک کنید؟ نکته اینجاست که کاربران اصولاً نسبت به یک محصول دیجیتال صبور نیستند و به راحتی سایت را بدون آن‌که ثبت نام خود را تکمیل کنند ترک خواهند کرد و این موضوع موجب از دست رفتن یک فرصت کسب و کاری برای شما خواهد شد. در نتیجه دریافت یک فیدبک مناسب از سیستم بسیار مهم است.

ما در خارج از دنیای دیجیتال دائما در حال دریافت فیدبک هستیم، فشار دادن یک دکمه فیزیکی، صدایی که موتور دستگاهی ایجاد می‌کند و لامپی که نور تولید می‌کند. محصولات دیجیتال نیز باید به‌گونه‌ای طراحی شوند که دائما به کاربر بازخورد دهند و او را از وضعیت فعلی سیستم آگاه سازند.

جیکوب نیلسن ۱۰ اصل کلی Interaction Desgin برای تست کاربردپذیری و بررسی نتایج تجربه کاربری در ارزیابی اکتشافی ایجاد کرده است که با اصطلاحات Heuristic Evaluation و Heuristic Analysis هم شناخته می‌شود. یکی از این اصول نمایش وضعیت سیستم یا Visibility of system status است.

نمایش وضعیت سیستم - Visibility of system status

یک سیستم همواره باید کاربر را مطلع کند که در حال حاضر چه چیزی در جریان است و کاربر کجاست. نمایش وضعیت فعلی یک اصل مهم در طراحی سیستم‌های تعاملی است و به معنی داشتن یک ارتباط شفاف و مناسب با کاربر است که باعث می‌شود احساس کند بر سیستم کنترل دارد و این احساس کنترل باعث شکل‌گیری حس اعتماد در او خواهد شد.

در اینجا می‌خواهم ۴ متد فیدبک بصری یا Visual feedback را معرفی کنم که برای نمایش وضعیت سیستم استفاده می‌شوند:

۱) استفاده از Visual feedback برای نشان دادن این‌که کاربر کجاست یا در کدام قسمت از فرآیند قرار دارد

• من کجا هستم؟

هیچ فردی دوست ندارد گم شود، ولی گم شدن می‌تواند هم در دنیای واقعی رخ دهد و هم در دنیای دیجیتال. خیلی مهم است که کاربر بداند در کجای اپلیکیشن است. این آگاهی درنهایت باعث شکل‌گیری یک تجربه ناوبری خوب خواهد شد. در زیر نمونه‌ای از طراحی bottom navigation را می‌توانید مشاهده کنید:

• چند مرحله نیاز است تا فرآیندی تکمیل شود

دانستن این‌که چند مرحله نیاز است تا فرآیندی تکمیل شود، باعث می‌شود تا کاربر بداند، چه میزان زمان نیاز دارد تا عملیاتی مانند ثبت نام به پایان برسد.

۲) تأیید اکشن کاربر با Visual feedback

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

علاوه بر این Visual feedback باعث visible بودن و قابل فهم بودن طراحی خواهد شد.

در زیر می‌توانید چند نمونه از طراحی‌های تعاملی من را که به Visual feedback اشاره دارند مشاهده کنید:

۳) نمایش وضعیت سیستم با Visual feedback

• نشان دادن این‌که سیستم busy است و درگیر انجام کاری است

هنگامی که سیستم برای بارگذاری کامل به چند ثانیه زمان اضافی نیاز دارد، می‌توان فوراً به کاربر فیدبک داد. بسته به این‌که چه میزان زمان برای انتظار نیاز است، می‌توان از infinite loading indicator ها استفاده نمود که بیشتر مناسب عملیاتی است که کم‌تر از ۱۰ ثانیه زمان نیاز دارند.

همچنین می‌توان برای عملیاتی که بیش از ۱۰ ثانیه زمان می‌برند از progress bar استفاده کرد. پیشنهاد می‌کنم مقاله 8 خطای شناختی معروف در طراحی Progress Bar را نیز برای درک بیشتر مطالعه کنید.

برای اپلیکیشن‌های موبایل این امکان وجود دارد که در مراحل اولیه بارگذاری از animated splash screens استفاده کرد. splash screen اگر به درستی دیزاین شده باشد می‌تواند در یک کاربر که برای اولین بار است از سیستم استفاده می‌کند احساس خوبی ایجاد ‌نماید و او را از دغدغه انتظار کشیدن دور ‌کند.در این‌جا پیشنهاد می‌شود که مقاله‌ی چک لیست طراحی Splash Screen نوشته شده توسط امیر تقی آبادی را برای درک بیشتر مطالعه کنید.

• محتوا در حال بارگذاری است

در مواقعی که بارگذاری محتوا زمان می‌برد، پیشنهاد می‌شود که از نوع خاصی container استفاده شود به نام skeleton screen. این نوع محتوای موقتی برای کاهش زمان انتظار استفاده می‌شود و می‌بایست به‌محض این‌که داده‌ها در دسترس قرار گرفتند، با محتوای واقعی جایگزین گردد.

۴) رویدادهای اتفاقی یا Triggered events

• نوتیفیکیشن‌ها / Indicatorها

یک نوتیفیکیشن اثربخش هدفش این است که توجه کاربر را به یک رویداد جدید جلب کند. پیشنهاد می‌شود که در این‌جا از انیمیشن‌هایی خاص استفاده شود تا به جلب توجه کاربر کمک کند.

پس می‌بایست با توجه به اصل Visibility of system status هر اکشن کاربر در یک تایم منطقی با Visual feedback مناسب خود بازخورد داده شود تا بتوان تجربه کاربری اثربخشی را برای کاربر رقم زد.

منابع

https://uxplanet.org/4-ways-to-communicate-the-visibility-of-system-status-in-ui-14ff2351c8e8