دسته طراحی رابط کاربری UI/UX

طراحی رابط کاربری – User interface design

All (245)DeXignerNews | خبرنامه هفتگی دیزاین (28)showcases - نمونه کارها (27)Tutorial - آموزش (133)Unboxing - آنباکس و بررسی (2)ابزارهای کاربردی (2)دوره آموزش طراحی UI و UX (1)سبک زندگی و کارآفرینی (7)کتاب (1)هوش مصنوعی - AI (20)

آموزش ساخت دیزاین سیستم در فیگما – قسمت دوم

آموزش ساخت دیزاین سیستم در فیگما - قسمت دوم
در یک سری ویدیوهای آموزشی میخوام بخش هایی از یک دیزاین سیستم را در فیگما با هم درست کنیم. در این ویدیو من پیش نیازهایی که شما باید برای ساخت یک دیزاین سیستم بلد باشید رو به شما آموزش می دهم. با من همراه باشید.
ادامه مطلبآموزش ساخت دیزاین سیستم در فیگما – قسمت دوم

دیزاین سیستم چیست و تفاوت آن با پترن لایبرری و استایل گاید

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

آموزش فیگما – ساخت کامپوننت های اینتراکتیو در Figma

آموزش کامپوننت های اینتراکتیو فیگما
اخیرا فیگما ویژگی کامپوننت های اینتراکتیو را از حالت آزمایشی خارج کرد و الان همه می تونن از آن در ساخت پروتوتایپ های پیشرفته تر از آن استفاده کنند و در این آموزش می خواهیم به آن بپردازیم.
ادامه مطلبآموزش فیگما – ساخت کامپوننت های اینتراکتیو در Figma

آموزش فیگما – 7 پلاگین فوق العاده کاربردی Figma 2021 – قسمت سوم

آموزش فیگما - 7 پلاگین فوق العاده کاربردی Figma 2021 - قسمت سوم
در فیلم آموزشی 7 پلاگین فوق العاده کاربردی Figma 2021 - قسمت سوم قصد دارم 7 پلاگین دیگر را به همراه نحوه کار آن را به شما معرفی و آموزش دهم.
ادامه مطلبآموزش فیگما – 7 پلاگین فوق العاده کاربردی Figma 2021 – قسمت سوم

دسترسی پذیری یا Accessibility در طراحی UI/UX چیست؟

دسترسی پذیری یا Accessibility در طراحی UI/UX چیست؟
در این ویدیو من میخوام یک بخش حیاتی از پروسه UX Design را به شما آموزش بدهم که براحتی اکثر طراحان اون رو نادیده می گیرند و آن هم دیزاین با ذهنیت Accessibility یا دسترسی پذیری است.
ادامه مطلبدسترسی پذیری یا Accessibility در طراحی UI/UX چیست؟

Atomic Design – طراحی اتمی چیست و کاربرد آن در ساخت دیزاین سیستم ها

Atomic Design - طراحی اتمی چیست و کاربرد آن در ساخت دیزاین سیستم ها
اگر می خواهید بدانید روش Atomic Design یا دیزاین اتمی چیست و چطور میتونید از آن در طراحی UI و ساخت دیزاین سیستم ها استفاده کنید با من در این آموزش همراه باشید.
ادامه مطلبAtomic Design – طراحی اتمی چیست و کاربرد آن در ساخت دیزاین سیستم ها

آموزش فیگما جم – وایت برد برای انواع کارهای دیزاین از FigJam

آموزش فیگما جم - وایت برد برای انواع کارهای دیزاین و تیمی از FigJam
فیگما جم یا Figma Jam یا فیگ جم را مثل یک وایت برد خیلی بزرگ در نظر بگیرید که با آن می توانید کارهای مختلفی مثل ساخت یوزر فلو، وایرفریم، ساخت طرح پیشنهادی، کارت سورتینگ و موارد مختلف و زیاد دیگری را انجام دهید.
ادامه مطلبآموزش فیگما جم – وایت برد برای انواع کارهای دیزاین از FigJam

