طراحی Interactive Components در فیگما

در این جلسه، طراحی کامپوننت و UI Kit های تعاملی را خواهید آموخت. interactive component ها به ما کمک می‌کنند تا بدون ساختن صفحات زیاد، بین کامپوننت‌های خود نیز اینترکشن بسازیم. اگر خاطرتان باشد و جلسات قبل را مشاهده فرموده باشید آموزش ساخت کامپوننت و واریانت در فیگما را کامل در جلسه خاص آن، توضیح دادیم. اما نکته اینجاست که آیا می‌توانیم بین واریانت‌های خود هم اینترکشن بسازیم؟ به عنوان مثال، همان کامپوننت دکمه که ساختیم را کاری کنیم که با کلیک و یا hover تغییر رنگ و یا استایل بدهد. یا مثلا یک آکاردئون بسازیم و آن کامپوننت را کاری کنیم که با کلیک باز و بسته بشود. دکمه‌های رادیویی، چک‌باکس، سوئیچ باتن، فرم و هر کامپوننتی که بسازیم، نیاز به این خواهند داشت که پس از ساخت واریانت‌ها و stateهای مختلف، به صورت interactive component در بیایند. شاید از خود بپرسید که آیا در جلسه قبل که آموزش تب پروتوتایپ فیگما بیان شد، نمی‌توان دکمه و یا کامپوننتی ساخت؟ پاسخ این است که عملا از همان تب استفاده می‌شود. اما بین آیتم‌های واریانت. در واقع می‌توان گفت چیز جدیدی اضافه نشده است. در جلسه قبل شما کامپوننت‌ها را با اتصال صفحات یا فریم‌ها به یکدیگر ساختید اما اینجا گزینه‌های واریانت را به یکدیگر متصل می‌کنید. افزون بر این، شما با ساخت این کامپوننت‌های تعاملی جذاب، کار خود را نیز آسان‌تر کرده‌اید. در واقع شما یکبار آنها را می‌سازید و ممکن است آنها را در صفحات زیادی استفاده کنید. به سخن دیگر، اگر منوی همبرگری خود را بسازید، آنها در همه صفحات می‌توانید استفاده کنید و بعدا مدیریت و ویرایش آن کامپوننت و اینترکشن‌های آن نیز آسان بوده و باعث می‌شود بتوانید هرجا آن منوی همبرگری که استفاده شده را ویرایش کنید و این سرعت شما را بسیار بالا خواهد برد. در صورت تمایل می‌توانید از طریق وب‌سایت آژانس نوآوری رسام نیز ویدئوهای آموزشی را مشاهده بفرمائید. لینک دوره https://rasam.agency/ui-course آدرس اینستاگرام https://instagram.com/rasam.agency آدرس لینکدین https://www.linkedin.com/company/rasamagency