جهان اطرافمان را چگونه درک میکنیم؟ مغز ما چطور آنچه را که میبینیم، تفسیر میکند؟ اصلا چطور میبینیم؟ چطور اشکال و فرمهای پیچیده را درک میکنیم؟ چرا مغز ما تمایل دارد شکل های پیچیده را به الگوهایی ساده تر تبدیل کند؟ چرا گاهی دچار خطای دید می شویم؟ چرا از لابه لای درختان یا در ابر ها تصاویر و چهره های آشنا می بینیم؟ چرا گاهی تصاویر و طرح ها برای ما جذابتر و دلنشین تر هستند؟ دانشمندان علوم روانشناسی سالها برای یافتن پاسخی برای این پرسش ها در حال تحقیق و مطالعه اند.
تلاش این دانشمندان نه تنها در حیطه روانشناسی که در حیطه تجارت، بازاریابی، دیجیتال مارکتینگ و غیره منجر به پیدایش علوم جدید مانند اقتصاد رفتاری، بازاریابی احساسی و غیره… شد که در آنها به بررسی علم روانشناسی دربارهی انسان و عوامل تاثیرگذار بر رفتار و تصمیماتش استفاده میشود.
برخی از این نظریههای روانشناسی در طراحی تجربه کاربری و طراحی رابط کاربری نیز استفاده میشود، چون هدف در هر دو راضیکردن کاربری انسانی است . طراحان رابط کاربری میتوانند با به کار بردن این نظریههای روانشناسی برای تاثیرگذارترکردن و قابل درک ترکردن طرحهای خود بهره ببرند.
چرا بعضی از طرح ها جذابترند؟ چرا کار کردن با برخی رابط ها کاربری راحت تر و یادگیر کار با آن ساده تر است؟ پاسخ ،اصول و قوانین کلی UX . اصول گشتالت به عنوان بخشی از این اصول کلی کمک میکند تا طرح هایی ارایه کنیم که برای کاربر جذابتر و به اصطلاح کاربر پسند تر باشد. روانشناسی گشتالت توسط گروهی از روانشناسان آلمانی در سال ۱۹۲۰ به جهت شناخت و توصیف چگونگی درک اطلاعات بصری توسط انسان ها و فرآیند های مربوط به آن ایجاد گردیده است.
گشتالت به معناهای کل، شکل و فرم ترجمه می شوند و بر اساس این تئوری کل بزرگتر از مجموع اعضاست این جمله به این معنا است که با وجود اینکه هر قسمت خاص دارای معنای ویژه خود می باشد ساختار کل می تواند به آن معنای کامل ببخشد. این توضیح به این معناست که ذهن ما به طور خود به خودی سعی دارد تا داده های بصری را ساده کرده و به عنوان نتیجه معنای کل جایگزین بخش های مجزا دیده خواهد شد.
قوانین گشتالت شامل تعدادی نظریه روانشناسی است که کاربران بهراحتی و با سرعت بیشتری محتوا و بخشهای مختلف سایت رو درک کنن. در این مقاله برخی از مهمترین این اصول و قواعد مانند مجاورت، مشابهت، اصل بستار، تداوم، تقارن و قانون شکل و زمینه را بررسی خواهیم کرد.
قوانین UX بر جنبه های روانشناسانه و رفتار کاربر در تعامل با محصولات دیجیتالی تمرکز داره با مروری بر این قوانین متوجه میشیم که بیشتر آنها توسط روانشناسان، رفتارشناشان و یا جامعه شناسان کشف یا معرفی شده اند. به هر حال کاربر نهایی وبسایتها و رابط های کاربری که یک طراح سایت طراحی میکند، انسانها هستند.
بنابراین لازمه که در مورد رقتار انسانها به عنوان کاربر نهایی آشنا باشیم تا چیزی که طراخی میکنیم تجربه خوشایند و دلپذیری برای کاربران آن ایجاد کنه. در ادامه، به بررسی مهمترین کاربرد قوانین گشتالت در طراحی سایت می پردازیم که هر طراح سایتی باید با آنها آشنا باشه و سعی میکنیم با مثال هایی کاربرد اونها رو در نمونه های واقعی بررسی کنیم.
چرا به عنوان طراح سایت باید درباره ی این نظریه و قوانینش بدانیم؟ اگر در مورد کارکرد مغز اطلاع داشته باشیم و بدانیم که مغز چگونه اطلاعات را بررسی و تفسیر میکند و چگونه این تفاسیر منجر به تصمیم گیری میشود، میتوانیم؛
مغز ما عناصر نزدیک به هم را به عنوان یک گروه یا واحد و مرتبط با هم در نظر میگیرد اصل مجاورت یکی از پرکاربردترین قوانین گشتالت است و به طراحان کمک میکنه تا اطلاعات مرتبط رو در کنار هم قرار بدن و به این وسیله درک آنها برای کاربر راحتر تر میشود.
مثال عملی: در یک پروژه طراحی سایت برای یک کلینیک زیبایی، تیم ما خدمات مربوط به هم را در کنار هم قرار داد. برای مثال خدماتت مانیکور، پدیکور، ژلیش و کاشت ناخن همگی در یک قسمت قرار گرفته این کار علاوه بر اینکه به کاربر کمک میکند تا سریعتر خدمات مورد نظر را بیابد. شانس اینکه از دیگر خدمات مرتبط هم استفاده کند به مراتب بیشتر می شود. در وب سایت های فروشگاهی مانند خانومی، کاربرد این اصل را میتوانید در مگا منوها مشاهده کنید.
از نظر معز یک انسان عناصر مشابه (از نظر رنگ، شکل، سایز یا فونت) به عنوان یک گروه شناخته میشن. یکی از بدیهی ترین و کاربردیترین قوانین گشتالت در طراحی سایت، همین قانون مشابهت است که باعث حفظ یکپارچگی و نظم در طراحی سایت میشه. جالب اینکه در میان این عوامل اندازه نسبت به دو مورد دیگر از گشتالت قویتری برخوردار است.
مثال عملی: در یک فروشگاه آنلاین پوشاک که کار کردیم، تمام دکمههای “افزودن به سبد خرید” موجود در سایت رو به رنگ سبز و با فونت بولد طراحی کردیم. این شباهت باعث شد که کاربران خیلی سریع بفهمن کجا باید کلیک کنن. این نوع استفاده از شباهت، در نهایت باعث افزایش سرعت خرید و کاهش نرخ ترک سایت شد. در مثال زیر سایت دراپ باکس (Dropbox) نیز دقیقا از همین تکنیک برای طراخی دگمه های فراخوان (CTA) استفاده کرده است.
تا حالا شده به یکی شکل ناقص نگاه کنی و متوجه بشی که چیه؟ به احتمال زیاد شما هم در بین دست زیر یک لامپ رو میتونید ببینید بر اساس اصل بستار ، زمانی که قسمتی از یک شکل یا طرح جا افتاده و یا حذف شده باشد، مغزانسان بر اساس تجربیات قبلی اون رو کامل میکنه.
شاید بتوان گفت که این اصل از قوانین گشتالت از کمالگرایی انسان سرچشمه میگیره. این اصل رابطه نزدیکی باقانون پراگنانس (pragnanz) داره. پراگنانس را میتوان اینطور توضیح داد که، مغز انسان ذاتا در صدد کامل کردن تجربههای ناقص و تکته تکه از محیط پیرامون خود است. بنابراین هنگامی که تصویری را به صورت چند پاره میبینیم مغز ما اون رو به صورت کامل درک میکنه.
مثال عملی: معمولا از این این نظریه بیشتر برای طراحی لوگو ی مشتریان و آیکون استفاده میکنیم. در طراحی اکثر سایتها در حالت موبایل در اسلایدرهای افقی قسمتی از اسلاید بعدی را در معرض دید کاربر قرار می دهیم. با این کار هم کاربر متوجه می شود که این یک اسلایدر است و هم مشتاق می شود تا اسلایدهای بعدی را ببیند.
چشم انسان تمایل داره که مسیر خطوط و اشکال رو دنبال کنه. این قانون به طراحی کمک میکنه تا کاربر به طور طبیعی از یک بخش به بخش دیگر هدایت بشه. و یا ارتباط بین دو بخش رو به کمک خصوط بین آنها درک کنه. این اصل ارتباط نزدیکی با قانون اتصال یکنواخت (Law of Uniform Connectedness) دارد.
مثال عملی: در پروژه طراحی یک سایت گردشگری، از خطوط منحنی و پیوسته بین بخشهای مختلف مثل اطلاعات مقصد، گالری تصاویر و فرم رزرو استفاده کردیم. این خطوط به کاربر کمک میکرد که به طور طبیعی از بالا به پایین سایت پیمایش کنه و همه بخشها رو بدون از دست دادن چیزی بررسی کنه.
مغز انسان به طور کلی تصاویر متقارن رو دوست داره و سریعتر پردازش میکنه چون درکش راحت تره. از طرفی تصاویری که دارا ی تقارن نیستن بیشتر اصطکاکا فکری ایجاد میکنند.
مثال عملی: در اکثر پروژه ها از تقارن استفاده میکنیم. استفاده از ستونها با عرض یکسان، متون وسط چین شده و متن هایی که در کنار یک تصویر هستند. اگر قرار باشد چند المان در کنارهم قرار بگیرند سعی میکنیم که تعداد آنها فرد باشد. از طرفی گاهی برای ایجاد نقطه کانونی توجه از عدم تقارن نیز استفاده میکنیم. استفاده از این تکنیک کمی ریسک به همراه دارد و ممکن است نتیجه دلخواه به دست نیاید اما ما گاهی در پروژه هایمان از عدم تقارن برای درگیر کردن ذهن مخاطب استفاده میکنیم. چرا که مغز در این حالت نیاز به پردازش و تمرکز بیشتری دارد.
آخرین اصل از قوانین گشتالت که بررسی میکنیم، قانون شکل زمینه است. این قانون بیان میکنه که مغز تمایل داره بخشهای مهم یک تصویر رو به عنوان “شکل” و بقیه رو به عنوان “زمینه” تشخیص بده. این قانون به طراحان کمک میکنه تا تمرکز کاربر رو به سمت بخشهای مهم هدایت کنند.
مثال عملی: در طراحی وبسایت برای یک رستوران، ما تصاویری با کیفیت و بزرگ از طرف ها غذا در پس زمینه سفید قرار دادیم تصاویر این بشقاب های غذا به عنوان “شکل” و فضای سفید پشت اونها به عنوان “زمینه” بود. این کار تمرکز کاربر را به سمت غذاها هدایت میکرد و باعث میشد تشویق بشه که بقیه غذاهای موجود در منو رو هم بررسی کنه.
قوانین گشتالت به ما کمک میکنن تا طراحیهای روانتر و منسجمتری ایجاد کنیم که کاربران بهراحتی در اونها حرکت کنن. استفاده درست از این قوانین در پروژه های طراحی وبسایت میتونه به بهبود تجربه کاربری و افزایش تعامل کاربران کمک کنه. اگه این قوانین رو به درستی در طراحیهای خودت پیاده کنی، نه تنها سایتت جذابتر و کاربردیتر میشه، بلکه احتمال اینکه کاربران راحتتر به اهدافشون در سایت برسن، هم بیشتره.
❤️خوشحال میشم اگر نظرت رو در مورد این مقاله با من به اشتراک بذاری و اگر واست مفید بود به دگران معرفیش کنی یا لایکش کنی.