شیما تیموری
شیما تیموری
خواندن ۱۱ دقیقه·۱۰ ماه پیش

20 قانون UX (تجربه کاربری) به زبون خودمونی

تجربه کاربری (User Experience) یعنی مجموعه‌ای از رفتارها، احساسات و نگرش‌های کاربر به محصول. یه سری قانون توی UX هست که اسمای عجیبی دارن که معمولا برمی‌گردن به اسم روانشناسا و افرادی که اونارو درست کردن: جیکوب، هیک، فیتس، و … . این قوانین توی حوزه‌های مختلف به خصوص طراحی محصول، سایت و ... خیلی کمکمون می‌کنن. البته پیوندهایی هم با سئو، پرفورمنس و حتی محتوا هم دارن. البته اگه باهوش باشیم و نکته‌سنج. من می‌خوام اولین محتوای آموزشیم در ویرگول رو به UX Laws اختصاص بدم.

از اونجایی که بنده چند صباحیست که در وادی UX غرق شدم و کمتر به Performance Marketing می‌پردازم، تصمیم گرفتم که آموزه‌های خودمو در قالب یادداشت‌هایی کوتاه و محتواهای بلند منتشر کنم. از این کار دو تا هدف دارم: بازآموزی و یادگیری بهتر خودم، آموزش و کمک به دیگران.

در UX باید رفتار کاربر رو پیشبینی کنیم و براش بهترین حس رو رقم بزنیم
در UX باید رفتار کاربر رو پیشبینی کنیم و براش بهترین حس رو رقم بزنیم


برای محتوای اولم در UX سراغ قوانین UX رفتم. توی این محتوا، 20 قانون UX رو انتخاب کردم که در طراحی رابط و تجربه کاربری باید بهشون توجه کنیم.

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

قبل از اینکه شروع کنم، اینو باید بگم که بعضی از اصطلاحات رو ترجمه نکردم و همونجوری انگلیسی یا تلفظ انگیسی به فارسیشو نوشتم. معتقدم که یه دیجیتال مارکتر یا UX دیزاینر توی دنیای امروزی دیگه سراغ ترجمه‌های درب و داغون و تحت الفظی نمیره و بهتره که اصطلاحات اصلی رو بلد باشیم تا زبان مشترک داشته باشیم. هرجایی هم که نیاز شد، یه توضیح کوتاهی درباره واژه یا عبارت میدم.
راستی، بعضی جا، نیم‌فاصله رو رعایت نکردم که به خاطر تنبلی بوده :دی

خب حالا بریم شروع کنیم:

