خلاصه: جیکوب نیلسون 10 اصل کلی برای Interaction Desgin تحت نام Heuristics معرفی کرد که با اصطلاحات Heuristic Evaluation و Heuristic Analysis هم شناخته میشود.
یکی از اولین تکالیف مهم دانشجویان دورههای جامع طراحی تجربه و رابط کاربری (UI/UX)، انجام Heuristic Analytics بر روی رقبای داخلی و نمونههای خارجی است که این مقاله به صورت مختصر به تعریف این 10 اصل میپردازد.
سیستم همیشه باید کاربر را مطلع کند که در حال حاضر چه چیزی در جریان است، الان کاربر کجاست، به طور واضح چه مشکلی پیش آمده، چقدر از مسیر را آمده و حدودا چقدر باقیمانده تا کاربر به هدف خود برسد.
در مقالهی نمایش وضعیت سیستم در رابط کاربری (Visibility of system status) میتوانید در این مورد بیشتر بخوانید.
سیستم باید با زبان کاربر صحبت کند. با کلمات و مفاهیمی که کاربر با آنها آشناست. از آیتمهای رایج استفاده کند. اطلاعات را به نحوی ارائه کند که با Mental Model افراد همخوانی داشته باشد. از آیکونها و تصاویری استفاده کند که تا حد امکان شبیه اشیا دنیای واقعی باشد.
مانند تصویر بالا که از Fortune Wheel که در کازینوها میتوان دید الهام گرفته است و آیکون سطل آشغال که شبیه سطل زباله در دنیای واقعی است. هر چقدر اشکال در سایت/اپلیکیشن شبیه دنیای واقعی باشد آموزش و توضیحات کمتری برای نمایش عملکرد آنها نیاز است.
به نظر من مهمترین المان در طراحی تعاملی (Interaction design) توجه به هماهنگی هر چه بیشتر با جهان واقعی است. اینکه در طراحی انیمیشن گفته میشود حتما به easy-in easy-out دقت کنید بر گرفته از حرکت اجسام در دنیای واقعی است که حس بهتری به کاربر منتقل میکند.
این اصل به این موضوع اشاره میکند که کاربر ممکن است سهوا اقدامی انجام دهد که مشکل آفرین شود. سیستم میبایست تا حد امکان امکان Undo داشته باشد. مثل امکان بازگشت ایمیل حذف شده تا چند ثانیه بعد از حذف و یا برگشت به مرحله قبل در خرید برای اصلاح سبد خرید و یا آدرس تحویل و یا اصلاح شماره موبایل در صفحهی انتظار دریافت رمز پیامکی.
حتی امکان بازگشت کالا در خریدهای آنلاین هم به این موضوع اشاره دارد.
به مرور در ذهن افراد برای استفاده از سایت/اپلیکیشنها چاچوبهای شکل گرفته است که بهتر است رعایت شود. مثلا آیکون مداد همیشه نشانه Edit بوده است و بهتر است از آن برای اضافه کردن محتوای جدید استفاده نشود. همچنین این اصل به این موضوع هم اشاره دارد که تا جای ممکن طراحی هماهنگی داشته باشد.
به عنوان مثال در یک قسمت از آیکونهای تک رنگ استفاده نشده باشد و در قسمت دیگری آیکونهای رنگی و یا در طراحی از پیش از یک فونت استفاده نشود.
این موضوع فقط محدود به رابط کاربری نمیشود و به تجربه کاربری هم مربوط است. به عنوان مثال اپلیکیشن تپسی در تمام اپلیکیشن واحد پولی آن تومان است اما در صفحهی شارژ اعتبار واحد تبدیل به ریال میشود که این بر خلاف Consistency است.
به نظر شما چرا این موضوع رعایت نشده است؟
توی این ویدئوی یوتیوب در موردش توضیح دادم.
فراتر از نمایش درست پیامهای خطا، تا حد امکان حتی اجازه ندهید خطا اصلا رخ دهد. به عنوان مثال در تصویر بالا به جای آنکه اجازه دهیم کاربر پسورد مورد نظر خود را وارد کند و پس از کلیک بر گزینهی ثبتنام، خطای احتمالی مربوط به رمز عبود را نشان دهیم مشابه این تصویر در هنگام تایپ آن را نمایش دهیم.
در مقالهی چک لیست طراحی فرم ثبتنام من باب اصول طراحی فیلد رمز عبور توضیحات تکمیلی ارائه کردهام.
در کامنتهای یوتیوب و اینستاگرام میتونین مثالهای خوبی از این موضوع رو ببینین.
در مقالهی کوتاه در مورد Recognition Over Recall در این مورد صحبت کردم. به صورت خلاصه میبایست با اقدامات، اشکال، تصاویر و نوشتهها به کاربران سرنخهای را منتقل کنیم که مطابق تصویر بالا به جای استفاده از حافظه، تنها با دیدن و تشخیص دادن به هدف خود برسند.
رفتار کاربرهای تازه وارد معمولا با کاربران قدیمی متفاوت است. کابرهای تازه وارد معمولا با ذهنیت قبلی از رفتار و معانی آیتمها وارد سایت میشوند اما کاربران حرفهای که مدت زیادی است از سایت و اپلیکیشن شما استفاده میکنند انتظار میانبرها و راههای دسترسی سادهتر و خلاقانهتر هستند.
از طرفی بعضی کاربرها از پیشفرضها راضی هستند و معمولا اقدام به تغییر آن نمیکنند. اگر جز افرادی هستید که اصلا موسیقی زنگ و آلارم خود را تغییر نمیدهید یا آیکونهای موبایل خود را بازچینش نمیکنید احتمالا جز این دستهاید اما بعضی افراد به شخصی سازی علاقه بسیاری دارند.
سیستم باید برای این افراد هم راهکاری داشته باشد. از چیزهای سادهی مثل تغییر آواتار گرفته تا نمایش دادن یک ویژگی پیشرفته در منوی اصلی و یا میانبرها برای دسترسی سریعتر.
توی این ویدئوی یوتیوب بیشتر در موردش توضیح دادم.
در مورد تاثیر زیبایی بر تجربهی کاربری زیاد صحبت شده است. کمینهگرایی باعث میشود در انتخاب محتوا دقیقتر شویم و هر چیز اضافهای را کم کنیم. جملهای که با 10 کلمه میتواند مفهوم را برساند نباید 12 کلمه داشته باشد. از تاثیر فضای سفید در طراحی نیز غافل نشوید.
خطاهای نمایش داده شده حتما میبایست به زبان کاربر (نه زبان کامپیوتر) باشد، دقیقا دلیل رخداد آن را نمایش دهد و راهکاری سازنده برای رفع آن را معرفی کند.
به این مدل آنالیز به دید یک چک لیست نگاه کنید که کمک میکند یک وبسایت/اپلیکیشن را از تمامی زوایا بررسی کنید و قسمتی جا نماند. در نتیجه اگر مورد مهمی پیدا کردید که مطمئن نبودید جز کدام قسمت این لیست است، در هر کجا که احساس میکنید درستتر است قرار دهید. مهم این است که آن را کشف کرده باشید.
هرچند که خیلی بهتر است که سایت/اپلیکیشن نیازی به مستندات نداشته باشد، اما در مورد ایدههای جدید و یا پیچیده نیاز به مستندات آموزشی بسیار حس میشود و میتواند به نرخ تبدیل کمک کند.
مشابه تصویر بالا ویژگیها را نمایش دهید. وظایف سنگین را به وظایف کوچکتر خرد کنید و مرحله به مرحله آنها را آموزش دهید تا کاربر Cognitive Cost کمتری احساس کند.
در این مدل تحلیل رقبا برای هر اصل نمرهای در نظر گرفته میشود و پیشنهاداتی برای بهبود آن مطرح میشود. بدیهی است که سایت/اپلیکیشنی که در تمامی این موارد نمرهی کامل بگیرد ایدهآل آن موضوع است و بهتر است از آن تا حد امکان در طراحی استفاده کرد.
البته در این الهامبرداری بهتر است نگاهی هم به مقالهی چه پترنهایی در زبان فارسی قرینه میشوند؟ داشته باشیم.
خوب است بدانید که رویکرد تحلیلی دیگری با نام هشت قانون طلایی شیندرمن (Shneiderman’s Eight Golden Rules) وجود دارد که همپوشانی بسیار زیادی با ارزیابی اکتشافی دارد.
از این دست کوتاه مقالهها: