اصول روانشناسی که هر طراح UI / UX باید بداند


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




بیایید با اثر Von Restorff شروع کنیم:


1.اثر Von Restorff

اثر Von Restorff (همچنین به عنوان اثر انزوا شناخته می شود) پیش بینی می کند که در صورت وجود چندین object مشابه، به احتمال زیاد موردی که با بقیه متفاوت است به خاطر سپرده می شود!

این دلیل اصلی تفاوت ظاهری همه فراخوانها (CTA) با بقیه دکمه ها در یک سایت یا برنامه است!

مثال اثر Von Restorff
مثال اثر Von Restorff


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

"وقتی چندین شی مشابه وجود داشته باشد، به احتمال زیاد موردی که با بقیه متفاوت است به خاطر سپرده می شود!"


2. اثر Serial position

اثر Serial Position، گرایش کاربر در به بخاطر داشتن و یاد آوری اولین و آخرین مورد از یک مجموعه است.

از چپ به راست ، Twitter ، Medium ، ProductHunt
از چپ به راست ، Twitter ، Medium ، ProductHunt


به همین دلیل است که امروزه بیشتر برنامه ها منوی همبرگری را رها می کنند و به دنبال نوار پایین یا بالا می روند، مهمترین اقدامات کاربر را در سمت راست یا چپ قرار می دهند. در تصویر بالا، می توانید چند نمونه از برنامه های محبوب iOS را مشاهده کنید. هر یک از آنها "خانه"(Home) و "نمایه" (Profile) را با توجه به تأثیر Serial Position ، به سمت چپ و راست قرار می دهند.


3.بار شناختی یا Cognitive load

بار شناختی یا Cognitive Load، به مجموع تلاش ذهنی در حافظه کاری کاربر اشاره دارد. به بیان ساده، همان اندیشه ای است که شما برای انجام یک کار خاص باید انجام دهید.

"بار شناختی میزان فکری است که برای انجام یک کار خاص باید انجام دهید."

تئوری بار شناختی را می توان به سه نوع تقسیم کرد:

  1. بار شناختی Intrinsic
  2. بار شناختی Extraneous
  3. بار شناختی Germane

در این مقاله به انواع Intrinsic و Germane اشاره می شود، زیرا این دو بیشترین کاربرد را در طراحی UX دارند.

بار شناختی Intrinsic

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

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

Stayful, Serist, Lucidchartayful از چپ به راست
Stayful, Serist, Lucidchartayful از چپ به راست


بار شناختی Germane

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

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

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


4.قانون Hick

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

یک مثال بسیار خوب از قانون Hick که در طراحی تجربه کاربر اعمال می شود، لیست ها هستند.

مثال قانون Hick
مثال قانون Hick


5.قانون Proximity


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

مثال قانون مجاورت
مثال قانون مجاورت


"قانون مجاورت می گوید اشیایی که نزدیک به یکدیگر هستند ، معمولاً در یک گروه قرار می گیرند"


در مثال بالا ، 72 دایره وجود دارد. ما حلقه ها را به صورت گروهی و براساس فاصله بین آنها تشخیص می دهیم. به طور کلی، ما درک می کنیم که یک گروه 36 حلقه ای در سمت چپ تصویر و 3 گروه 12 حلقه ای در سمت راست تصویر وجود دارد.
به اعتقاد من این مثال روشن می کند که هنگام طراحی UI نیاز به گروه بندی موارد وجود دارد و همچنین باید در هنگام چیدن چیزهایی که کاربران به طور طبیعی فکر می کنند با یکدیگر مرتبط هستند، خیلی با احتیاط عمل کرد.


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


https://virgool.io/@amirtaqiabadi/gestalt-principles-in-ui-ide7dxat6sik

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

https://marvelapp.com/blog/psychology-principles-every-uiux-designer-needs-know/