ویرایش تصاویر در فیگما؛ اصلاح نور و رنگ، کنتراست و برش تصویر

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

 

برش یه تصویر (Cropping an image)

 

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

برای برش یه تصویر مشابه ویدیو کراپ رو انتخاب کنید، اگر از آخرین ورژن فیگما استفاده می‌کنید طبق عکس زیر، از پنل سمت راست یا همون پنل طراحی، گزینه crop رو انتخاب کنید. نکته حرفه‌ای اینه که برای برش متناسب، Shift (هم در مک و هم در ویندوز) رو نگه دارین تا نسبت ابعاد تصویر حفظ بشه.

برش تصاویر در فیگما بعد از آپدیت ui3

 

تغییر یه تصویر (Modifying an image)

 

توی فیگما، تنظیمات مختلفی رو میشه روی یه تصویر انجام داد، مثل تغییر موقعیت، تغییر اندازه یا چرخش. نحوه انجام این کارها به این صورته:

  • تغییر موقعیت: به سادگی روی تصویر کلیک کنین و بکشین تا اون رو به یه مکان جدید منتقل کنین.
  • تغییر اندازه: هر لبه از تصویر رو بگیرین و بکشین تا اندازه اون رو تنظیم کنین.
  • چرخش: موس خودتون رو درست بیرون یه گوشه حرکت بدین تا آیکون چرخش ظاهر بشه، سپس کلیک کنین و بکشین تا تصویر رو بچرخونین.
  • تغییر اندازه همزمان طرف‌های مقابل: Option (مک) یا Alt (ویندوز) رو هنگام کشیدن نگه دارین تا هر دو طرف رو به طور همزمان تغییر اندازه بدین.

نکته حرفه‌ای! برای تغییر اندازه متناسب، Shift (هم در مک و هم در ویندوز) رو نگه دارین تا نسبت ابعاد تصویر حفظ بشه.

 

حالت‌های پر کردن (Fill modes)

 

شما می‌تونین اشیاء رو با چند روش مختلف با تصاویر پر کنین، بسته به اینکه می‌خواین تصویر چطور نشون داده بشه. برای انتخاب نوع پر کردن، با باز کردن پنجره Fill توی پنل Design روی تصویر بندانگشتی کلیک کنین:

  • Fill: این باعث میشه تصویر کل شیء رو بپوشونه. اگه شکل تصویر و شیء متفاوت باشن، ممکنه تصویر برای اطمینان از پوشش کامل شیء، بریده بشه.
  • Fit: این حالت مطمئن میشه که می‌تونین کل تصویر رو داخل شیء ببینین. اگه شکل‌های شیء و تصویر مطابقت نداشته باشن، ممکنه کل شیء رو پر نکنین و فضاهای خالی باقی بمونه.
  • Crop: می‌تونین با تنظیم لبه‌های اون، قسمتی از تصویر که می‌خواین ببینین رو انتخاب کنین. مثل اینه که یه قاب دور قسمتی که می‌خواین نشون بدین قرار بدین.
  • Tile: تصویر روی شیء تکرار میشه و یه الگو یا پترن ایجاد می‌کنه. می‌تونین اندازه تصاویر تکرار شده رو با تنظیم مقدار درصد تغییر بدین. می‌تونین یه درصد جدید تایپ کنین یا از دستگیره‌های آبی توی بوم(که در اطراف عکس ظاهر میشن) برای بزرگتر یا کوچکتر کردن اون استفاده کنین.

 

چرخش تصویر (Image rotation)

 

 

نحوه انجام عمل چرخش تصاویر یا سایر آبجت ها در فیگما به این صورته:

  • شیئی که می‌خواین اون رو بچرخونین رو انتخاب کنین.
  • توی پنجره Fill توی پنل Design، روی تصویر بندانگشتی کلیک کنین تا به منوی گزینه‌های تصویر دسترسی پیدا کنین.
  • دنبال آیکون چرخش بگردین و روی اون کلیک کنین تا پر کردن ۹۰ درجه در جهت عقربه‌های ساعت بچرخه. می‌تونین چند بار کلیک کنین تا به چرخوندن در افزایش‌های ۹۰ درجه‌ای ادامه بدین تا به جهت‌گیری مورد نظر برسین.

 

نوردهی تصویر (Image exposure)

 

توی عکاسی، نوردهی میزان نوری که به حسگر دوربین میرسه رو تعیین می‌کنه و روی روشنایی تصویر تأثیر میذاره. به طور مشابه، توی فیگما، تنظیم نوردهی به شما اجازه میده روشنایی یا تاریکی یه تصویر رو تنظیم کنین. کاهش نوردهی تصویر رو تاریک‌تر می‌کنه ، در حالی که افزایش اون تصویر رو روشن‌تر می‌کنه و شبیه به نوردهی بیش از حد هست.

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

 

کنتراست تصویر (Image contrast)

 

تغییر کنتراست یه تصویر واقعاً می‌تونه ظاهر اون رو با بازی با قسمت‌های روشن و تاریک تغییر بده. کاهش کنتراست تصویر رو نرم‌تر و رنگ‌ها رو به هم نزدیک‌تر می‌کنه و یه ظاهر آرام‌تر به اون میده. این برای پس‌زمینه‌هایی که باید توی پس‌زمینه بمونن و حواس رو از متن یا سایر بخش‌های طرح پرت نکنن، خوبه.

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

 

اشباع تصویر (Image saturation)

 

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

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

 

دمای تصویر (Image temperature)

 

توی فیگما، تنظیم دمای یه تصویر، تُن کلی اون رو تغییر میده و اون رو از رنگ‌های سرد به رنگ‌های گرم منتقل می‌کنه. کنترل دما مثل تنظیم حالت تصویره — تُن‌های سردتر، با ته رنگ‌های آبی، یه حس آرام و بی‌دغدغه میدن، در حالی که تُن‌های گرم‌تر، که به سمت کهربایی متمایل هستن، یه حس دنج و دعوت‌کننده اضافه می‌کنن.

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

 

ته رنگ تصویر (Image tint)

 

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

این تنظیم مخصوصاً در ایجاد طرح‌های رنگی منسجم در سراسر طرح شما مفیده و به تصاویر اجازه میده با پالت کلی شما هماهنگ بشن.

هایلایت‌های تصویر (Image highlights)

 

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

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

 

سایه‌های تصویر (Image shadows)

 

تنظیم سایه‌ها به شما کمک می‌کنه روی نقاط تاریک‌تر تصویرتون کار کنین و دیدن تفاوت بین نواحی روشن و تاریک رو آسون‌تر می‌کنه. با تمرکز روی سایه‌ها، می‌تونین:

  • با اضافه کردن عمق، تصویرتون رو جذاب‌تر کنین.
  • نحوه تاریک یا روشن بودن سایه‌ها رو تغییر بدین و اونها رو نرم‌تر یا قابل توجه‌تر کنین.

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

 

دوره های آموزشی ما به شما کمک می‌کنند یک بار برای همیشه و اصولی، طراحی محصول را یاد بگیرید.

برای مشاوره رایگان، همین الان با ما تماس بگیرید.

مشاهده دوره ها 09900800427
5 دیدگاه

در بحث‌‌ پیرامون این مقاله شرکت کنید!

دیدگاهتان را بنویسید