راهنمای گام به گام ماسک کردن در adobe xd به زبان ساده

اگر به دنبال آموزش ماسک کردن در adobe xd هستید؛ تا انتهای این بخش با کارو اسکول همراه باشید. ما در این مقاله به بررسی سه روش ساده برای انجام این کار پرداخته‌ایم.

ماسک کردن در adobe xd

روش شماره ۱: استفاده از شکل‌ های مختلف

یکی از آسان‌ترین روش‌های ماسک کردن در adobe xd، استفاده از شکل‌های مختلف است. تصور کنید که می‌خواهیم تصویر پروفایل زیر را درون یک دایره قرار دهیم:

برای این کار، باید ابزار Ellipse را انتخاب کرده و همزمان با نگه داشتن کلید Option (در مک) و Alt (در ویندوز) یک دایره رسم کنید:

دایره و تصویر را انتخاب کرده و از کلیدهای ترکیبی Command + Shift + M (مک) یا Ctrl + Shift + M (ویندوز) برای ماسک کردن استفاده کنید. پیشنهاد می‌شود دوره آموزش adobe xd کارواسکول را دنبال کنید.

اگر می‌خواهید موقعیت تصویر را  تغییر داده یا آن را درون فریم مقیاس بندی کنید، روی شکل و تصویر مربوطه دابل کلیک کنید:

درگ و دراپ کردن

یکی دیگر از تکنیک‌های مشابه برای ماسک کردن در adobe xd، با رسم یک شکل و سپس درگ و دراپ کردن تصویر به درون شکل انجام می‌شود. تصور کنید که می‌خواهیم یک تصویر بک گراند روی آرت برد داشته باشیم. از ابزار Rectangle برای رسم یک مستطیل به ابعاد آرت برد استفاده کرده و بعد از آن تصویر خود را درون مستطیل درگ و دراپ کنید.

نکته: برای تغییر ابعاد یا مقیاس بندی تصویر می‌توانید، روی تصویر و شکل دابل کلیک کنید.

روش شماره ۲: استفاده از ابزار Pen

در دومین روش می‌توانید از ابزار Pen برای رسم اشکال دلخواه خود استفاده کنید. در حقیقت اگر به دنبال ساخت ماسک‌های پیچیده هستید، بهتر است از این روش استفاده کنید. پیشنهاد می‌شود دوره آموزش ui کارواسکول را دنبال کنید.

مثل روش اول در اینجا هم باید شکل و تصویر را انتخاب کرده و از کلیدهای ترکیبی Command + Shift + M (مک) یا Ctrl + Shift + M (ویندوز) برای ماسک کردن استفاده کنید. پیشنهاد می‌شود مقاله دیگر ما درباره ساخت دیزاین سیستم را بخوانید.

روش شماره ۳: استفاده از ابزار Pen در فتوشاپ!

روش شماره ۳ ماسک کردن در adobe xd با استفاده از فتوشاپ انجام می‌شود! فتوشاپ در مقایسه با adobe xd ابزار دقیق‌تر و آسان‌تری برای ماسک کردن محسوب می‌شود.

تصور کنید که می‌خواهیم دست و لیوان موجود در این تصویر را از بک گراند جدا کنیم. برای این کار بعد از باز کردن تصویر در فتوشاپ، ابزار Quick Selection را انتخاب کرده و روی Select Subject کلیک کنید. بعد از آن در انتهای پنل Layers، روی Add a Mask کلیک کنید.

روی تصویر زوم کرده و از انتخاب همه‌ی موارد اطمینان حاصل کنید. مثلاً در این پروژه، فتوشاپ قسمت‌هایی از لبه‌های لیوان را جا انداخته بود؛ پس بعد از زوم کردن و با استفاده از ابزار Brush این مشکل را برطرف کردیم. پیشنهاد می‌شود آموزش نصب Adobe XD را بخوانید.

بعد از آن به Image > Trim رفته و گزینه‌ی Transparent Pixels را انتخاب کنید. با این کار، از شر پیکسل‌های شفاف خلاص می‌شوید و تصویر شما برش داده می‌شود. در نهایت با رفتن به File > Save As > PNG فایل مربوطه را ذخیره کنید.

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

پایان! از سه روش فوق می‌توانید برای ماسک کردن در adobe xd استفاده کرده و پروژه‌های مختلف خود را به راحتی و به سرعت انجام دهید.