آموزش Figma: از طراحی تا پیاده سازی CSS

Figma: From Design to CSS Implementation

نکته: آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
نمونه ویدیوها:
توضیحات دوره:

شما طرح‌های فوق‌العاده‌ای ایجاد کرده‌اید، اما چگونه می‌توانید آنها را به دارایی‌های آماده کد تبدیل کنید که توسعه‌دهندگان شما می‌توانند از آنها استفاده کنند؟ در این دوره عملی، استاد دانشگاه جوزف لابرک به شما کمک می‌کند تا بفهمید فایل‌های Figma شما به چه چیزی نیاز دارند تا به خوبی به «گفتار برنامه‌نویس» ترجمه شوند. با نحوه تعریف ویژگی های صادرات تصویر و همچنین صادرات و سازماندهی تصاویر خود آشنا شوید. نحوه استفاده از فضای کاری Inspect را بیابید، پروژه خود را در CSS مستند کنید، سند طراحی را پر کنید و یک فایل CSS تولید شده توسط Figma تعریف کنید. بعلاوه به ایجاد یک سند HTML، جایگزینی ویژگی های تولید شده توسط Figma برای CSS تمیز و اصلاح طرح خود از Figma بروید.


سرفصل ها و درس ها

معرفی Introduction

  • پیاده سازی CSS از طرح های Figma شما Implementing CSS from your Figma designs

  • در حال راه اندازی Getting set up

1. تولید دارایی های تصویری 1. Producing Image Assets

  • مروری بر پروژه طراحی An overview of the design project

  • تعریف ویژگی های صادرات تصویر Defining image export properties

  • صادرات و سازماندهی تصاویر Exporting and organizing images

2. ترجمه قوانین CSS 2. Translating CSS Rules

  • با استفاده از فضای کاری Inspect Using the Inspect workspace

  • مستندسازی CSS پروژه Documenting the project CSS

  • پر کردن سند طراحی Populating the design document

  • تعریف سند CSS Defining a CSS document

3. پیاده سازی CSS در HTML 3. Implementing CSS within HTML

  • ایجاد یک سند HTML Creating an HTML document

  • جایگزینی عناصر Figma برای CSS Replacing Figma elements for CSS

  • اصلاح طرح از Figma Refining the design from Figma

نتیجه Conclusion

  • بعدش چی؟ What's next?

نمایش نظرات

Linkedin (لینکدین)

لینکدین: شبکه اجتماعی حرفه‌ای برای ارتباط و کارآفرینی

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

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

آموزش Figma: از طراحی تا پیاده سازی CSS
جزییات دوره
48m
13
Linkedin (لینکدین) Linkedin (لینکدین)
(آخرین آپدیت)
-
- از 5
ندارد
دارد
دارد
جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Joseph Labrecque Joseph Labrecque

استاد دانشگاه، مدرس Adobe، رئیس استودیو

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

جوزف نزدیک به دو دهه تجربه در ساخت وب گویا دارد. راه حل های دسکتاپ و موبایل. او کتاب‌ها، مقالات و دوره‌های ویدئویی در زمینه فناوری‌های طراحی و توسعه، ابزارها و مفاهیم را از طریق ناشران مانند LinkedIn Learning، Peachpit Press و Adobe تالیف کرده است. او شرکت Fractured Vision Media, LLC را تأسیس کرد. یک استودیوی تولید رسانه های دیجیتال و وسیله نقلیه توزیع. جوزف استاد دانشگاه کلرادو بولدر کالج رسانه، ارتباطات و اطلاعات، و همچنین یک رهبر آموزش Adobe، Adobe Community Professional، و یکی از اعضای Adobe Partners by Design است.