همه‌ی قوانین UX را یک‌جا داشته باشیم!!

قوانین ux چیست ؟

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

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

۱. اثر فون ریستورف یا افکت ایزوله - FromRestorff Effect

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

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

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

۲. قانون هیک - Hick's Law

کاربر اگر قصد انجام کاری را داشته باشد علاقه به کمترین تعداد تصمیم برای انجام اون دارد.

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

۳. اثر زیگارنیک - Zeigarnik Effect

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

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

۴. اثر موقعیت سریال - Serial Position Effect

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

یعنی کاربر اول و آخر هر چیزی را چک می کند، سپس به وسط نگاه می کند.

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

در مثال بالا بخش‌های جستجو و signup آورده شده است. در نهایت در تصویر دوم سایر بخش‌ها قرار گرفته است.

۵. قانون منطقه مشترک - Law of Common Region

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

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

۶. قانون جیکوب - Jacob’s Law

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

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

۷. اثر زیبایی و قابل‌استفاده - Aesthetic-Usability Effect

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

۸. قانون Doherty Threshold

کاربر باید نتیجه هر اکشنی را حداکثر ۴۰۰ میلی ثانیه بعد ببیند یعنی بعد این مدت باید نتیجه اجرا به کاربر اطلاع داده‌ شود.

۹. قانون میلر - Miller’s law

کاربران معمولا بصورت نرمال ۷ باکت (+-۲) را در ذهن خود به خاطر می‌سپارد یا روی ان تمرکز می‌کند و اگر این مقدار بیشتر شود ممکن است کاربر توجه خود را به جای دیگری تغییر دهد.

۱۰. اثر گرادیان هدف - Goal-gradient effect

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

۱۱. قانون مجاورت - Law of Proximity

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

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

۱۲. قانون اتصال یکنواخت - Law of Uniform Connectedness

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

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

۱۳. قانون اختصار - Law of Conciseness

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

در مثال بالا کاربر در ابتدا با نوشتن logo به لیستی از اطلاعات مرتبط وصل می‌شود و راحت‌تر به ان اطلاعات دشوار دسترسی پیدا کند

۱۴. قانون تشابه - Law of Similarity

یعنی کاربران با دیدین عناصری که طراحی مشابهی دارند راحت‌تر هستد.

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

۱۵. قانون Occam’s Razor

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

برای مثال در تصویر پایین در ابتدا کاربران گزینه‌های زیر منوی get to us know و سپس گزینه‌های زیر منوی home را مشاهده می‌کند.

۱۶. اصل پارتو - pareto principle

این اصل بیان می‌کند که ۸۰ درصد نتایج از ۲۰ درصد تلاش حاصل می‌شود.

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

۱۷. قانون پارکیسنشون - parkinson's Law

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

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

۱۸. قاعده اوج پایان - Peak-End Role

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

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

۱۹. قانون پوستل - Postel's Law

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

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

۲۰. قانون تسلر - Tesler's Law

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

۲۱. اثر اجماع کاذب - False-Consensus Effect

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

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

۲۲. قانون فیتس - Fitts’s Law

قانون فیتس رابطه‌ایی بین مسافتی است که کاربر برای رسیدن به هدف باید طی کند و این هدف چقدر برای کاربر در دسترس است (از نظر بزرگی و کوچکی و نزدیکی و دوری ).

  • اندازه هدف باید به گونه‌ایی باشد که به راحتی برای کاربر قابل مشاهده باشد.
  • انتخاب هدف باید آسان باشد.

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