آموزش نرم افزار فیگما

در این جلسه آموزشی، نرم‌افزار فیگما را آموزش خواهیم داد. البته برخی از موضوعات، همزمان با پروژه و در جلسات پیش رو ارائه می‌شوند. دقت بفرمایید. این جلسه 4 ویدئو دارد.

نرم‌افزار فیگما ماهانه بیش از 3 میلیون کاربر را جذب می‌کند. در حال حاضر بیش از 1 میلیون تیم از Figma برای فرآیندهای طراحی خود استفاده می‌کنند. با این وجود پایگاه کاربران فیگما از سال 2018 تا کنون بیش از 200 درصد رشد کرده است. این آمارها محبوبیت این نرم افزاری طراحی UI را بین افرد نشان می‌دهد. به همین دلیل طراحان بیشتر از همیشه مشتاق یادگیری آموزش نرم افزار فیگما هستند. در این بخش از دوره طراحی رابط کاربری آژانس نوآوری رسام قصد داریم آموزش فیگما رایگان را در اختیار شما همراهان عزیز قرار دهیم. پس از شما دعوت می‌کنیم تا پایان آموزش فیگما صفر تا صد ما را همراهی کنید.

تاریخچه‌ای از نرم‌افزار فیگما

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

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

آموزش نرم افزار فیگما به ساده‌ترین شکل ممکن

چرا فیگما برای UI بهترین است؟

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

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

دانلود نرم‌افزار و ثبت‌نام در فیگما

وارد سایت figma.com شوید و روی دکمه آبی Get Started کلیک کنید. پس از وارد کردن ایمیل و انتخاب یک رمز عبور درست و حسابی، لینک به ایمیل شما می‌آید و پس از کلیک کردن روی آن، حساب کاربری شما ساخته می‌شود.

آموزش پیشرفته فیگما در آژانس نوآوری رسام

برای دانلود فیگما وارد لینک figma.com/downloads شوید. نسخه دسکتاپ را مبتنی بر پلتفرم ویندوز یا مک، انتخاب و نصب کنید. همانطور که بیان شد، نسخه دسکتاپ هم از اینترنت استفاده می‌کند و عملا فرق زیادی با نسخه تحت وب ندارد. فقط یک نکته ریز هست که باید بدانیم. نسخه دسکتاپ فونت‌های نصب شده داخل سیستم عامل را می‌شناسد. اما اگر از نسخه تحت وب استفاده کنید، باید حتما Font Installer مربوط به ویندوز یا مک را نصب کنید. از اپلیکیشن فیگما هم برای مدیریت و پرزنت پروژه استفاده می‌شود.

تجربه شخصی نصب فیگما

پیشنهاد می‌کنم از همان نسخه تحت وب استفاده کنید. همچنین برای اینکه این نسخه، فونت‌های نصبی شما را هم درک کند، Font Installer در همین صفحه را نیز نصب کنید (حجم آن زیر 3 مگابایت است). برای نصب فونت در سیستم‌عامل نیز، همانطور که می‌دانید آنها را باید در پوشه فونت سیستم‌عامل خود، اضافه کنید و یا با کلیک راست، آنرا را install کنید.

فیگجم یا figjam چیست و به چه درد طراحان می‌خورد؟

نرم‌افزار فیگجم، فرزند و بخشی از نرم‌افزار فیگما هست. همین که داخل نرم‌افزار لاگین کنید، می‌توانید هم دیزاین فایل فیگما بسازید و هم فایل فیگجم. کارایی فیگجم تمرکز روی طراحی غیر از ui دارد. مانند طراحی فرم پرسونا، اطلاعات مربوط به تست‌های کاربردپذیری، جدول تحلیل رقبا، انواع چارت، انواع نمودار، Mind map و هرچیزی که برای مدیریت اطلاعات شماست. فیگجم تا حدودی رقیب نرم‌افزارهای تحت وبی مانند miro.com و whimscal.com است. (این دو نیز ابزارهای قدرتمندی هستند). ما در این 4 ویدئو صرفا فیگما را آموزش دادیم. البته آموزش فیگجم و طراحی userflow در آن را در جلسه دیگری آموزش داده‌ایم که در ادامه دوره با آن مواجه خواهید شد.

