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

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

فضای منفی، فضای دور ریخته شده نیست

فضای منفی در تعریف ساده، همان فضای خالی اطراف یک المان در رابط کاربری است. به این فضاها فضای سفید نیز گفته میشود که البته لزوما به معنی سفید بودن رنگ آن نیست. عبارت فضای سفید از صنعت چاپ می آید زیرا در سال های دور که متن ها روی کاغذ سفید چاپ میشد، فضای منفی طبیعتا سفید بود. عبارت فضای منفی ریشه در عکاسی دارد که به معنی پس زمینه و هر چیزی غیر از المان اصلی (فضای مثبت) است. در طراحی رابط کاربری فضای منفی و فضای سفید(خالی) معنی یکسانی دارند.

“معنای واقعی فرم و یا شکل با متضادش واضحتر میشود. در نبود شب ما نمیتوانیم روز را بشناسیم. راه های رسیدن به کنتراست بسیار است: ساده ترین آنها بزرگ/کوچک، روشن/تاریک، افقی/عمودی، گوشه دار/گرد، نرم/زبر، بسته/باز و نزدیک و دور هستند، که همگی آنها احتمالات مختلفی برای طراحی موثر در اختیار ما قرار میدهند.”

Jan Tschichold

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

به این صورت فضای منفی به یک المان فعال در طراحی تبدیل میشود.

فضای منفی به عنوان یک المان فعال در طراحی

کارفرامایان معمولا تمایل دارند که با کاهش فضای منفی محتوای بیشتری عرضه کنند و اعتقاد دارند با این کار محتوای ارزشمند بیشتری به صورت یکجا به کاربر نمایش داده میشود. با نمایش محتوای بیشتر به کاربر در یک نگاه لزوما نمیتوانید به این هدف برسید. این همان افسانه “اسکرول کمتر” است.

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

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

چگونه فضای منفی را در طراحی خود اعمال کنیم

دو نوع فضای منفی وجود دارد. فضای منفی میکرو و فضای منفی ماکرو. فضای منفی ماکرو، فضای بین کامپوننت های بزرگتر در طرح و فضای منفی میکرو، فضای بین کامپوننت های کوچکتر و فضای درون آنهاست.

راه ایجاد تغییر فضاهای منفی در طراحی، استفاده از حاشیه و فاصله خطوط است.

چرا فضای منفی آنقدر مهم است؟

دلیل نتیجه دادن فضای منفی، روش کار ذهن ماست.

ما چگونه پدیده ها را دریافت و درک میکنیم؟

روش ادراک ما به گونه ای است که همه چیز را در نسبت با چیز های دیگر درک میکنیم. این به این معنی است که برای مثال دیدن دکمه های Call to action اصلی رابط کاربری کاملا به فضای اطراف آن بستگی دارد.

همانطور که در طراحی که توسط اندلسون انجام شده، نشان داده شد، خانه A و B با اینکه رنگ یکسانی دارند طوری دیده میشوند که انگار رنگشان متفاوت است. به دلیل روش کار ذهن انسان، ما در نتیجه وجود سایه و اشیاء مجاور رنگ آنها را متفاوت دریافت میکنیم. حتی با علم به اینکه رنگ این دو شئ یکسان است ما توانایی جدا و مقایسه کردن رنگ این دو شئ را نداریم و کماکان رنگ آن دو را متفاوت میبینیم.

 

چگونه از این نظریه درباره ادراکمان در رابطه با فضای منفی استفاده کنیم؟

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

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

در مثال زیر میبینیم مجاورت چگونه در گروه بندی عنوان و ورودی اعمال میشود:

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

اعمال اصل مجاورت در این مورد به معنی ایجاد فضای منفی میکرو کمتر بین هر گروه عنوان و ورودی، و فضای منفی ماکرو بیشتر بین آن گروه ها در فرم است.

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

فضای منفی چگونه به ما کمک میکند اطلاعات را سریع تر و آسان تر پردازش کنیم؟

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

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

بخش دوم

منبع :

https://uxplanet.org/https-medium-com-viktorija-bachvarova-the-power-of-empty-space-in-uidesign-14f14f8b203

مطالب مرتبط


قدرت فضای خالی در طراحی رابط کاربری (بخش دوم )... استفاده از توجه و تمرکز برای تقویت سلسله مراتب دیداری المان هایی که با احاطه شدن در فضای سفید بر آنها تاکید شده، ممکن است برای متمرکز کردن توجه کاربر ...
طراحی تجربه کاربری و ایجاد نمونه اولیه، چیزی که ط...   شرکت پیشرو و موفق Adobe سال‌ها است که به طراحان و توسعه‌دهندگان در حوزه‌های مختلف کمک زیادی کرده است. اگر در حوزه طراحی‌های بصری نظیر طراحی رابط کار...
دوره فشرده آموزش طراحی تجربه کاربری : درس ۱۸... ماموریت من در ارائه این 31 درس این است که ، طراحان (یا طراحان مشتاق) بیشتری در طراحی تجربه کاربری شروع به کار کنند. بهترین مکان برای شروع یادگیری هر چ...
زمانیکه از تجربه کاربری به تجربه مشتری می رسیم... ما چقدر مایل هستیم که از افراد برای طراحی واسط‌ کاربری کمک بگیریم؟ در ابتدا توجه داشته باشید که ux تجربه‌ی خاص یک مشتری در تعامل با یک محصول دیجیتال ...
محمد نسیمی

نویسنده محمد نسیمی

محمد نسیمی هستم. از مهندسی عمران وارد طراحی تجربه و رابط کاربری شدم و در حال حاضر در این زمینه فعالیت میکنم.

نوشته های بیشتر از محمد نسیمی

نظرتان را بگویید