آموزش گردش کار خود را ساده کنید: فرآیند طراحی UI/UX کارآمد در Figma
Streamline your workflow: The efficient UI/UX design process in Figma
سلام، نام من نیکول است و من یک طراح UI/UX با بیش از ۷ سال تجربه هستم. با هم در این کلاس، می‌خواهیم یک نمونه اولیه سازگار و مقیاس‌پذیر در Figma در 30 دقیقه ایجاد کنیم، از فریم‌بندی سیمی تا تحویل به توسعه‌دهندگان. اگر آشنایی ندارید، Figma بهترین ابزار طراحی آنلاین مشارکتی است.
چرا در این کلاس شرکت کنید؟
این کلاس عالی است اگر بخواهید:
- سرعت گردش کار خود را افزایش دهید و 90 درصد در وقت خود صرفه جویی کنید
- نحوه استفاده از ویژگی های قدرتمند Figma را بیاموزید
- طرح های منسجم ایجاد کنید و از کارهای تکراری اجتناب کنید
- با در نظر گرفتن کل تیم به صورت مشترک طراحی کنید
- یک پروژه تعاملی کامل بدون خروج از برنامه بسازید
قرار است چه چیزی از این کلاس به دست بیاورم؟
در طول کلاس شما:
- فرآیند طراحی UI/ux را بیاموزید
- ایجاد قاب های تعاملی
- یک سیستم طراحی مقیاس پذیر بسازید
- یک نمونه اولیه تعاملی طراحی کنید
- با مشتریان همکاران همکاری کنید
هدف این کلاس چه کسانی است؟
این کلاس برای همه نوع افراد عالی است:
- به عنوان یک مبتدی، هنگام استفاده از Figma، فرآیند طراحی UI/UX را یاد خواهید گرفت.
- به عنوان یک طراح باتجربه، یاد خواهید گرفت که چگونه عملکرد خود را با ایجاد سیستم های طراحی سازگار بهینه کنید.
- اگر طراح هستید که در یک تیم کار می کند، همکاری را افزایش داده و تیم خود را خوشحال خواهید کرد.
- اگر فریلنسر هستید، با ۲ تا ۳ برابر سریع‌تر کار کردن، درآمد خود را افزایش خواهید داد.
توجه: از آنجایی که دوره آموزشی تا حد امکان کارآمد ساخته شده است، ممکن است ویدیوها را کمی خیلی سریع پیدا کنید. در این صورت، برای اعمال تمرینات مکث کنید و سپس ادامه دهید.
در دوره طراحی کامل من برای غیر طراحان ثبت نام کنید:
برای پروژه کلاس، یک نمونه اولیه ۵ صفحه‌ای در Figma طراحی خواهید کرد. اگر ایده ای برای طراحی ندارید، می توانید از Medium یا Twitter به عنوان مثال استفاده کنید، یا سفر اصلی Airbnb را با من دنبال کنید و طراحی کنید. سعی کنید یک وب سایت یا برنامه ساده و سازگار انتخاب کنید که دارای اجزای تکراری باشد.
پس از تماشای کلاس، این مراحل را دنبال کنید تا نمونه اولیه تعاملی خود را طراحی کنید:
- قاب های سیمی خود را روی کاغذ (5 صفحه) ترسیم کنید
- وایرفریم های خود را با استفاده از کامپوننت ها در Figma بسازید
- وایرفریم ها را تعاملی کنید
- به کتابخانه UI استایل بدهید و مارک و رنگ اضافه کنید
- نمونه اولیه را نهایی کنید
- صفحه‌ها را پاسخگو کنید و یک نسخه موبایل ایجاد کنید
- اختیاری: فرآیند را برای همه صفحه‌های دیگر تکرار کنید
با ارسال اسکرین شات از هر مرحله می‌توانید پیشرفت خود را به اشتراک بگذارید. فراموش نکنید که سؤالات و نگرانی های خود را پست کنید و من به شما کمک خواهم کرد.
این طرح Airbnb است که من ایجاد کردم:
درس ها Lessons
-
مقدمه Intro
-
مرحله 1: ساخت وایرفریم های خود Step 1: Building your wireframes
-
مقدمه ای بر Figma Intro to Figma
-
افکار نهایی Final thoughts
-
فرآیند طراحی The design process
-
مرحله 4: نمونه اولیه خود را نهایی کنید Step 4: Finalizing your prototype
-
چرا فیگما Why Figma
-
مرحله 3: طراحی سیستم طراحی خود را طراحی کنید Step 3: Styling your design system
-
مرحله 2: وایرفریم های خود را تعاملی کنید Step 2: Making your wireframes interactive
https://donyad.com/d/5018
Nicole Saidy
طراح، مربی، سخنران
من یک طراح UX هستم که علاقه زیادی به سفر، طراحی، همکاری و مربیگری دارد. من بیش از 7 سال تجربه در نمونه سازی، طراحی تجربه کاربری، کدگذاری جلویی، محصولات دیجیتال و شکل دادن به طراحان جدید از طریق فعالیت های خود به عنوان مربی، سخنران و وبلاگ نویس در جامعه طراحی دارم.
نمایش نظرات