دسته طراحی و دیزاین

مرجع آموزش طراحی رابط و تجربه کاربری (UI/UX)، اصول دیزاین سیستم‌ها و مسیر حرفه‌ای شدن در دنیای طراحی محصول دیجیتال. طراحی گرافیک و صفحه آرایی، طراحی وب و تدوین ویدیو

آموزش جامع Adobe Xd – طراحی آیکان با Pathfinder – قسمت پنجم

آموزش جامع Adobe Xd - طراحی آیکان با Pathfinder - قسمت پنجم

در قسمت پنجم آموزش جامع Adobe Xd به سراغ دستورات Boolean یا Path Finder می روم که بوسیله آن شما می توانید شکل های جدیدی در Xd طراحی کنید. فرض کنید که شما قصد دارید قسمتی از NavBar را برای دکمه Add به صورت 6 ضلعی در بیاورید.

ادامه مطلبآموزش جامع Adobe Xd – طراحی آیکان با Pathfinder – قسمت پنجم

Pseudo-elements ها در CSS چی هستند و چه کاربردی دارند؟

Pseudo-elements ها در CSS چی هستند و چه کاربردی دارند؟

Pseudo-elements ها در CSS کلمات کلیدی هستند که به انتخابگرها برای انتخاب قسمتی از محتوای عنصر اضافه می شوند. با برخی از این انتخابگرها می توان محتوای مجازی برای عناصر بوجود آورد و آنها را در CSS هدف قرار داد.
در ادامه لیست تمام pseudo-elementها آمده است و می توانید برای بررسی دقیق هر کدام به صفحه مخصوص به آن مراجعه کنید.

ادامه مطلبPseudo-elements ها در CSS چی هستند و چه کاربردی دارند؟

آموزش ابزار متن و فارسی نویسی در Adobe Xd – قسمت سوم

آموزش ابزار متن و فارسی نویسی در Adobe Xd - قسمت سوم

در قسمت سوم آموزش جامع طراحی UI/UX با Adobe Xd به سراغ ابزار پرکابرد متن یا Text رفتم تا نحوه کار کردن و همه تنظیمات مربوط به آن بعلاوه نکاتی در مورد فارسی نویسی به شما آموزش دهم.

ادامه مطلبآموزش ابزار متن و فارسی نویسی در Adobe Xd – قسمت سوم

آموزش جامع CSS – چطور دکمه بسازیم؟

آموزش جامع CSS - چطور دکمه بسازیم؟

در این آموزش CSS به این می پردازم که چطور یک دکمه یا Button را بوسیله دستورات سی اس اس و HTML بسازید.
در ادامه به شما تعدادی استایل را یاد میدهم که بتوانید حالتی مدرن و امروزی به دکمه ی خود بدهید که از جمله آن گرد کردن حاشیه دکمه ها و تغییر رنگ بک گراند آن است. در بخش اول فیلم شما یاد میگیرید که چطور به سادگی می توانید یک لینک را تبدیل به یک دکمه کنید و در ادامه با استایل های مختلف دکمه های مختلفی بسازید.

ادامه مطلبآموزش جامع CSS – چطور دکمه بسازیم؟

آموزش طراحی شکل های مختلف و تنظیمات آنها در Adobe Xd – قسمت دوم

آموزش طراحی شکل های مختلف و تنظیمات آنها در Adobe Xd - قسمت دوم

در قسمت دوم از آموزش طراحی UI/UX با Adobe Xd من شکل های مختلفی که در این برنامه وجود دارد را رسم و نکات و تنظیمات هر کدام از آن ها را بررسی می کنم. در طراحی رابط کاربری ما با شکل های ساده ساختار و ظاهر کلی سرویس مورد نظرمان که می تواند وبسایت، اپلیکیشن و یا هر نوع دیگری باشد را طراحی می کنیم.

ادامه مطلبآموزش طراحی شکل های مختلف و تنظیمات آنها در Adobe Xd – قسمت دوم

چطور مشتری خوب پیدا کنیم و چگونه به آنها قیمت درست بدهیم؟ – قسمت اول

چطور مشتری خوب پیدا کنیم و چگونه به آنها قیمت درست بدهیم؟ - قسمت اول

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

ادامه مطلبچطور مشتری خوب پیدا کنیم و چگونه به آنها قیمت درست بدهیم؟ – قسمت اول

آموزش جامع Adobe XD – محیط ظاهری و آرتبورد ها – قسمت اول

آموزش جامع Adobe XD - محیط ظاهری و آرتبورد ها - قسمت اول

در یک سری ویدیوهای دنباله دارم من میخواهم طراحی UI/UX را با استفاده از Adobe XD به شما آموزش دهم.
در قسمت اول این سری من ابتدا نحوه دانلود و نصب ادوبی ایکس دی را به شما آموزش می دهم و سپس به سراغ معرفی قسمت های مختلف Adobe XD می روم و در ادامه نحوه ساخت و کاربرد آرتبورد های مختلف را به شما آموزش میدهم.
سپس بعضی از تنظیمات مختلف در پنل Inspector را معرفی و در نهایت با محوه فعالسازی و استفاده از خطوط راهنمای مختلف و همچنین ستون بندی آرتبورد این قسمت را ادامه می دهم.

ادامه مطلبآموزش جامع Adobe XD – محیط ظاهری و آرتبورد ها – قسمت اول

10 افزونه کاربردی مرورگر برای طراحان رابط کاربری UI

10 افزونه کاربردی مرورگر برای طراحان رابط کاربری UI

در این آموزش من 10 افزونه فوق العاده را برای مرورگرهای کرومیوم یعنی کروم و مایکروسافت اج به که برای همه ی طراحان به خصوص طراحان رابط و تجربه کاربری ( UI/UX ) خیلی کاربردی است را به شما معرفی و نحوه استفاده از آن ها را آموزش می دهم.

ادامه مطلب10 افزونه کاربردی مرورگر برای طراحان رابط کاربری UI

چطور در CSS چندین تصویر به پس زمینه عنصری بدهیم؟

چطور در CSS چندین تصویر به پس زمینه عنصری بدهیم؟

در ادامه آموزش قبل می خواهیم اینبار چند تصویر را به پس زمینه یا Background یک عنصر بدهیم. این کار براحتی قابل انجام هست و کافی است شما به جای دادن یک آدرس، دو یا چند آدرس را به عنوان url در پراپرتی background معرفی کنید که در فیلم کاملا متوجه نحوه نوشتن آن می وشوید.

ادامه مطلبچطور در CSS چندین تصویر به پس زمینه عنصری بدهیم؟