منبع: بنیاد طراحی تعامل (IxDF) · بازنویسی آزاد: سپنتا پویا · ترجمه: ۶ شهریور ۱۴۰۵ · زمان مطالعه: حدود ۱۲ دقیقه

ادراک (Perception) چیست؟

💡 این متن «بازنویسی آزاد» است: ایده‌ها و مفاهیم مطلب اصلی با نگارش کاملاً مستقل فارسی و مثال‌های تازه بازگو شده‌اند و ترجمهٔ کلمه‌به‌کلمه نیست. بخش‌های افزودهٔ مترجم در جعبهٔ منبع مشخص شده‌اند.

چشم شما همین حالا میلیون‌ها نقطهٔ نور را می‌گیرد. چیزی که «می‌بینید» اما یک صفحه است، با دکمه‌ای که می‌شود فشارش داد. فاصلهٔ آن نقطه‌ها تا این دکمه، همان چیزی است که اسمش ادراک است.

تعریف

ادراک، تفسیر اطلاعات حسی برای ساختن یک بازنمایی ذهنی از جهان است.

پس ادراک با احساس یکی نیست. احساس یعنی رسیدن سیگنال. ادراک یعنی معنایی که مغز به آن سیگنال می‌دهد.

سه چیز این تفسیر را شکل می‌دهند: تجربهٔ گذشته، انتظار و توجه. ادراک بین آدم‌ها یکسان نیست، و به همین دلیل دو کاربر روبه‌روی یک صفحه دو چیز متفاوت می‌بینند.

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

اندام‌های حس و چیزی که به مغز می‌رسد

مسیر از بیرون تا مغز در همهٔ حس‌ها یک شکل دارد. اندام حسی، محرک محیطی را به سیگنال الکتریکی تبدیل می‌کند و مغز روی همان سیگنال کار می‌کند، نه روی خود جهان.

• - چشم: امواج نور را می‌گیرد و دیدن رنگ و شکل را ممکن می‌کند.
• - گوش: صدا را می‌گیرد و فهم گفتار را ممکن می‌کند.
• - پوست: لمس را می‌گیرد.
• - زبان: مزه را می‌گیرد.
• - بینی: بو را می‌گیرد.

در یک رابط دیجیتال عملاً دو تای اول کار می‌کنند و سومی گاهی، از راه بازخورد لمسی گوشی. یعنی کل تجربه روی باریک‌ترین بخش دستگاه حسی سوار می‌شود.

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

حسی که اسمش را کمتر شنیده‌اید

پروپریوسپشن، حسِ جای بدن است. این حس به شما می‌گوید اندام‌هایتان کجا هستند، چطور حرکت می‌کنند و به کدام سو رو دارند، بدون آنکه نگاهشان کنید یا صدایشان را بشنوید.

نمونه‌هایش کاملاً روزمره‌اند: راه‌رفتن بدون نگاه به پا، تایپ‌کردن بدون نگاه به دست، دست‌دراز‌کردن به سمت چیزی که نمی‌بینید، ایستادن روی یک پا، و حفظ تعادل روی صندلی لق یا داخل اتوبوس.

برای رابط لمسی این حس مستقیماً مهم است. کاربری که بدون نگاه‌کردن شست خود را به گوشهٔ پایین صفحه می‌رساند، دارد از همین حس استفاده می‌کند.

هر بار که جای یک دکمهٔ پرکاربرد را جابه‌جا می‌کنید، همین حافظهٔ حرکتی را باطل می‌کنید. کاربر مجبور می‌شود دوباره نگاه کند، و نگاه‌کردن از رسیدنِ کور کندتر است.

از شبکیه تا معنا

در شبکیه دو نوع گیرنده کار می‌کنند و کارشان یکی نیست.

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

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

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

بعد نوبت قشر بینایی می‌رسد، و آنجا کار بین چند ناحیه تقسیم می‌شود.

• - ناحیهٔ V1: جای شیء در فضا را حساب می‌کند، نقشهٔ دوبعدی می‌سازد و با مقایسهٔ تصویر دو چشم، عمق را اضافه می‌کند.
• - ناحیهٔ V2: رنگ را می‌سازد، رنگ خود شیء را از رنگ نور محیط جدا می‌کند و نتیجه را با انتظار حافظه می‌سنجد.
• - نواحی V3 و V4: بازشناسی چهره و شیء کار این دو است، و خطاهای بینایی هم همین‌جا شکل می‌گیرند.

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

