آموزش فیگما – ساخت کامپوننت های اینتراکتیو در Figma

اخیرا فیگما ویژگی کامپوننت های اینتراکتیو را از حالت آزمایشی خارج کرد و الان همه می تونن از آن در ساخت پروتوتایپ های پیشرفته تر از آن استفاده کنند و در این آموزش می خواهیم به آن بپردازیم.

آموزش جامع ساخت پروتوتایپ در فیگما و Multiple Flows

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

آموزش فیگما – Auto Layout و طراحی ریسپانسیو با آن در Figma

ویژگی Auto Layout در فیگما این امکان را به ما می دهد که بتوانیم UI هایی رو طراحی بکنیم که بسته به شرایط مختلف از جمله تغییر سایز اسکرین یا صفحه نمایش بتونن خودشون رو تغییر شکل بدن و به عبارتی Auto Layout به ما کمک می کنه که بتونیم طرحمون رو راحت تر ریسپانسیو کنیم.

آموزش طراحی یک عنصر با بینهایت حالت با Variants در Figma

در حالت عادی قصد دارید از دکمه ها با حالت های مختلف در قسمت های مختلف طراحی رابط کاربری UI/UX استفاده کنید و هر بار باید بدنبال حالت مورد نظر خود باشید. Variants در Figma دقیقا این مشکل را به زیبایی حل می کند و شما همه ی حالت ها را یکبار طراحی و از یک نمونه آن در سراسر طراحی UI خود استفاده می کنید. برای تغییر حالت آن فقط کافیست از لیستی که خود شما آن را نامگذاری کردید خیلی راحت حالت مورد نظرتان را انتخاب کنید تا سریع شکل آیتم یا دکمه تغییر پیدا کند.

آموزش جامع Figma – کار با پنل Design در فیگما 2021 –قسمت دوم

در آموزش جامع Figma – کار با پنل Design در فیگما 2021 –قسمت دوم به بررسی ویژگی های پرکاربردترین پنل در Figma می پردازم. پنل Design در فیگما شامل ویژگی های مختلف عنصری است که انتخاب کرده اید. به عنوان مثال اگر شما یک شکل در Figma انتخاب کرده باشید در پنل دیزاین ویژگی هایی مثل اندازه ، مکان ، رنگ ، رنگ حاشیه ، گردی گوشه ها ، انواع Effect مثل سایه دادن یا تار کردن و در نهایت خروجی گرفتن از آن را در اختیار شما قرار می دهد.

آموزش جامع فیگما – ساخت پروتوتایپ و Constraints در Figma 2021 – قسمت سوم

در قسمت سوم سری آموزش های جامع فیگما Figma به سراغ ساخت پروتوتایپ و استفاده از ویژگی Constraints که برای طراحی ریسپانسیو یا واکنش گرا نیز استفاده می شود می پردازم.

آموزش جامع Figma – کار با ابزارها و محیط فیگما 2021 – قسمت اول

در آموزش جامع Figma - کار با ابزارها و محیط فیگما 2021 - قسمت اول به سراغ نحوه نصب و کار با ابزارها و محیط فیگما می رویم. در ابتدای چگونگی نحوه دانلود و نصب فیگما ، نرم افزار نمایش طراحی روی موبایل فیگما و نرم افزار نصب فونت های سیستم بر روی فیگما را بررسی میکنیم. سپس قسمت داشبورد فیگما که شامل بخشی برای نمایش پروژه های اخیر شما یا تیم هایی که در حال کار با آن ها هستید می پردازم. در ادامه به سراغ برسی پنل لایه ها / صفحه ها می روم و شروع به معرفی ابزارهای اصلی فیگما میکنم. بعد از معرفی ابزار و نحوه کار ابزارهای مختلف Figma به سراغ ویژگی کامپوننت می روم و بعد از تعریف آن نحوه ساخت یک کامپوننت دکمه را به شما در فیگما آموزش می دهم.

آموزش فیگما جم – وایت برد برای انواع کارهای دیزاین از FigJam

فیگما جم یا Figma Jam یا فیگ جم را مثل یک وایت برد خیلی بزرگ در نظر بگیرید که با آن می توانید کارهای مختلفی مثل ساخت یوزر فلو، وایرفریم، ساخت طرح پیشنهادی، کارت سورتینگ و موارد مختلف و زیاد دیگری را انجام دهید.

آموزش فیگما – نصب فونت های فارسی و فارسی نویسی در Figma 2021 و Adobe Xd

در این ویدیو می خواهیم نحوه ی نصب و استفاده از فونت های فارسی در فیگما Figma و Adobe Xd 2021 را به شما آموزش دهم. بصورت کلی 3 روش نصب و استفاده از فونت های فارسی یا به عبارتی فارسی نویسی در فیگما را به شما آموزش می دهم.