یک قدم تا طراحی حرفه‌ای با آموزش نرم افزار فیگما

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

4.7/5 - (16 امتیاز)

46 پاسخ

  1. سلام استاد حمداللهی
    بسیار ممنونم بابت به اشتراک گذاشتن این دوره جامع و کامل. ممنون می‌شوم یک ویدیو هم راجع‌به نحوه رزومه سازی تو حوزه ui/ux و اینکه چه مهارت‌هایی از منظر کارفرما نقش اساسی‌تری در جذب و بکارگیری یک طراح محصول دارد درست کنید.

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

      موفق باشید.

  2. با سلام و وقت به خیر خدمت شما
    ببخشید تو قسمت تایپوگرافی هنگام استفاده از فونت وقتی به زبان انگلیسی تایپ میکنیم فونت اعمال میشه و تغییر میکنه ولی برای زبان فارسی اینطور نیست مشکل از کجاست؟

    1. درود بر شما. وقت بخیر
      گاهی اعمال نمیشه و گاهی هم طول می‌کشد که اعمال بشود. این موضوع در مورد فونت‌هایی مثل Inter هم زیاد رخ می‌دهد. راهکار انتخاب فونتی هست که برای فارسی طراحی شده و مناسب است. مثلاً ایران‌سنس، ایران‌یکان و…

      موفق باشید.

  3. با سلام و درود خدمت شما و تشکر بابت دوره فوق العادتون
    سوالم این بود که وقتی یک فریم رو ایجاد می‌کنیم چجوری بعد باید پاکش کنیم؟
    من هرچقدر تلاش کردم متاسفانه نتونستم (:

    1. درود بر شما. وقت بخیر
      با دکمه جذاب Delete در کیبورد الهه جان. البته اگر تازه اون رو ایجاد کرده باشیم با Ctrl + Z هم می‌شود. اما خب دکمه Delete راه حل درست‌تری است.

      موفق باشید.

  4. سلام وقت بخیر
    در ابتدا میخواستم تشکر کنم بابت آموزش های عالی و بی نقص تون. با وجود اینکه این دوره رایگان هست ولی واقعا کامل و دلسوزانه آموزش دادید. خیلی خیلی ممنونم و براتون آرزوی موفقیت و بهترین ها رو دارم.
    استاد من یک سوال هم داشتم. توی بخش اول جلسه 11 فرمودید که نسخه رایگان فیگما سیوها و اطلاعات ذخیره شده ی ما رو به مدت 30 روز نگه میداره و بعد پاک میشن!
    میخواستم بدونم یعنی اگر ما روی پروژه ای هم کار بکنیم بعد از 30 روز کلا همه چیز پاک میشه؟

    اگر export و در واقع خروجی بگیریم خروجی مون فقط به صورت عکس هست؟

    1. درود بر شما. وقت بخیر
      سپاس از لطف و مهربانی شما. نه اصلا پروژه شما پاک نمی‌شود. در واقع version history صرفاً مشابه Backup از تغییرات قبلی شما عمل می‌کند. مثلا فرض کنید بخواهید محصول طراحی شده خود را به یک هفته قبل برگردانید. این را تا 30 روز در نسخه رایگان نگه می‌دارد. با اصل طراحی شما کاری ندارد و خود طراحی شما همیشه برقرار است مگر اینکه خودتان آن را حذف کنید که در اینصورت وارد بخش Trash می‌شود که اگر از آنجا هم حذف کنیم، کلا برای همیشه حذف می‌شود.

      موفق باشید.

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

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

      موفق باشید.

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

  7. تشکر و سپاس از آموزش‌های خوبتون! آدم نکات جدید یاد میگیره، یک دنیا ممنون، ارادت.

  8. بهترین دوره فارسی زبان توی این این سایت پنهان شده خداییییییییییییی عالییییییییییییه و البته بهترین سایتی هست که بسیار عالی ویدیو ها رو دسته بندی کرده یعنی عاشق این سایت شدم خدایی فقط این دوره ها رو هم کامل کنید ممنون از شما

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

      ارادتمندم. موفق باشید.

  9. واقعا گاهی وقتا چقدر خوبه تمام انرژی وقت با ارزشی که داری رو در راه آموزش به دیگران بزاریم.
    از اینکه انقدر کامل جامع اموزش میدین تشکر ویژه ای دارم ازتون🙏🌱🫱🏽‍🫲🏻

  10. سلام مجدد به شما
    فقط خواستم تشکر کنم بابت آموزش ارزشمندتون و نکات ریزی که گفته شد و امشب به این جلسه رسیدم. یکم کند پیش میرم چون همزمان با کارم دارم آموزش میبینم و یه مدت مجبورم همزمان پیش ببرم تا انشاالله بتونم توی این حوزه کار کنم یک روزی… ولی مهم اینه که پیش میبرم هر طوری هست. ممنونم که انقدر دقیق و با جزئیات این آموزش رو گذاشتید 🙂

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

      موفق باشید.

  11. با سلام و خسته نباشید
    ممنونم از آموزش های بسیار عالی تون که خیلی صبورانه هست
    و با گفتن نکات بسیار ریز من واقعا لذت میبرم
    امیدوارم سلامت و تندرست و موفق باشید

  12. سلام وقت شما بخیر
    یکسری از تنظیماتی که در ویدیو توضیح میدین الان دیگه در اکانت رایکان نیست و حتما باید بخریم اشتراکش رو. مثل دولوپ مود

    1. درود بر شما. وقت بخیر
      در خصوص dev mode بله این قابلیت ابتدا رایگان بود و بعداً پولی شد. اما سایر بخش‌ها همه هستند. فقط کمی نرم‌افزار بروز شده و ظاهرش کمی تغییر کرده که البته چندان زیاد نیست و قابل تشخیص هست. (فعلا نسخه پولی را نخرید، ابتدا چند پروژه طراحی کنید و منتشر کنید. بخشی از پروژه‌ها در ایران نیاز به اکانت پولی فیگما ندارند).

      موفق باشید.

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

    1. درود بر شما. وقت بخیر
      درست می فرمائید. بروز شده اما تفاوت زیاد نیست. حتما بعدا ویدئویی را برای آپدیت‌های فیگما ارائه خواهم کرد. اما این را هم عرض کنم که (از نظر بصری) صرفا جای برخی از تنظیمات عوض شده است.

      موفق باشید.

  14. سلام و احترام
    آقا علیرضا بابا دمت گرم
    خیلی عالیه آموزش هات
    ماشالله بهت ماشالله

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

    1. درود بر شما. وقت بخیر
      سپاسگزارم آقای باقری. امیدوارم که اندک کوشش بنده بتواند ذره‌ای مفید واقع بشود.

      ارادتمندم. موفق باشید.

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

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

  17. سلام وقت بخیر
    فونت هایی که استفاده کردید مثل pinar رو از کجا میتونیم دانلود کنیم؟

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

  18. سلام وقت شما بخیر
    در شرکت شما امکان کارآموزی وجود دارد؟ در زمینه ui ,ux؟ ایا جای رو میشناسید که این امکان رو داشته باشه؟

    1. درود بر شما. وقت بخیر
      اگر مایل بودید رزومه خودتان را در صفحه فرصت‌های شغلی، ارسال بفرمائید.

      از طریق سایت‌هایی مثل jobinja هم می‌توانید فرصت‌های شغلی و کارآموزی را مشاهده و در صورت تمایل Apply کنید.
      موفق باشید.

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

    1. درود بر شما.
      منظور همان افکت گلس مورفیسم است؟ اگر این افکت مدنظر هست، شما می‌توانید روی لایه تصویر، یک فریم بیاندازید و افکت را به آن فریم اختصاص بدهید و opacity را کم کنید تا تصویر شیشه‌ای شده، نمایان شود.

      موفق باشید.

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

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

      موفق باشید.

    1. درود بر شما. روز بخیر

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

      موفق باشید.

  21. سلام و درود
    دوره ی بسیار کامل و عالی بود.واقعا ازتون سپاسگزارم
    خیلییی استفاده کردم😍💖
    باتشکر از مجموعه ی نوآوری‌رسام

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

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

متخصصین آژانس نوآوری رسام
فرم درخواست پروژه و مشاوره
تماس با کارشناسان رسام: 09351436045