عملیات Boolean در طراحی UI

عملیات Boolean در طراحی UI

تا به اینجای کار، ما انواع اشکال پایه را در Adobe XD پوشش داده‌ایم. اما اگر بخواهید چیزی پیچیده‌تر از گزینه‌های ذکر شده در قسمت قبل بسازید چه؟

بیایید در مورد برخی از شناخته‌شده‌ترین لوگوها فکر کنیم. اگر دقت کنید، بیشتر اشکال پیچیده، از اشکال پایه‌ای مانند دایره و مستطیل تشکیل شده‌اند. لوگوی اپلیکیشن YouTube، به سادگی یک مستطیل و یک مثلث است که با هم ترکیب شده‌اند. لوگوی اپلیکیشن هواشناسی iOS، ترکیبی از دایره‌ها و خطوط است. برای ترکیب اشکال ساده‌ای که در ایجاد لوگوی شما مناسب باشند، از چیزی به نام عملیات Boolean استفاده خواهیم کرد.

یک عمل Boolean، ابزار هندسی قدرتمندی است که در اکثر اپلیکیشن‌های طراحی UIیافت می‌شود. چهار نوع اصلی عملیات Boolean وجود دارند:

  1. Union
  2. Subtract
  3. Intersect
  4. Exclude Overlap

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

بیایید کمی دقیق‌تر به هر عمل Boolean و آنچه که پس از اعمال کردن هرکدام به دست می‌آورید، نگاه کنیم:

  • Union، اشکال را با هم ترکیب می‌کند تا یک شکل واحد ایجاد کنند.
  • Subtract، هر شکلی که در بالاترین لایه باشد را می‌گیرد و آن را از شکل زیری حذف می‌کند.
  • Intersect، فقط نواحی‌ای که هم‌پوشانی و تداخل دارند را نگه می‌دارد.
  • Exclude Overlap، همه چیز را به‌جز نواحی‌ای همپوشانی نگه می‌دارد.

نکاتی هنگام استفاده از عملیات Boolean

حالا ما با اشکال پایه و عملیات  Booleanآشنایی داریم! قبل از این‌که وارد بخش عملی آموزش‌مان شویم، بیایید به برخی از نکات کلیدی‌ای که نیاز است هنگام طراحی دکمه‌ها و اشکال برای اپلیکیشن انتخابی‌تان بدانید، نگاهی سریع بی‌اندازیم.

آیا به یاد دارید که قبلا در مورد اهداف لمسی (touch targets) صحبت کردیم؟ اینجاست که اهداف لمسی واقعا اهمیت پیدا می‌کنند. هنگام طراحی دکمه‌ها، همیشه بهتر است که خیلی بزرگ باشند تا خیلی کوچک. برای کاربران، کلیک کردن روی دکمه‌های کوچک‌تر سخت‌تر از دکمه‌های بزرگ است. در آخر، شما می‌خواهید که همه‌ی کاربران‌تان بتوانند به راحتی روی دکمه‌هایی که می‌سازید کلیک کنند. برای کسب اطلاعات بیشتر در مورد اندازه‌های بهینه در اهداف لمسی دکمه‌ها، توصیه می‌کنیم این مجموعه دستورالعمل‌ها را در وبسایت UX Movement مطالعه کنید.

نکته‌ی بعدی درمورد متن‌ها است. چه متنی روی دکمه‌های شما خواهد بود و اندازه‌ی متن‌ها چقدر خواهد بود؟ ایده‌ی خوبی است که فضایی را برای آزمایش فونت‌ها و فاصله‌گذاری‌های مختلف در نظر بگیرید، زیرا در قسمت‌های بعدی، آن‌ها را بررسی خواهیم کرد. برای الان، تنها لازم است بدانید که دکمه‌های شما به اندازه‌ی کافی بزرگ هستند تا مطمئن شوید که متن:

  1. به خوبی روی دکمه می‌نشیند.
  2. بدون دشواری خوانده می‌شوند.