آموزش مقدمه ای بر طراحی رابط کاربری: اصول طراحی رابط کاربری برای طراح UX/UI (+ تمرین طراحی Figma)
Intro to UI Design: User Interface Design Principles for UX/UI Designer (+Figma Design Exercise)
امروز قصد داریم با اصول طراحی UI آشنا شویم.
وقتی به طراحی UI نگاه می‌کنیم، معمولاً می‌توانیم بگوییم که کدام طراحی بهتر عمل می‌کند، اما وقتی شروع به کار روی طرح‌های خود میکنید، ناگهان دیگر آنقدرها هم آسان نیست.
راز این توزیع بی‌نقص فضا، اندازه و کنتراست که برای ما بسیار خوشایند به نظر می‌رسد چیست؟
من اصول طراحی رابط کاربری و اینکه چه چیزی، چگونه و چرا تفاوت ایجاد می کند را به شما نشان خواهم داد.
ما این موارد را بررسی خواهیم کرد:
- جلوه زیبایی شناختی-قابلیت استفاده - چرا اصلاً زحمت بکشید؟
- سلسله مراتب بصری چیست؟
- قانون Prägnanz - سادگی کلید است!
- قانون شباهت - از رنگ، اندازه و شکل برای ایجاد یک سیستم طراحی استفاده کنید
- کمی بیشتر در مورد اندازه هدف متن و لمس
- قانون مجاورت – فاصله بین سیستم ها و شبکه ها
- قانون منطقه مشترک - ایجاد بخش ها و اضافه کردن ساختار به طرح شما
- اثر Von Restorff - جلب توجه در جایی که به آن نیاز دارید
- قانون سرنوشت مشترک – پیش بینی رفتار
- واکنش احشایی - احساس در طراحی شما
ما با طراحی وب‌سایت مشترک خود از یک Wireframe، با استفاده از تمام دانش جدید خود، کار را به پایان خواهیم رساند.
اگر در طراحی UX تازه کار هستید یا می خواهید مهارت های خود را تقویت کنید، این دوره برای شما مناسب است.
مطمئن شوید که قسمت اول این مجموعه را در اینجا در Skillshare بررسی کنید: اصول طراحی UX!
© moonlearning.io با یادگیری ماه
به‌عنوان یک پروژه کلاسی، ما یک وب‌سایت فضایی مشترک از یک Wireframe مشخص می‌سازیم. شما می توانید از این پروژه در نمونه کار خود استفاده کنید!
برای شروع ساخت، چارچوب و برخی عناصر نام تجاری به شما داده می شود. با کمک اصولی که در این دوره یاد گرفتیم، در کمترین زمان یک طراحی رابط عالی را راه اندازی خواهید کرد.
ورزش راه حلی برای الهام بخشی دارد.
برای رسیدن به فایل های تمرین ،
لطفاً توجه داشته باشید که من فقط در Figma تدریس می کنم و بنابراین فقط فایل های Figma را ارائه می دهم (بدون Sketch، بدون AdobeXD). به هر حال، می توانید یک حساب کاربری Figma را به صورت رایگان (محدود به مقدار مشخصی پروژه) راه اندازی کنید و فایل را به صورت رایگان مشاهده کنید.
فونتی که من استفاده می کنم Poppins است، یک فونت گوگل. اگر برنامه Figma را نصب کرده اید، باید به طور خودکار نشان داده شود. اگر با Figma در مرورگر کار می کنید، لطفاً حتما دانلود و نصب کنید: https://fonts.google.com/specimen/Poppins
درس ها Lessons
-
رمزگشایی: طراحی UX/UI چیست؟ Demystifying: What is UX/UI Design?
-
تبلیغاتی Promo
-
متشکرم! Thank You!
-
قانون Prägnanz - سادگی کلید است! Law of Prägnanz – Simplicity is key!
-
کمی بیشتر در مورد متن و اندازه دکمه A little more on text and button size
-
جلوه کاربردی زیبایی شناختی - چرا حتی طراحی را به خود زحمت دهید؟ Aesthetic Usability Effect – Why even bother with design?
-
قانون سرنوشت مشترک - پیش بینی رفتار Law of Common Fate – Behavioural prediction
-
می خواهید مقداری UX اضافه کنید؟ Wanna add some UX?
-
سلام و یک کلمه در مورد نظریه گشتالت Hello and a word on Gestalt Theory
-
EXERCISE --> وب سایت همکاری Figma EXERCISE --> Figma co-working website
-
اثر Von Restorff - جلب توجه در جایی که به آن نیاز دارید Von Restorff Effect – Drawing attention where you need it
-
قانون مجاورت - فاصله بین سیستم ها و شبکه ها Law of Proximity – Spacing systems and grids
-
قانون منطقه مشترک - ایجاد بخش هایی در طرح بندی شما Law of Common Region – Creating sections in your layout
-
سلسله مراتب بصری چیست؟ What is Visual Hierarchy?
-
قانون تشابه - رنگ، اندازه و شکل Law of Similarity – colour, size, and shape
-
دانلود مواد Download Material
https://donyad.com/d/672c38
Christine Vallaure
UI/UX DESIGN + CODE
طراح UX/UI با علاقه به کد و بنیانگذار .
من در سطح بین‌المللی، داخلی و از راه دور روی پروژه‌هایی برای برندها، آژانس‌ها و استارت‌آپ‌های پیشرو کار کرده‌ام. من عمیقاً به ایجاد محصولاتی با فکر و زیبایی اهمیت می دهم. کارهای من از ایده‌های اولیه گرفته تا طرح‌ها، وایرفریم‌ها، نمونه‌سازی اولیه و تنظیم جلویی را شامل می‌شود.
علاوه بر پروژه‌های مشتری (بازدید برای منابع)، من در حال ساختن یک پلتفرم یادگیری آنلاین برای طراح UX/UI. من همچنین در مورد کد طراحی در رسانه و من می نویسم.
برای اطلاعات بیشتر درباره من لطفاً به من مراجعه کنید صفحه LinkedIn .
نمایش نظرات