ظرفیت این دستگاه هم بی‌نهایت نیست. حجم داده‌ای که وارد می‌شود از توان پردازش بیشتر است، پس بخش زیادی از کار مغز حذف‌کردن است، نه دیدن.

وقتی چشم اشتباه می‌کند

خطای بینایی نقص چشم نیست. نتیجهٔ همان تفسیری است که در حالت عادی درست کار می‌کند.

خطای مولر-لایر. دو خط دقیقاً هم‌اندازه، وقتی در دو سرشان پیکان اضافه شود، نابرابر دیده می‌شوند. مغز پیکان‌ها را نشانهٔ عمق می‌خواند و طول را بر همان اساس تصحیح می‌کند.

خطای پونزو. دو شیء کاملاً یکسان روی دو خط همگرا گذاشته می‌شوند و یکی بزرگ‌تر به‌نظر می‌رسد. همگرایی نشانهٔ فاصله است، پس مغز شیء دورتر را بزرگ‌تر حساب می‌کند.

هر دو یک درس دارند. بافت اطراف، خودِ چیز را عوض می‌کند.

در رابط هم همین اتفاق می‌افتد. یک دکمهٔ خاکستری کنار یک دکمهٔ پررنگ، غیرفعال به‌نظر می‌رسد حتی وقتی فعال است. هیچ‌کس آن دکمه را «غیرفعال» طراحی نکرده؛ همسایه‌اش این معنا را ساخته.

فرهنگ و حافظه، دو فیلتری که همیشه روشن‌اند

دو فیلتر دیگر هم بین سیگنال و معنا نشسته‌اند و هیچ‌کدام در فایل طراحی دیده نمی‌شوند.

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

حتی مرزبندی رنگ‌ها هم جهانی نیست. بعضی زبان‌ها برای آبی و سبز دو واژهٔ جدا ندارند و هر دو را با یک کلمه می‌نامند.

حافظه. تجربهٔ گذشته تعیین می‌کند کاربر به کجا نگاه کند و چه انتظاری داشته باشد. اصطلاح فنی‌اش «ویژگی رمزگذاری» است: حافظه وقتی راحت‌تر بازیابی می‌شود که شرایط لحظهٔ یادآوری با شرایط لحظهٔ ثبت بخواند.

برای طراح، این یعنی ثبات خودش یک ویژگی است. اگر کاربر مسیری را در یک چیدمان یاد گرفته باشد و شما در نسخهٔ بعد آن چیدمان را عوض کنید، بازیابی سخت‌تر می‌شود. مدل ذهنی کاربر از همین رسوب ساخته می‌شود، و حافظهٔ انسان ابزار نگهداری‌اش است.

ادراک در طراحی رابط

کاربرد عملی همهٔ این‌ها در یک جمله جا می‌شود: توجه محدود است، پس باید هدایتش کنید.

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

لایهٔ بعدی اصول گشتالت است. قانون مجاورت می‌گوید عناصر نزدیک به هم یک گروه دیده می‌شوند، و قانون شباهت می‌گوید عناصر هم‌شکل به هم تعلق دارند.

این قانون‌ها را اینجا باز نمی‌کنم، چون هرکدام صفحهٔ خودشان را دارند. چیزی که به این بحث مربوط است رابطهٔ آن‌هاست با بار شناختی: گروه‌بندی درست، کار مغز را کم می‌کند و همان کاهش، حس «آسان بودن» را می‌سازد.

یک محدودیت هم هست که باید صریح گفته شود. ادراک بصری برای همه یکسان نیست.

فشار بصری یکی از این موارد است. الگوهای راه‌راه در بسامد حدود سه چرخه بر درجه، همراه با چشمک‌زدن نزدیک بیست هرتز، می‌توانند تشنج ایجاد کنند. در ۱۹۹۷ یک برنامهٔ تلویزیونی ژاپنی همین اتفاق را برای بیش از ۷۰۰ کودک ساخت.

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

سه چیزی که در دست شماست و سه چیزی که نیست

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

در دست شماست: اینکه چشم اول کجا برود، اینکه مرز گروه‌ها کجا باشد، و اینکه تفاوت میان دو عنصر چقدر بزرگ باشد.

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

در دست شما نیست: تجربهٔ قبلی کاربر، بار فرهنگی رنگ‌ها، و توانایی حسی او.

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

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

خطایی که خودِ طراح مرتکب می‌شود

این هم افزودهٔ من است و به نظرم مهم‌ترین پیامد عملی کل بحث.

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

