🔥 یکی از چالش هایی که بسیاری از کاربران در مواجهه با دکمه های #toggle با آن روبرو می شوند این است که به راحتی نمی توانند
تشخیص دهند که هم اکنون دکمه در چه وضعیتی قرار دارد. فعال است یا غیر فعال؟
این مسئله بیشتر زمانی رخ می دهد که طراح از طرح رنگی #معکوس برای ساخت آن ها استفاده می کند.
#UI #frontend #UX
✅ @coderszone
تشخیص دهند که هم اکنون دکمه در چه وضعیتی قرار دارد. فعال است یا غیر فعال؟
این مسئله بیشتر زمانی رخ می دهد که طراح از طرح رنگی #معکوس برای ساخت آن ها استفاده می کند.
#UI #frontend #UX
✅ @coderszone
CodersZone 🔥 قلمرو برنامه نویسان
🔥 یکی از چالش هایی که بسیاری از کاربران در مواجهه با دکمه های #toggle با آن روبرو می شوند این است که به راحتی نمی توانند تشخیص دهند که هم اکنون دکمه در چه وضعیتی قرار دارد. فعال است یا غیر فعال؟ این مسئله بیشتر زمانی رخ می دهد که طراح از طرح رنگی #معکوس…
💥 از این رو این نوع دکمه ها باید استایل مشابه و نزدیکی داشته باشند.
در عوض می توانید از طرح رنگی موسوم به #direct استفاده کنید. در این روش هر دو نوع دکمه به صورت یک متن تیره بر روی پس زمینه روشن نمایش داده می شوند. اما تفاوت آن ها این است که گزینه انتخابی دارای متن #bold، یک Border تیره و یک سایه روشن در پس زمینه است.
#UI #frontend #UX
✅ @coderszone
در عوض می توانید از طرح رنگی موسوم به #direct استفاده کنید. در این روش هر دو نوع دکمه به صورت یک متن تیره بر روی پس زمینه روشن نمایش داده می شوند. اما تفاوت آن ها این است که گزینه انتخابی دارای متن #bold، یک Border تیره و یک سایه روشن در پس زمینه است.
#UI #frontend #UX
✅ @coderszone
🔥 برای چک کردن کنتراست براساس استاندارد AA یا همان #تست #کنتراست در #طراحی، ابزار مختلفی وجود داره، یکی از بهترین گزینهها اپ Contrast برای مک هست. در ادامه ابزارهای دیگری نیز اضافه خواهد شد.
🌐 https://usecontrast.com
#UI #frontend
✅ @coderszone
🌐 https://usecontrast.com
#UI #frontend
✅ @coderszone
🔥 همیشه سعی کنید از درج دکمه های متعدد در صفحه یک محصول در #فروشگاه_اینترنتی خود پرهیز کنید. مگر کاربران در این صفحه به بیشتر از یک دکمه جهت افزودن محصول به سبد خریدشان نیاز دارند؟
به تصویر فوق که از سایت https://www.blenderseyewear.com انتخاب شده است دقت کنید. در کل این صفحه فقط یک #دکمه وجود دارد. دکمه ای بزرگ، bold و تنها متنی در صفحه که رنگ پس زمینه دارد.
#ecommerce #tips #ux #ui #frontend
✅ @coderszone
به تصویر فوق که از سایت https://www.blenderseyewear.com انتخاب شده است دقت کنید. در کل این صفحه فقط یک #دکمه وجود دارد. دکمه ای بزرگ، bold و تنها متنی در صفحه که رنگ پس زمینه دارد.
#ecommerce #tips #ux #ui #frontend
✅ @coderszone