به طور کلی با توجه به عملکرد رفتاری و روانشناختی افراد نظریات و قواعدی نیز وجود دارد که کمک به فهم حالات فرد میکند. معمولا اشخاص از الگو های رفتاری مشابهی پیروی می کنند برای مثال اگر حادثه ی ناگواری برایشان اتفاق بیفتد ناراحت شده و گریه میکنند, اگر موفقیتی کسب کنند خوشحال میشوند و ...
در طراحی رابط کاربری یکی از مهم ترین اصولی که یک طراح رابط کاربری باید بداند این است که چه کسانی و به چه منظور از محصول مورد نظر استفاده میکنند و همیشه در تلاش باشد تا تجربه ی بهتری در استفاده از محصول را برای کاربر خلق کند .اصولا کاربر هسته ی مرکزی است که محصولات برای خلق تجربه ی بهتر برای او طراحی و باز طراحی می شوند.
انسان ها با توجه به ساختار ذهنی مشابه معمولا رفتار های مشابهی نیز در مواجهه با برخی مسائل از خود نشان میدهند. یکی از نظریه هایی که به این موضوع میپردازد نظریه گشتالت است . طبق این نظریه کلِ هر چیزی، فراتر از مجموع اجزای آن است. برای مثال ما با گوش فرادادن به نت‌های مجزای یک ارکستر سمفونی، قادر به درک تجربه گوش دادن به خود آن نیستیم.
گشتالت دارای هفت اصل است که در این نوشته برآنیم تا با مرور این اصول و کاربرد آن در طراحی رابط کاربری, تجربه ی بهتری را برای کاربر در استفاده از محصولاتمان رقم بزنیم.
در این اصل زمانی که کاربر دسته ای از اشکال, نوشته ها و اجزای موجود در صفحه را می بیند. آن دسته از اجزا که فاصله ی کمتری از هم داشته و به هم نزدیکترند را در یک گروه قرار می دهد.
کاربرد قانون مجاورت در UX
به مثال های زیر دقت کنید : لیبل همیشه نزدیک به کادر متن قرار میگیرد و کاربر این دو را در یک گروه در نظر گرفته و با توجه به متن لیبل کادر را پر میکند.
در این قانون زمانی که عناصری شبیه هم وجود داشته باشند فرد آنها را در یک دسته قرار میدهد و معمولا هم انتظار رفتار یا کاربرد یکسانی از آنها دارد.
در مثال زیر با اینکه همه دایره ها یک اندازه و یک شکل هستند به علت وجود سه رنگ متفاوت کاربر آن دسته از دایره هایی ک دارای رنگ یکسانی هستند را در یک گروه دسته بندی میکند.
کاربرد قانون شباهت در UX
در مثال زیر همانطور که مشاهده میکنید در کادرهایی که با رنگ سبز مشخص شده اند چون شبیه به هم هستند کاربر هردو را در یک گروه در نظر گرفته و در نظر دارد آن ها را پر کند, حال آنکه دو عنصری که پایین با رنگ قرمز مشخص شده را به خاطر شکل ظاهریشان دکمه شناسایی میکند و میداند که میتواند آن ها را بفشارد.
در قانون تداوم, انسان معمولا عناصری که در یک خط صاف و یا منحنی به دنبال هم ردیف شده اند را بیشتر مرتبط در نظر میگیرد. در مثال زیر هم شاهد دو گروه هستیم که ذهن, عناصری که به دنبال هم روی یک خط هستند را مرتبط تر در نظر دارد مثلا ارتباط بیشتری بین عناصر درون هر کادر قرمز وجود دارد.
کاربرد قانون تداوم در UX
در مثال زیر دسته بندی های املاک, وسایل نقلیه, لوازم الکترونیکی, مربوط به خانه و ... چون در یک راستا قرار دارند ارتباط بیشتری دارند تا دسته بندی املاک و خدمات با زیر دسته بندی لوازم الکترونیکی که شامل موبایل و رایانه و ... میشوند.
ذهن ما به دنبال یک الگوی واحد و قابل تشخیص عناصر بصری پیچیده را ساده سازی کرده و به طور ناخوداگاه اشیا ناقص را کامل میکند و چیزی منسجم را از قسمتهایی ایجاد می کند که به طور عینی ناسازگار هستند.
چیزی که در پایین به شکل سگ میبینیم در واقع مجموعه از نقاط می باشد که ذهن با توجه به مواردی که در حافظه ذخیره کرده آن را ساده سازی کرده و به شکل سگ مشاهده می شود.
کاربرد قانون تکمیل در Graphic Design
این قانون در طراحی لوگو با کمک گرفتن از فضای منفی صفحه کاربرد دارد به طوری که طراح, لوگویی را طراحی میکند که ذهن کاربر آن را در فضای صفحه تکمیل میکند.
انسان به طور غریزی اشیا را یا در پیش زمینه (foreground) و یا در پس زمینه (background) درک می کند و به عنوان یک انسان در لحظه می تواند روی یکی از آن ها تمرکز کند.
در تصویر زیر در پس زمینه یک هلال میبینیم و در پیش زمینه یک دایره :
کاربرد قانون شکل و زمینه در UX
با در نظر داشتن این قانون برای ایجاد navigation panel, modals و dialogs در طراحی صفحات وب و موبایل اپلیکیشن ها استفاده میکنیم.
این اصل ارتباط نزدیکی با اصل مجاورت دارد.در این اصل بیان می کنیم زمانی که اشیا در منطقه ی بسته ای در کنار هم قرار میگیرند, ذهن آن ها را یک گروه تشخیص می دهد و عناصری خواهیم داشت که عضو یک گروه هستند حال اگر ناحیه ای دور تا دور تعدادی از این المان ها ایجاد کنیم, آن ها به عنوان یک گروه جداگانه رفتار می کنند.
کاربرد قانون منطقه مشترک در UX
در UX این قانون در استفاده از cards دیده می شود. در مشاهده ی card اطلاعات روی آن در یک گروه دسته بندی می شود حتی اگر در نزدیکی المان و اطلاعات موجود در جاهای دیگر صفحه باشد.
این اصل بیان می کند عنصری که از نظر ظاهری با بقیه عناصر متفاوت باشد, زودتر نظر بیننده را به خود جلب می کند.مواردی مانند فونت, رنگ, اندازه و شکل عناصری که می توانند ایجاد شباهت کنند اگر روی یک عنصر خاص اعمال شوند می توانند ایجاد تمایز نیز کنند.
در مثال زیر چشم مخاطب اول به دایره کوچک جلب می شود چون از لحاظ ظاهری اندازه ای متفاوت با بقیه دایره ها دارد.
کاربرد قانون نقطه ی کانونی در UX
مثال بسیار بارز این قانون در کاربری و جای گزاری دکمه ها در طراحی می باشد به همین خاطر برای تشخیص سریع دکمه ها از بقیه عناصر توسط کاربر از رنگ های جلب توجه کننده, شکل متفاوت استفاده می شود تا کاربر به راحتی و سرعت عمل بالا دکمه را در صفحه تشخیص داده و از آن در صورت لزوم استفاده کند.
هفت اصل بالا به طراح تجربه ی کاربری کمک می کند تا در مرحله ی wireframing با دقت و دانش بیشتری از عملکرد و نحوه ی تعامل کاربر با محصول از المان ها استفاده کند به طوری که در محصول نهایی, نرخ تعامل کاربر با محصول مورد نظر بیشتر شود.