جمله‌ای که برای شما «کاملاً واضح» است، برای شما واضح است چون معنایش را از قبل می‌دانید. آیکونی که «معلوم است چه کار می‌کند»، برای شما معلوم است.

این همان چیزی است که تیم‌ها را به بحث‌های بی‌پایان سلیقه‌ای می‌کشاند. دو طراح که هر دو صفحه را حفظ‌اند، دربارهٔ ادراکِ کسی حرف می‌زنند که هیچ‌کدامشان نیستند.

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

چطور ادراک را می‌سنجید

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

• - آزمون پنج‌ثانیه‌ای: صفحه را پنج ثانیه نشان می‌دهید و بعد می‌پرسید چه چیزی یادش مانده.
• - آزمون اولین کلیک: یک هدف می‌دهید و می‌بینید اولین کلیک کجا می‌نشیند.
• - آزمون کاربردپذیری با صدای بلند: کاربر حین کار حرف می‌زند و شکاف میان انتظار و واقعیت شنیده می‌شود.
• - نقشهٔ حرارتی و ردیابی چشم: نشان می‌دهد نگاه واقعاً کجا رفته، نه کجا تصور می‌کنید رفته.

خروجی همهٔ این آزمون‌ها در سه پرسش جمع می‌شود. آیا روشن بود؟ آیا آسان بود؟ چه حسی داشت؟

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

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

در بافت فارسی

یک: نقطهٔ ورود چشم، سمت راست است. در چیدمان راست‌به‌چپ، اولین چیزی که دیده می‌شود بالای سمت راست است، نه گوشهٔ چپ.

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

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

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

در وزن نازک و اندازهٔ کوچک، همین جزئیات زودتر از حروف لاتین محو می‌شوند. یعنی حداقلی که برای یک نمونهٔ انگلیسی کافی بود، برای فارسی لزوماً کافی نیست.

آزمونش هم ساده است. همان صفحه را با محتوای فارسی روی گوشی و زیر نور روز نگاه کنید، نه روی نمایشگر بزرگ اتاق تاریک.

سه: آیکون وارداتی، مدل ذهنی وارداتی نمی‌آورد. سبد خرید و چرخ‌دنده جهانی شده‌اند و کسی در معنایشان نمی‌ماند.

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

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

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

جمع‌بندی

• - ادراک: تفسیر اطلاعات حسی برای ساختن بازنمایی ذهنی از جهان
• - شکل‌دهنده‌ها: تجربهٔ گذشته · انتظار · توجه — و تفاوت فردی
• - اندام‌های حس: چشم · گوش · پوست · زبان · بینی، که محرک را به سیگنال الکتریکی تبدیل می‌کنند
• - پروپریوسپشن: حسِ جای بدن، بدون نگاه و صدا — همان چیزی که رسیدن کور به یک دکمه را ممکن می‌کند
• - شبکیه: میله‌ها در حاشیه برای نور کم · مخروط‌ها در فوویا برای جزئیات و رنگ
• - قشر بینایی: V1 جای شیء و عمق · V2 رنگ و ثبات آن · V3 و V4 بازشناسی چهره و شیء
• - خطاها: مولر-لایر و پونزو — بافت اطراف، خودِ چیز را عوض می‌کند
• - فرهنگ: تماس چشمی · ابراز احساس · مرزبندی رنگ‌ها، هیچ‌کدام جهانی نیستند
• - حافظه: ویژگی رمزگذاری، پس ثبات چیدمان خودش یک ویژگی است
• - در طراحی: کنتراست · تایپوگرافی · سلسله‌مراتب بصری، و بعد اصول گشتالت
• - محدودیت‌ها: فشار بصری از الگوی راه‌راه پرچشمک · کوررنگی در یک از هر دوازده مرد و یک از هر دویست زن
• - در دست شماست: نقطهٔ ورود چشم · مرز گروه‌ها · اندازهٔ تفاوت
• - در دست شما نیست: تجربهٔ قبلی · بار فرهنگی رنگ · توانایی حسی — پس معنا را به یک کانال نسپارید
• - خطای طراح: صفحه‌ای را که حفظ است، نمی‌تواند مثل بار اول ببیند
• - سنجش: آزمون پنج‌ثانیه‌ای · اولین کلیک · صدای بلند · نقشهٔ حرارتی و ردیابی چشم
• - و در فارسی: ورود چشم از راست است · کنتراست را روی متن فارسی بسنجید · آیکون وارداتی مدل ذهنی نمی‌آورد · و آزمون را با محتوای واقعی بگیرید