آموزش طراحی و پروتوتایپ هدر ریسپانسیو وب‌سایت در فیگما (گام به گام) - آخرین آپدیت

دانلود How to Design & Prototype a Responsive Website Header in Figma (Step by Step)

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

در این دوره، ما یک هدر ریسپانسیو برای وب‌سایت در فیگما (Figma) طراحی و پروتوتایپ می‌کنیم؛ از همان مدل‌هایی که در سایت‌های واقعی می‌بینید، با منوی ناوبری تمیز، حضور قدرتمند برند و دکمه‌های فراخوان (CTA) واضح.

سرفصل‌های این دوره عبارتند از:

  • اصول کلیدی برای طراحی هدرهای موثر (همراه با مثال‌های واقعی)
  • ساختاربندی هدر برای تمامی اندازه‌های صفحه نمایش
  • استفاده از Auto Layout برای ایجاد ریسپانسیو سریع و آسان
  • افزودن دکمه CTA هوشمند (ساخته شده با کامپوننت‌های دوره‌های قبلی)
  • پروتوتایپ کردن منوی موبایل با Figma Make برای ایجاد تعامل کامل کاربر

اگر می‌خواهید یاد بگیرید چگونه آن دکمه را از ابتدا بسازید، حتماً آموزش مربوطه را مشاهده کنید؛ زیرا مکمل کامل این دوره است.

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

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

بیایید شروع کنیم و هدری طراحی کنیم که در هر محیطی عالی عمل کند.


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

درس ها Lessons

  • Welcome to the Class

  • Understanding Effective Headers

  • Designing the Website Header for Desktop

  • Designing the Website Header for Tablet and Mobile

  • Prototyping the Mobile Menu with Figma Make

نمایش نظرات

آموزش طراحی و پروتوتایپ هدر ریسپانسیو وب‌سایت در فیگما (گام به گام)
جزییات دوره
20m
5
Skillshare (اسکیل شیر) Skillshare (اسکیل شیر)
(آخرین آپدیت)
57
- از 5
ندارد
دارد
دارد
Adi Purdila
جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Adi Purdila Adi Purdila

طراح و توسعه دهنده وب

من Adi هستم و یک طراح وب از رومانی هستم.

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

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

من متاهل هستم و 2 فرزند دارم. خوب، اگر 9 سگ و 10 گربه را هم حساب کنید، در واقع 21 بچه.

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

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

آدریان جورج پوردیلا

"معلم عالی. در تئوری طراحی کمک کرد. امیدوارم کلاس های بیشتری در مورد طراحی وب و چیدمان رابط کاربری برگزار کند. متشکرم"

Pala Otz - طراحی با Figma: صفحه فرود برای برنامه موبایل

"پیگیری آسان، کلاس بسیار مفید با دستورالعمل های واضح و نکات و ترفندهای حرفه ای. واقعاً از آن لذت بردم، متشکرم ادی!"

Keresztes Kriszta Kincső - طراحی با Figma: صفحه فرود برای برنامه موبایل

"این به سادگی یک تجربه عالی بود. من کاملاً در فیگما تازه کار نبودم، اما چیزهای زیادی برای یادگیری با این دوره وجود داشت. سبک تدریس آرام و منظم آدی واقعاً هنگام پیگیری به من کمک زیادی کرد. او مانند استاد ذن است. Figma. متشکرم Adi. BTW، اگر تصمیم گرفتید یک دوره آموزشی در وب‌فلو برگزار کنید، من را در آن حساب کنید!"

Jochen Baum - طراحی با Figma: صفحه فرود برای برنامه موبایل

"دوره عالی و معلم جذاب واقعاً چیزهای زیادی یاد گرفت، نکات از معدن طلا بود"

آنتونی یائو - طراحی با Figma: صفحه فرود برای برنامه موبایل

"این کلاس نه تنها Figma را پوشش می‌دهد، بلکه نکات جالب UX/UI/Designer را نیز پوشش می‌دهد که من هرگز در مورد آنها نمی‌دانستم. قبلاً برخی از Figma را می‌شناختم که وارد این کلاس می‌شوند، اما پس از اتمام این کلاس، صادقانه می‌توانم بگویم من حتی با Figma راحت تر هستم. به طور کلی، از ساختار و گردش کار این کلاس لذت بردم. با تشکر Adi!"

کوین ویزکوند - طراحی با Figma: صفحه فرود برای برنامه موبایل

"متشکرم آدی، آموزش شما عالی است!"

آندرس لوپز - طراحی با Figma: صفحه فرود برای برنامه موبایل

"دوره فوق العاده و مربی عالی! با تشکر. من چیزهای زیادی یاد گرفتم و مشتاقانه منتظر دوره های اضافی در مورد Figma توسط آدی پوردیلا هستم."

Pawan Vora - طراحی با Figma: صفحه فرود برای برنامه موبایل

"این کلاس شگفت انگیز است! آدی پوردیلا یکی از کارآمدترین معلمانی است که من دیده ام. روش تدریس او به من انگیزه می دهد تا هر روز طراحی UI را مطالعه کنم. من دوست دارم کلاس های بیشتری از این قبیل ببینم!"

Aybike Anaçali - طراحی با Figma: صفحه فرود برای برنامه موبایل

"این کلاس برای مبتدیان در طراحی Figma و UI عالی است. Adi Purdila دروس را به شیوه ای واضح و جذاب می گذراند که برای مبتدیان منطقی است. کلاس های او ساختار خوبی دارند و پر از اطلاعات هستند بدون اینکه خیلی زیاد باشد. او همچنین پاسخگوی سوالات دانش آموزان در مورد درس است که برای یادگیری بسیار مفید است. :)"

جاش خاویر - طراحی با Figma: صفحه فرود برای برنامه موبایل