انیمیشن زیبا برای Show/Hide Password 😍

طراحی شده توسط Claudio Scotto

#tip #learn #ux #gif
🆔 @iranUiUx 👈مطالب بیشتر

امروز قصد داریم یه وب سایت معرفی کنیم که خیلی جالبه😀

کار وب سایت uigradients چی هست؟ از اسمش هم پیداست که این سایت برای شما گرادینت های مختلفی ارائه میده و شما میتونید کد رنگ گرادینت رو تو طراحی های خودتون استفاده کنید😄

وب سایت : uigradients.com

ممنون از دوست عزیز بابت معرفی سایت
👤 @bug_fucker 🌺

#tip #learn #ui #ux #tool
🆔 @iranUiUx 👈مطالب بیشتر

در این پست قصد داریم برسی کنیم که چه اندازه ای برای باتن ها مناسب هست😉

امروزه برخی از توسعه دهنده ها وقتی میخوان اندازه دکمه ای رو انتخاب کنن , نمیدونن چه اندازه ای مناسب تره , برای همین تحقیقاتی صورت گرفته که باتن هارو در 3 اندازه مرتب کرده اند :
42 پیکسل(اولویت کم)
60 پیکسل(اولویت متوسط)
72 پیکسل(اولویت زیاد)

بیشترین دقت انتخاب در دکمه هایی از اندازه 42 پیکسل تا 72 پیکسل هستش که اندازه 60 پیکسل , متوسط بین انهاست.

برای درک بیشتر به مثال بعدی دقت کنید

#tip #learn #ui #ux
🆔 @iranUiUx 👈مطالب بیشتر

هنگامی که میخواهید از دکمه ها استفاده کنید , بسیار مهم است که به اولویت بندی دقت کنید.

بدین ترتیب اگر اولویت بندی را رعایت کنید , کاربران میدانند که کدام اقدامات را انجام دهند تا به نتیجه مطلوب خودشون برسند!

به مثال بالا دقت کنید.
توی این مثال از اولویت بندی دکمه ها به خوبی استفاده شده است.
اولویت زیاد : 72 پیکسل
اولویت متوسط : 60 پیکسل
اولویت کم : 42 پیکسل

اگر شما هم از اولویت بندی استفاده کنید , کاربران راحت تر میتونن به نتیجه ای که میخوان برسن و تجربه بدی بهشون منتقل نشه.

#tip #learn #ui #ux
🆔 @iranUiUx 👈مطالب بیشتر

به جای اینکه از کاربر بپرسید "ایا شما مطمعن هستید که میخواهید ..." , یک علامت سوال در پایان عنوان دیالوگ قرار دهید.
برای مثال , عنوان "?Delete Account" نشان دهنده "ایا شما مطمعن هستید که میخواهید حساب کاربری خود را حذف کنید؟" است ولی با کلمات کمتر!

همچنین به جای استفاده از جمله "If you delete your account, you will permanently lose your profile, messages, and photos," از لیست چیزهایی که از دست خواهد داد استفاده کنید , چون بعضی از کاربران حوصله خواندن متن طولانی را ندارند ولی لیست را سریع تر میتوانند بخوانند!

که در مثال بالا تعداد کلمات را از 25 کلمه به 9کلمه کاهش داده ایم تا کاربر سریع تر نتیجه را بداند و تصمیم خود را بگیرد.

#tip #learn #ui #ux
🆔 @iranUiUx 👈مطالب بیشتر

در این بخش به بعضی از مهم ترین کاربردهای استفاده از آیکون ها اشاره میکنیم :

1 ) آیکونها یک راه حل خوب برای کاهش محتوای متنهای طولانی هستند و به طور استراتژیک میتوانند آنها را خواناتر و قابل فهم تر کنند .

2 ) برای تمام کاربران مفهوم یکسانی دارند و برخلاف متون ، نیازی به ترجمه به زبانهای مختلف ندارند ‌.

3 ) بصورت بصری میتوانند جذابیت طراحی را افزایش دهند ‌.

4 ) به سرعت قابل تشخیص هستند .