1- قانون جیکوب (Jackob's law)

قانون جیکوب می‌گه: یوزر (user) یا کاربر در مواجه با یه محصول (سایت، اپلیکیشن و …) به سمت مدل‌های آشنا میره. یعنی ترجیح میده mental model یا همون مدل ذهنی از پیش دیده شده رو در سایر جاها هم ببینه.

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

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

براساس قانون جیکوب باید از مدل‌های آشنای طراحی استفاده کنیم
براساس قانون جیکوب باید از مدل‌های آشنای طراحی استفاده کنیم

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

2- قانون Aesthetic-usability effect

ظاهر خوب یه سایت این پیام رو به کاربر میده که کاربردی هم هست (Usability داره)

درسته که به نظر من خوشگلی دردسر داره و توجه زیاد به طراحی رابط کاربری یا UI می‌تونه به تجربه کاربری یا UX لطمه بزنه اما حد متعادل و درستی از زیبایی بصری به قضاوت یوزر کمک می‌کنه تا تایید کنه که سایت کاربردیه و علاقمند بشه که در سایت گشت و گذار کنه.

3- قانون Doherty threshold

قانون دوهِرتی میگه که زمان واکنش و تعامل یوزر با دیزاین باید کم باشه یه چیزی حدود 400 میلی ثانیه یا 0.4 ثانیه.

پس باید کاری کنیم که یوزر تصور کنه که اون مسئول تعامل با سایته. اونه که قدرت در دستشه و همه کارارو می‌تونه انجام بده. (In charge of interaction)

به نظر من این قسمت رو هم میشه به سئو ربط داد. یه چیزی هست به اسم کور وب وایتال (core web vitals) که بچه‌های سئو بهش اهمیت میدن. چندتا فاکتور داره که یکیشون FID هست؛ مخفف First Input Delay. براساس این فاکتور، اولین تعامل یوزر با سایت باید کمتر از 100 میلی ثانیه باشه. اگه میزان تعامل یوزر خیلی سریع باشه، نشون میده که سایت از لحاظ لودینگ خیلی قویه و کار یوزر رو راحت میکنه.

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

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

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

حالا یه سوال پیش میاد: اگه پروسه واقعا طول میکشه باید چیکار کرد؟ مثلا قراره یه فرمی رو پر کنه.

با دو تا راه میتونیم یوزر رو سرگرم کنیم: از animation استفاده کنیم یا با progress indicator نشون بدیم که چقدر از فرآینده رفته و چقدرش باقی مونده.

نمونه‌هایی از progress indicator که به چشم‌های ما آشنا هستند
نمونه‌هایی از progress indicator که به چشم‌های ما آشنا هستند

4- قانون فیتس (Fitts's law)

یه روانشناس به اسم پائول فیتس گفت: مدت زمان حرکت به یه هدف (Target) به اندازه و فاصله هدف بستگی داره.

یعنی چی؟

مثلا دکمه فراخوان به عمل یا کال تو اکشن (CTA:Call To Action) هم باید نسبت به سایر المان‌ها بزرگ‌تر باشه و هم جای مناسبی داشته باشه که سریع‌تر بشه ازش استفاده کرد. نمونه‌اش کال تو اکشن‌های خرید محصول توی نسخه‌های موبایلیه که جاشون معمولا گوشه سمت راست صفحه است (جایی که انگشت شصت راحت‌تر می‌چرخه)

5- قانون هیک (Hick's law)

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

هرچقدر تعداد محرک بیشتر باشه = مدت زمان پاسخگویی کاربر بالاتر میره (که این بده)

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

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

نمونه: سرچ گوگل؛ هیچی نداره جز یه سرچ باکس که ازمون میخواد جستجو کنیم. چیز دیگه‌ای ازمون نمی‌خواد

یه عبارت باحالی هم درباره این قانون هست:

Be Choosy about Choosing

6-قانون میلر (Miller's law)

آدما به صورت میانگین 7 تا مورد یا آیتم توی ذهنشون میمونه؛ حالا دو تا کمتر یا بیشتر

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

پس باید تلاش ذهنی یا mental effort کاربر رو کم کنیم تا بار شناختیش سنگین نشه (Cognitive load)

نمونه‌: گوگل میت

انتخاب‌ها توی صفحه کمه: یه کال تو اکشن اصلی داریم (New Meeting) و دو تا کال تو اکشن ثانویه که در سمت چپ هستن

پس باید انتخاب‌ها رو کم کنیم و از مدل‌های آشنا استفاده کنیم (براساس قانون جیکوب)

7- قانون Goal gradient effect

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

پس بهتره که برای ترغیب یوزر به انجام کاری، اول بیایم پروسه رو خرد کنیم و با progress indicator نشون بدیم که چه مراحلی رو یوزر باید طی کنه، بعد از اون با ux writing مناسب یا عبارت‌های ترغیب کننده، یوزر رو تشویق کنیم تا پروسه رو کامل کنه.

8- قانون law of common region

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

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

9- قانون law of proximity

یوزرا عادت دارن که المان‌ها یا objects رو که از لحاظ موقعیت نزدیک هم هستن رو در یه گروه قرار بدن. اینجوری راحت‌تر با طراحی ارتباط می‌گیرن.

10- قانون law of Prägnanz

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

دوباره اینجا باز باید بگیم که از mental overload یا تلاش ذهنی برای حل مسائل پیچیده باید دوری کرد.

تلفظ این قانون: Peregnans (پرگننس)

11- قانون شباهت (Law of similarity)

یوزر دوست داره المان‌های مشابه رو ببینه تا بتونه ازشون استفاده کنه و مطمئن باشه. نمونه‌اش رنگ لینک‌های کلیک شده توی گوگله که یه رنگ ارغوانی داره و معمولا انتظار داریم توی سایت‌های دیگه وقتی روی لینکی کلیک می‌کنیم از همین رنگ استفاده کنیم.

12- قانون Occam's Razor

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

معمولا حذف المان‌هایی که کارکرد طراحی رو به خطر نندازه، توصیه می‌شه.

دیزاین خوب دیزاینیه که کمترین طراحی رو تا حد ممکن داشته باشه. نمونه بارزش هم اپله

یه گفته بامزه هم درباره این موضوع هست:

Keep it Simple and, stupid

13- قانون Pareto

توی Pareto Principle این عقیده وجود داره که 80% نتایج از 20% کار کردن به دست میاد. این قانون توی بیشتر صنایع دیده میشه. مخصوصا وقتی که منابع کم یا زمان محدود باشه استفاده از این قانون نجات بخشه.

بنابراین: روی دیزاین بخش‌هایی باید تمرکز کنیم که بیشترین منفعت رو به یوزر یا audience برسونن.

بهترین نمونه MVP هست. طراحی حداقلی از یه پروداکت (Minimum viable product)

باید به فیچر یا ویژگی‌هایی الویت بدیم که بیشترین نتیجه رو به یوزر میدن.

14- قانون Parkinson

قانون پارکینسون میگه که اگه برای یه کار (تسک - task) زمان مشخص نکنی، همه زمانتو می‌خوره. باید زمان رو برای انجام تسک محدود کرد.

حالا اگه بیایم این زمان موردانتظار رو کم کنیم، اتفاق خوبی برای تجربه کاربری بوجود میاد.

مثلا یوزر توقع داره که پروسه لاگین توی یه سایت 3 دقیقه طول بکشه (با احتساب مدت زمان وارد کردن ایمیل، شماره موبایل و رمز)، حالا اگه بیایم و با استفاده از گزینه لاگین با جیمیل این زمان رو کم کنیم، اینجاست که برنده شدیم.

قانون پارکینسون
قانون پارکینسون


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

15- قانون Peak-End Rule

آدما همیشه توی انجام پروژه‌هاشون اون قسمت‌هایی یادشون میمونه که یا چالش داشتن یا آخراش بوده.

این موضوع برمیگرده به مسیر یوزر یا سفر کاربر که User Journey. باید به اون بخش‌هایی از مسیر یوزر در طراحی استفاده کنیم که بیشترین تاثیر رو گذاشته یا تموم شده.

مثلا ahrefs یه صفحه 404 داره که خیلی باحاله. با اینکه به یه بن‌بست خوردی اما خوشت میاد که نگاهش کنی و برای اینکه از اون بن بست بیایم بیرون ابزار چکینگ لینک‌های broken گذاشته تا دوباره توی سایتش بچرخیم.

یه مثال دیگه‌اش صفحه 404 آمازونه که عکس از سگ‌هایی که کارکنان آمازون دارن گذاشته.

16- قانون Postel

اسم دیگه‌اش Robustness principle هست. این قانون میگه که درباره چیزایی که از یوزر می‌خوایم باید انعطاف‌پذیر باشیم؛ یعنی چیزایی که ازش می‌خوایم رو کم یا محدود کنیم.

مثلا: هرچیزی که یوزر مینویسه رو قبول کنیم. توی فرم ثبت‌نام به جای IR می‌زنه ایران. قبول کنیم و جوابشو به صورت IR بنویسیم.

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

17- قانون Serial Position effect

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

در Ux المان‌های مهم رو در سمت چپ و راست دیزاین بذاریم و المان‌های کمتر مهم رو در وسط قرار بدیم.

18- قانون تسلر (Tesler's law)

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

19- قانون Von Restorff effect

به این قانون، the isolation effect هم می‌گن. منظور از این قانون چیه؟

مردم عموما ترجیح می‌دن یه مورد یا object با بقیه فرق داشته باشه تا راحت به خاطر بسپارن. یه روانکاو به اسم Hedwig Von Restorff این رو گفت.

نمونه: کال تو اکشن همیشه با سایر المان‌های صفحه فرق داره و توی چشمه.

20- قانون زیگارنیک (Zeigarnik effect)

یه روانشناس دوره soviet (دوره شوروی) به اسم بلوما زیگارنیک بررسی کرد که بین تسک انجام شده و نشده، تسک انجام نشده راحت‌تر توی ذهن می‌مونه تا اونایی که انجام شدن.

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


این چسبندگی به خاطره آدمیزاد باعث میشه که ما ترغیب بشیم تا اون وظیفه رو تمومش کنیم.

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

آیکون سبد خرید که با عدد 1 پر شده
آیکون سبد خرید که با عدد 1 پر شده

خب این هم از قوانین تجربه کاربری.

امیدوارم که بهتون کمک کرده باشه و جرقه‌ای توی ذهنتون زده باشه.

دوست دارم نظر شما رو هم درباره این قوانین بدونم. خیلی خوشحال میشم که کامنت برام بذارین.


تجربه کاربریux
می‌خواستم یه باستان‌شناس خفن بشم، نشدم! اما دمم گرم به جاش یه دیجیتال مارکتر خفن شدم :)
شاید از این پست‌ها خوشتان بیاید