راوی تجربه کاربری در #ویرگول و مدرس در #یوتیوب https://www.youtube.com/c/AmirTaqiabadi
دستهی آیکن جستجو راست باشه یا چپ؟
شاید در نگاه اول سوال بیاهمیتی باشه و واقعا هم هست. اما وقتی روی یه موضوع بیاهمیت هم زیادی حساس بشی ممکنه به درکی برسی که یه جای دیگه به دردت بخوره.
مدتی قبل توی اینستا یه نظرسنجی گذاشتم که کدوم یکی رو ترجیح میدین و چرا؟
همینطور که از نتایج معلومه اینکه دسته سمت راست باشه اقبال بیشتری داره و جواب افراد به سوال چرا هم به هم نزدیک بود.
عموم معتقد بودن چون ما اکثرا راست دستیم و وقتی تو تصوارتمون یه ذرهبین رو تو دست میگیریم با دست راست اون رو نگه میداریم، برای همین برامون خوشایندتره که دستهی ذرهبین رو سمت راست ببینیم.
همینطور که اگر magnifying hand رو جستجوی تصویری کنین میبینین که عمدهی عکسها ذرهبین توی دست راسته.
اما این موضوع چرا مهمه؟
چون من رو به سمت مفهومی تحت عنوان Natural mapping هدایت میکنه. برای اینکه این موضوع رو درک کنیم لازمه قبلش Mapping رو درک کنیم. توضیح Mapping یا نگاشت یه مقدار سخته و برای توضیحش لازمه از مثال نقشه استفاده کنم.
توی نقشه اینجوریه که به ازای هر نقطهای توی نقشه یه ما به ازایی توی دنیای واقعی وجود داره و در حقیقت نقشه کوچک شدهی دنیای واقعیه. مپینگ هم از نظر ریاضی یه چنین تعریفی داره:
در ریاضیات اگر به ازای هریک از اعضای یک مجموعه، تنها یک عضو در مجموعه ای دیگر وجود داشته باشد میگوییم نگاشتی از مجموعه اول به مجموعه دوم وجود دارد. به عبارت دیگر به ازای هر عنصر x در یک مجموعه تنها یک عنصر به نام (f(x در مجموعهای دیگر وجود دارد. - نگاشت
نگاشت طبیعی (Natural mapping) یعنی اینکه کنترلها و اطلاعات از نظر بصری با اون شی مرتبط باشه. میدونم سخته درکش. اجازه بدین با چند تا مثال توضیح بدم.
فرض کنین این دو تا کلید کنار هم رو داریم که کلید سمت راستی لامپ سمت چپ رو روشن میکنه و برعکس. بدیهیه که این موضوع خیلی رو اعصابه و کاربر رو همیشه اذیت میکنه. چون کاربر بین کلید و لامپ انتظار یه ارتباط نظیر به نظیر مستقمی داره که الان برآورده نشده.
با این توضیح اجازه بدین تصویر اول مقاله رو دوباره بررسی کنیم.
اینجا اگر گزینهها برعکس بود (یعنی سمت راست نوشته شده بود چپیه و سمت چپ نوشته شده بود راستیه) کاربر اون احساس ناخوشایند رو داشت. هرچند که هنوز هم داره. گزینه بهتر این بود که کلا آیکنها برعکس میبود یعنی اونی که دستش سمت راسته رو راست تصویر قرار میدادم. اینجوری ارتباط بیشتری بین اطلاعات و شی و کنترل (دکمه نظرسنجی) رخ میداد.
در حقیقت فرض من اینه که این ۳۴ درصد که به گزینه سمت چپی رای دادن درصد قابل توجهیشون مرتکب این اشتباه شدن و فکر کردن این راستیه و چپیه به دسته اشاره داره و نه تصویر و اگر بر این اساس سوال میشد نتیجه خیلی به درصد چپ دستها در جامعه نزدیکتر میشد.
یا نگاهی بندازیم به مثال نخ نمای این تعریف، یعنی اجاق گاز. نمیدونم تا الان تجربهی کار کردن با اجاغگاز جدید رو داشتین یا نه؟ بعضی گازها هستن که در اولین مواجهه نمیدونی کدوم دسته برای کدوم مشعله.
در این مثال، تصویر سمت چپ این ضعف رو داره. چون شکل مشعلها مربعه و شکل قرارگیری دستهها خطی، مرتبط کردن نظیر به نظیر اینها همیشه توان ذهنی بیشتری از مغر میکشه تا کاربر متوجهش بشه. اما در تصویر سمت راست چون محل قرارگیری دستهها متناسب با شعلههاست این پردازش ذهنی تا حد خیلی خوبی کم شده.
شاید شما هم مثل یکی از دوستان من معتقد باشین که کاملا مشخصه که کدوم به کدومه اما برای خود من هر سری که بعد مدتها میام خونه و میخوام اجاغ گازی که ۵ تا شعله داره رو با این دستگیرهها روشن کنم به مشکل میخورم. اول اینکه چون قدیمیه تصویر کنار دستگیرهها کمرنگ شده و از این زاویه هم مشخص نیست. دوم اینکه تو نگاه اول ۶ تا دستگیره شبیه به همه با ۵ تا شعله. سوم هم اینکه چیدمان شعلهها ۲-۱-۲ اما دستگیرهها خطی.
یا میتونیم به جهت چرخش فرمون با جهت حرکت ماشین یا مدل کنترل دستهی راهنما و چراغ ماشین توجه کنیم و این ارتباط کنترلر با شی رو درک کنیم.
در مثال آیکن جستجو هم این کنترلر (دسته) با دست راست گرفته میشه و به مرکز صورت میاد برای همین بهتره که حتما از آیکن با دسته سمت راست استفاده کنیم.
اگر اصل دوم Heuristic Evaluation یعنی هماهنگی سیستم با جهان واقعی رو یادتون باشه، اونجا گفتم که طراحی ما هرچقدر بیشتر شبیه دنیای واقعی باشه کاربر راحتتر با طراحی ما ارتباط میگیره.
از طرفی اگر Search icon رو گوگل کنین میبینین که عمدهی دسته ذرهبین آیکنها سمته راسته.
احتمالا اولین نفری که آیکن ذرهبین رو برای جستجو طراحی کرده این تفکرات توی ذهنش بوده و پس از اون به دلیل Mental Model و Jakob’s Law، همه همین مدلی ازش استفاده کردن و الان هم بهتره همین رویه رو ادامه بدین قرینهاش نکنین.
کاربران بیشتر زمان خود را در سایتهای دیگران میگذرانند در نتیجه ترجیح میدهند به همان روشی که تعامل با دیگر سایتها را آموختهاند با سایت شما هم کار کنند و مجددا نیاز به یادگیری نباشد. - قانون جیکوب
نکتهی آخری که باقی میمونه قرینه شدن این آیکن به دلیل زبان راست به چپ فارسیه. قبلا در مقالهی چه پترنهایی در زبان فارسی قرینه میشوند؟ و دکمه اصلی سمت راست باشه یا چپ؟ دلایل خودمو برای قرینه نکردن خیلی چیزها گفتم. در اینجا هم تمامی نکاتی که مطرح کردم جهان شمول بود و معطوف به یک زبان خاص نبود. در نتیجه به نظرم بهتره که در زبان فارسی هم از همین ترکیب استفاده کنین و همین رویکرد تصمیمگیری رو برای سایر آیکنهایی که طراحی یا استفاده میکنین در نظر بگیرین.
اگر این مقاله براتون جذاب بوده فراموش نکنین که با منتشر کردنش هم منو علاقهمند به ادامه میکنین و هم دوستانتون شما رو به عنوان منبع دانش روز به یاد خواهند آورد.
مطلبی دیگر از این انتشارات
دوره رایگان آموزش طراحی بصری - قسمت اول: مرور کلی
مطلبی دیگر از این انتشارات
Best Practices برای طراحی اپ موبایل
مطلبی دیگر از این انتشارات
راهنمای انجام تست چریکی یا Guerilla Usability Test