آموزش Adobe Xd از صفر در 20 دقیقه با مثال کاربردی

آموزش Adobe Xd از صفر در 20 دقیقه با مثال کاربردی
در این قسمت Adobe Xd قصد دارم طراحی UI/UX را با یک مثال کاربردی از طراحی اپلیکیشن سفارش غذا در 20 دقیقه به شما آموزش دهم.
ادامه مطلبآموزش Adobe Xd از صفر در 20 دقیقه با مثال کاربردی

آموزش جامع ساخت پروتوتایپ در Adobe Xd – قسمت ششم

آموزش جامع ساخت پروتوتایپ در Adobe Xd - قسمت ششم
در این آموزش قصد دارم نحوه ساخت پروتوتایپ و اینتراکشن ها در ادوبی ایکس دی / Adobe Xd را از صفر و بصورت جامع به شما آموزش دهم. در واقع شما با پروتوتایپ اینتراکشن ها یا حرکت های تعاملی مختلفی به طرحتون اضافه می کنید.
ادامه مطلبآموزش جامع ساخت پروتوتایپ در Adobe Xd – قسمت ششم

تفکر طراحی یا Design Thinking چیست و چطور در طراحی UI/UX از آن استفاده کنیم؟

تفکر طراحی یا Design Thinking چیست و چطور در طراحی UI/UX از آن استفاده کنیم؟
در این آموزش به معرفی و نحوه استفاده از روش تفکر طراحی یا Design Thinking می پردازم. تفکر طراحی یک روش غیر خطی 5 مرحله ای است که شما می توانید با استفاده از آن انواع مشکلات طراحی UI/UX ، مشکلات شغلی و تجاری و حتی مشکلات شخصی خود را حل کنید.
ادامه مطلبتفکر طراحی یا Design Thinking چیست و چطور در طراحی UI/UX از آن استفاده کنیم؟

آموزش جامع ساخت پروتوتایپ در فیگما و Multiple Flows

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

آموزش فیگما – Auto Layout و طراحی ریسپانسیو با آن در Figma

آمورش فیگما - Auto Layout و طراحی ریسپانسیو با آن در Figma
ویژگی Auto Layout در فیگما این امکان را به ما می دهد که بتوانیم UI هایی رو طراحی بکنیم که بسته به شرایط مختلف از جمله تغییر سایز اسکرین یا صفحه نمایش بتونن خودشون رو تغییر شکل بدن و به عبارتی Auto Layout به ما کمک می کنه که بتونیم طرحمون رو راحت تر ریسپانسیو کنیم.
ادامه مطلبآموزش فیگما – Auto Layout و طراحی ریسپانسیو با آن در Figma

آموزش تایپوگرافی در UI – تنظیم سایز متن ها و فونت در طراحی رابط کاربری

آموزش تایپوگرافی در UI - تنظیم سایز متن ها و فونت در طراحی رابط کاربری
در این آموزش تایپوگرافی در طراحی رابط کاربری UI قصد دارم به شما نحوه ی تنظیم سایز متن ها و فونت را در طراحی رابط کاربری UI آموزش دهم.در واقع شما باید قبل از شروع هر پروژه ای سایز متن ها یا Text های مختلفی که در رابط کاربری UI وجود دارد را تنظیم کنید و سپس با توجه به آن در طراحی خود الگو بگیرید و بقیه صفحات را طراحی کنید تا یک انسجام در کل طرح شما ایجاد شود.
ادامه مطلبآموزش تایپوگرافی در UI – تنظیم سایز متن ها و فونت در طراحی رابط کاربری

طراحی تجربه کاربری UX را از صفر چطور و از کجا یاد بگیریم؟

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

آموزش تئوری رنگ ها در طراحی رابط کاربری و گرافیک – صفر تا صد – قسمت اول