با توجه به کاربردهای ذکر شده ، آیکونها ابزار مناسبی برای نمایش بصری یک شئ ، یک عمل یا ایده هستند و باید در وهله اول ، معنای ارتباط را در یک رابط کاربری گرافیکی تعریف کنند .

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

#tip #learn #ui #ux
🆔 @iranUiUx 👈مطالب بیشتر

قبل از اینکه تصمیم بگیرید برای یک فیلد از فرمتان ، از یک Select Menu استفاده کنید بهتر است از خودتان بپرسید که :

آیا کاربران بدون مراجعه به فهرست option های آن ، اطلاعات خود را می دانند یا خیر ؟

اگر جواب سوالتان مثبت بود ، بهتر است که بجای پیاده سازی یک Select Menu از یک Auto Complete Field استفاده کنید ، چرا که کاربران در چنین مواقعی نیازی به اسکن و مرور لیست های طولانی option ها ندارند .

#tip #learn #ui #ux

🆔 @iranUiUx 👈 مطالب بیشتر

هنگامی که کاربری قصد دارد حساب کاربری خود را حذف کند , بهتر است از کاربر درخواست کنید که برای حذف حساب کاربری خود , در یک فیلد جمله ای مانند delete account را بنویسد تا بتواند اکانت خود را حذف کند, زیرا این کار کاربران را از عملی که انجام میدهند , بیشتر اگاه میسازد. 😀

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

#⃣ #tip #learn #ui #ux

🆔 @iranUiUx 👈مطالب بیشتر

احتمالا خیلی از طراحان رابط کاربری تازه کار در طول روز , درگیر انتخاب رنگ برای بخش های مختلف رابط کاربری وب سایت خود هستند 😓

با استفاده از اطلاعات عکس بالا , برای بخش های مختلف وب سایت خودتون , راحت تر میتونید رنگ هارو انتخاب و استفاده کنید 😬

#⃣ #tip #learn #ui #ux

🆔 @iranUiUx | iranUiUx.com

به دلیل نداشتن توان خرید مک بوک و استفاده از نرم افزار sketch (جزو معروف ترین نرم افزار های طراحی رابط کاربری) اقای ارتین نعمتی براتون اموزشی رو ضبط کردن که باهاش میتونین Mac os رو روی لپ تاپ ویندوزتون نصب کنید😌

کافیست هیکنتاش رو نصب کنید و درنهایت از نرم افزار قدرتمند sketch لذت ببرید😋

جهت مشاهده اموزش روی این لینک کلیک کند 😉

باتشکر از @Eliot_CYSE بابت این اموزش پرکاربرد 🌹

#⃣ #tool #learn

🆔 @iranUiUx | iranUiUx.com

برای همراهان عزیز iranUiUx , پست روانشناسی رنگ ها رو اماده کردیم تا رنگ ها رو بهتر انتخاب کنید ☺️🌺

⬅️ مشاهده در اینستاگرام

لایک , کامنت و فالو کردن یادتون نره😉

#⃣ #tip #learn #ui #ux #color

🆔 @iranUiUx | iranUiUx.com

خیلی از افراد در هنگام ایجاد سایه به مشکل برمیخورن , توی این اموزش (Ui tip) قصد داریم به صورت تصویری یاد بدیم که چطوری سایه هارو به خوبی ایجاد کنید😉

میتونید این اموزش رو توی پیج اینستاگرام iranUiUx مشاهده کنید😎

✅ مشاهده اموزش

#⃣ #tip #learn #ui #ux

🆔 @iranUiUx | iranUiUx.com

اموزش ساخت pattern جهت استفاده در وب سایت 😁 ارسالی از همراه عزیز iranUiUx 🌹

مدرس اموزش : @D3signer

#⃣ #tip #learn #ui

🆔 @iranUiUx | iranUiUx.com

🔑 password : iranUiUx
دانلود : 👇👇

معرفی کلیدهای میانبر adobe xd در سیستم عامل مک | بخش اول

میتونید این اموزش رو توی پیج اینستاگرام iranUiUx مشاهده کنید😎

✅ مشاهده مطلب

#⃣ #tip #learn #ui #ux

