جادوی فضای خالی در طراحی

فضای خالی در طراحی

(زمان مورد نیاز برای مطالعه: ۸ دقیقه)

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

 

فضای خالی به چی می‌گن؟

فضای خالی خلأیی هست که در بین یا اطراف هر چیزی وجود داره. فضای خالی در طراحی، لزوما سفید نیست و می‌تونه هر رنگ، طرح یا بافتی رو داشته باشه؛ اما باید حواسمون باشه که وقتی المان‌ها در فضای مورد نظرمون قرار می‌گیرند، وضوح، تمایز و برجستگی خودشون رو حفظ کنند.

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

 

فضای خالی چند نوعه؟

از نظر میزان بزرگی، دو نوع فضای خالی داریم: فضای خالی ماکرو و میکرو. فضای خالی ماکرو، فضای زیاد بین المان‌های مهم صفحه و فضای اطراف صفحه است. فضای خالی ماکرو در سمت راست و چپ اکثر وب‌سایت‌ها و بین بخش‌های مهم مثل هدر و مرکز صفحه دیده می‌شه. شاید بهترین مثال استفاده از فضای خالی ماکرو، وب‌سایت Google.com باشه. فضای خالی میکرو،  فضای بین المان‌های صفحه است، مثل فضای بین حروف، سطرها و پاراگرفا‌ها، دکمه‌ها و لیست‌ها. فضای خالی میکرو روی خوانا بودن محتوا تاثیر مستقیم داره. بعنوان مثال،‌ فضای خالی حاشیه پارگراف‌ها روی سرعت خوندن و فهمیدن متن اثر می‌ذاره.

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

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

فضای خالی ماکرو

 

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

فضای خالی میکرو

 

چرا فضای خالی خوبه؟

وجود فضای خالی اطراف یک بخش باعث جلب توجه کاربر می‌شه؛ چون چیز دیگه‌ای نیست که انرژی و کشش بصری داشته باشه. در واقع، هرقدر فضای خالی اطراف چیزی بیشتر باشه، به همون اندازه، توجه‌ها روی اون بیشتر می‌شه. یک جای خوب برای استفاده از فضای خالی، اطراف‌ Call To Action است. با این کار، پیام CTA بهتر منتقل می‌شه و احتمال ایجاد تعامل با کاربر افزایش پیدا می‌کنه. این رو می‌تونیم به‌وضوح در تصویر زیر از وب‌سایت Samsung.com ببینیم.

اهمیت فضای خالی در طراحی: جلب توجه

 

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

اهمیت فضای خالی در طراحی: بهبود فهم محتوا

 

طبق اصل مجاورت در قانون گشتالت، اجزایی که به هم نزدیک‌ باشند، در دید کاربر در یک مجموعه واحد قرار می‌گیرند. استفاده صحیح از فضای خالی در طراحی باعث گروه‌بندی صفحه می‌شه؛ بدون اینکه از عناصر جداکننده، مثل خط، استفاده کرده باشیم. این رو می‌تونیم به‌خوبی در شکل زیر، بین گزینه‌های Mobile و Apps ببینیم.

اهمیت فضای خالی در طراحی: گروه‌بندی صفحه

 

جمع‌بندی

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

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

ارسال نظر