امیر تقی آبادی
امیر تقی آبادی
خواندن ۶ دقیقه·۵ سال پیش

کوتاه در مورد Heuristic Evaluation

خلاصه: جیکوب نیلسون 10 اصل کلی برای Interaction Desgin تحت نام Heuristics معرفی کرد که با اصطلاحات Heuristic Evaluation و Heuristic Analysis هم شناخته می‌شود.

یکی از اولین تکالیف مهم دانشجویان دوره‌های جامع طراحی تجربه و رابط کاربری (UI/UX)، انجام Heuristic Analytics بر روی رقبای داخلی و نمونه‌های خارجی است که این مقاله به صورت مختصر به تعریف این 10 اصل می‌پردازد.


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


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


https://twitter.com/amirtaqiabadi/status/1371371419595063296?s=20


در مقاله‌ی نمایش وضعیت سیستم در رابط کاربری (Visibility of system status) می‌توانید در این مورد بیشتر بخوانید.

https://www.youtube.com/watch?v=jm4SDz6h2Ts


هماهنگی سیستم با جهان واقعی - Match between system and the real world

neilpatel برگرفته شده از وبسایت
neilpatel برگرفته شده از وبسایت

سیستم باید با زبان کاربر صحبت کند. با کلمات و مفاهیمی که کاربر با آنها آشناست. از آیتم‌های رایج استفاده کند. اطلاعات را به نحوی ارائه کند که با Mental Model افراد هم‌خوانی داشته باشد. از آیکون‌ها و تصاویری استفاده کند که تا حد امکان شبیه اشیا دنیای واقعی باشد.

مانند تصویر بالا که از Fortune Wheel که در کازینوها می‌توان دید الهام گرفته است و آیکون‌ سطل آشغال که شبیه سطل زباله در دنیای واقعی است. هر چقدر اشکال در سایت/اپلیکیشن شبیه دنیای واقعی باشد آموزش و توضیحات کمتری برای نمایش عملکرد آنها نیاز است.

به نظر من مهمترین المان در طراحی تعاملی (Interaction design) توجه به هماهنگی هر چه بیشتر با جهان واقعی است. اینکه در طراحی انیمیشن گفته می‌شود حتما به easy-in easy-out دقت کنید بر گرفته از حرکت اجسام در دنیای واقعی است که حس بهتری به کاربر منتقل می‌کند.

https://virgool.io/ux-unicorn/natural-mapping-%DA%86%DB%8C%D8%B3%D8%AA-y3z5w1ighwk0



نظارت و آزادی عمل کاربر - User control and freedom

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

حتی امکان بازگشت کالا در خریدهای آنلاین هم به این موضوع اشاره دارد.

https://youtu.be/kCqaQvFFLX4


هماهنگی و رعایت استاندرادها - Consistency and standards

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

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

تپسی
تپسی

این موضوع فقط محدود به رابط کاربری نمی‌شود و به تجربه کاربری هم مربوط است. به عنوان مثال اپلیکیشن تپسی در تمام اپلیکیشن واحد پولی آن تومان است اما در صفحه‌ی شارژ اعتبار واحد تبدیل به ریال می‌شود که این بر خلاف Consistency است.


به نظر شما چرا این موضوع رعایت نشده است؟


توی این ویدئوی یوتیوب در موردش توضیح دادم.

https://youtu.be/qLHKkDLQrD4



پیشگیری از خطا - Error prevention


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


ثبت نام سایت ابرآروان
ثبت نام سایت ابرآروان


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


https://youtu.be/qG107K-_OEw

در کامنت‌‌های یوتیوب و اینستاگرام می‌تونین مثال‌های خوبی از این موضوع رو ببینین.


تشخیص به جای یادآوری - Recognition rather than recall

در مقاله‌ی کوتاه در مورد Recognition Over Recall در این مورد صحبت کردم. به صورت خلاصه می‌بایست با اقدامات، اشکال، تصاویر و نوشته‌ها به کاربران سرنخ‌های را منتقل کنیم که مطابق تصویر بالا به جای استفاده از حافظه، تنها با دیدن و تشخیص دادن به هدف خود برسند.


انعطاف و بهروری کاربر - Flexibility and efficiency of use

رفتار کاربرهای تازه وارد معمولا با کاربران قدیمی متفاوت است. کابرهای تازه وارد معمولا با ذهنیت قبلی از رفتار و معانی آیتم‌ها وارد سایت می‌شوند اما کاربران حرفه‌ای که مدت زیادی است از سایت و اپلیکیشن شما استفاده می‌کنند انتظار میانبرها و راه‌های دسترسی ساده‌تر و خلاقانه‌تر هستند.

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

سیستم باید برای این افراد هم راهکاری داشته باشد. از چیزهای ساده‌ی مثل تغییر آواتار گرفته تا نمایش دادن یک ویژگی پیشرفته در منوی اصلی و یا میانبرها برای دسترسی سریعتر.


توی این ویدئوی یوتیوب بیشتر در موردش توضیح دادم.

https://youtu.be/cg2Q2EXa29E



زیبایی و کمینه‌گرایی - Aesthetic and minimalist design

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


شفافیت در بیان خطا و ارائه‌ی راه‌حل - Help users recognize, diagnose, and recover from errors

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

به این مدل آنالیز به دید یک چک لیست نگاه کنید که کمک می‌کند یک وبسایت/اپلیکیشن را از تمامی زوایا بررسی کنید و قسمتی جا نماند. در نتیجه اگر مورد مهمی پیدا کردید که مطمئن نبودید جز کدام قسمت این لیست است، در هر کجا که احساس می‌کنید درست‌تر است قرار دهید. مهم این است که آن را کشف کرده باشید.


راهنمایی و استناد دهی - Help and documentation

هرچند که خیلی بهتر است که سایت/اپلیکیشن نیازی به مستندات نداشته باشد، اما در مورد ایده‌های جدید و یا پیچیده نیاز به مستندات آموزشی بسیار حس می‌شود و می‌تواند به نرخ تبدیل کمک کند.

مشابه تصویر بالا ویژگی‌ها را نمایش دهید. وظایف سنگین را به وظایف کوچکتر خرد کنید و مرحله به مرحله آن‌ها را آموزش دهید تا کاربر Cognitive Cost کمتری احساس کند.


https://youtu.be/Mtz-azZI_es





در این مدل تحلیل رقبا برای هر اصل نمره‌ای در نظر گرفته می‌شود و پیشنهاداتی برای بهبود آن مطرح می‌شود. بدیهی است که سایت/اپلیکیشنی که در تمامی این موارد نمره‌ی کامل بگیرد ایده‌آل آن موضوع است و بهتر است از آن تا حد امکان در طراحی استفاده کرد.

البته در این الهام‌برداری بهتر است نگاهی هم به مقاله‌ی چه پترن‌هایی در زبان فارسی قرینه می‌شوند؟ داشته باشیم.

خوب است بدانید که رویکرد تحلیلی دیگری با نام هشت قانون طلایی شیندرمن (Shneiderman’s Eight Golden Rules) وجود دارد که همپوشانی بسیار زیادی با ارزیابی اکتشافی دارد.



از این دست کوتاه مقاله‌ها:

Heuristic analysisآزمون اکتشافیطراحی تجربه کاربرینمایش پیغام خطاux
راوی تجربه کاربری در #ویرگول و مدرس در #یوتیوب https://www.youtube.com/c/AmirTaqiabadi
شاید از این پست‌ها خوشتان بیاید