🆔 @iranUiUx | iranUiUx.com

معرفی کلیدهای میانبر adobe xd در سیستم عامل مک | بخش دوم(بخش پایانی)

میتونید این مطلب رو توی پیج اینستاگرام iranUiUx مشاهده کنید😎

✅ مشاهده مطلب

به اشتراک بزارید

#⃣ #tip #learn #ui #ux

🆔 @iranUiUx | iranUiUx.com

احتمالا تا کنون تلاش کردید که سایه های مناسب و خوبی رو برای دکمه ها ایجاد کنید، ولی نتیجه خوبی نگرفتید، با نکته های اموزشی که تو این پست قرار گرفته، میتونید سایه های خوبی رو ایجاد کنید 😌

✅ مشاهده مطلب

#⃣ #tip #learn #ui #ux

🆔 @iranUiUx | iranUiUx.com

10 کتاب طراحی تجربه کاربری برای تازه‌کارها - بخش اول

ممکن هست دنبال کتابی باشید تا دانش خود را در زمینه تجربه کاربری ارتقا دهید، ایران یوآی یوایکس برایتان 10 کتاب تجربه کاربری معرفی می‌کند تا دانش خود را ارتقا دهید ☺️

✅ مشاهده مطلب

#⃣ #tip #learn #ux

🆔 @iranUiUx | iranUiUx.com

10 کتاب طراحی تجربه کاربری برای تازه‌کارها - بخش دوم و پایانی

ممکن هست دنبال کتابی باشید تا دانش خود را در زمینه تجربه کاربری ارتقا دهید، ایران یوآی یوایکس برایتان 10 کتاب تجربه کاربری معرفی می‌کند تا دانش خود را ارتقا دهید ☺️

✅ مشاهده مطلب

#⃣ #tip #learn #ux

🆔 @iranUiUx | iranUiUx.com

تا الان ممکنه از خودتون سوال کرده باشید که پلاگین‌های پرکاربرد Adobe Xd چیا هستن؟ به همین منظور در این پست اموزشی ایران یوآی یوایکس، ما براتون 4 تا پلاگین پرکاربرد و مفید رو معرفی می‌کنیم تا اگر نیاز داشتید استفاده کنید 😎

بعد هر معرفی، ویدیو آموزش(به همراه زیرنویس فارسی) استفاده از همون پلاگین رو هم قرار دادیم 😉

مشاهده پست آموزشی👇
https://www.instagram.com/p/B23-X6Dgynu/?utm_source=ig_web_copy_link

#⃣ #tip #learn #tool #Adobe_Xd #plugin

🆔 @iranUiUx | iranUiUx.com

نکته‌ی 38، از کتاب 75 نکته برای طراحی رابط کاربری خوب!

🔹 به جای مناطق کوچک‌تر برای کلیک، اندازه بزرگتر را نیز امتحان کنید.

در صورت افزایش اندازه عناصر(مانند لینک‌ها، فرم‌ها و دکمه‌ها)، کلیک کردن بر روی آن‌ها سریع‌تر و آسان‌تر خواهد شد و دیگر نیازی نخواهد بود کاربر برای کلیک کردن، با رابط کاربری دست و پنجه نرم کند!
طبق قانون فیتز(Fitts's law) هرچقدر فاصله چیزی دورتر بوده و کوچک‌تر باشد، به زمان بیشتری برای کلیک بر روی آن نیاز داریم. به همین دلیل بهتر است اندازه فیلدهای موجود در فرم‌ها، یا دکمه‌های CTA و لینک‌ها را افزایش دهید تا کاربر سریع‌تر و آسان‌تر بتواند کلیک کند. می‌توان ظاهر عناصر بصری را مانند قبل حفظ کرد، ولی در عوض تنها مکان قابل کلیک آن را افزایش داد. نمونه بسیار آشکار آن، لینک‌های متنی در دستگاه‌های تلفن همراه یا در منوها است، که با استفاده از پدینگ کشیده شده اند.

✅ خرید نسخه کامل کتاب با تخفیف ویژه

#⃣ #tip #learn #ui

🆔 @iranUiUx | iranUiUx.com