آموزش تئوری رنگ ها در طراحی رابط کاربری و گرافیک - صفر تا صد - قسمت اول
در یک سری ویدیو دنباله دار من به همه قوانین و اصطلاحات مربوط به رنگ ها در دیزاین می پردازم ( طراحی رابط کاربری UI – طراحی گرافیک و صفحه آرایی ) و با همدیگر نمونه های کاربردی از هر حوزه را بررسی و نکاتی در مورد آن ها به شما آموزش می دهم.
ادامه مطلبآموزش تئوری رنگ ها در طراحی رابط کاربری و گرافیک – صفر تا صد – قسمت اول

آموزش فیگما – نصب فونت های فارسی و فارسی نویسی در Figma 2021 و Adobe Xd

آموزش فیگما - نصب فونت های فارسی و فارسی نویسی در Figma 2021 و Adobe Xd
در این ویدیو می خواهیم نحوه ی نصب و استفاده از فونت های فارسی در فیگما Figma و Adobe Xd 2021 را به شما آموزش دهم. بصورت کلی 3 روش نصب و استفاده از فونت های فارسی یا به عبارتی فارسی نویسی در فیگما را به شما آموزش می دهم.
ادامه مطلبآموزش فیگما – نصب فونت های فارسی و فارسی نویسی در Figma 2021 و Adobe Xd

آموزش جامع فیگما – ساخت پروتوتایپ و Constraints در Figma 2021 – قسمت سوم

آموزش جامع فیگما – ساخت پروتوتایپ و Constraints در Figma 2021 – قسمت سوم
در قسمت سوم سری آموزش های جامع فیگما Figma به سراغ ساخت پروتوتایپ و استفاده از ویژگی Constraints که برای طراحی ریسپانسیو یا واکنش گرا نیز استفاده می شود می پردازم.
ادامه مطلبآموزش جامع فیگما – ساخت پروتوتایپ و Constraints در Figma 2021 – قسمت سوم

آموزش جامع Figma – کار با پنل Design در فیگما 2021 –قسمت دوم

آموزش جامع فیگما – بررسی ویژگی‌های پنل Design – قسمت دوم
در آموزش جامع Figma – کار با پنل Design در فیگما 2021 –قسمت دوم به بررسی ویژگی های پرکاربردترین پنل در Figma می پردازم. پنل Design در فیگما شامل ویژگی های مختلف عنصری است که انتخاب کرده اید. به عنوان مثال اگر شما یک شکل در Figma انتخاب کرده باشید در پنل دیزاین ویژگی هایی مثل اندازه ، مکان ، رنگ ، رنگ حاشیه ، گردی گوشه ها ، انواع Effect مثل سایه دادن یا تار کردن و در نهایت خروجی گرفتن از آن را در اختیار شما قرار می دهد.
ادامه مطلبآموزش جامع Figma – کار با پنل Design در فیگما 2021 –قسمت دوم

آموزش جامع Figma – کار با ابزارها و محیط فیگما 2021 – قسمت اول

آموزش جامع Figma - کار با ابزارها و محیط فیگما 2021 - قسمت اول
در آموزش جامع Figma - کار با ابزارها و محیط فیگما 2021 - قسمت اول به سراغ نحوه نصب و کار با ابزارها و محیط فیگما می رویم. در ابتدای چگونگی نحوه دانلود و نصب فیگما ، نرم افزار نمایش طراحی روی موبایل فیگما و نرم افزار نصب فونت های سیستم بر روی فیگما را بررسی میکنیم. سپس قسمت داشبورد فیگما که شامل بخشی برای نمایش پروژه های اخیر شما یا تیم هایی که در حال کار با آن ها هستید می پردازم. در ادامه به سراغ برسی پنل لایه ها / صفحه ها می روم و شروع به معرفی ابزارهای اصلی فیگما میکنم. بعد از معرفی ابزار و نحوه کار ابزارهای مختلف Figma به سراغ ویژگی کامپوننت می روم و بعد از تعریف آن نحوه ساخت یک کامپوننت دکمه را به شما در فیگما آموزش می دهم.
ادامه مطلبآموزش جامع Figma – کار با ابزارها و محیط فیگما 2021 – قسمت اول
صفحه اصلی مشاوره و ثبت نام از طریق WhatsApp مشاوره و ثبت نام از طریق telegram