دیزاین مود در Google Chrome

document.designMode="on"
حالا میتونید هر قسمتی رو که میخواید ویرایش کنید.

@frontdevir

نسخه‌ عمومی ویژوال استودیو آنلاین دردسترس توسعه‌دهندگان قرار گرفت.

هم‌زمان با کنفرانس سالیانه‌ی ایگنایت مایکروسافت، نسخه‌ی مبتنی‌بر وب ویژوال استودیو دردسترس توسعه‌دهندگان قرار گرفت.

https://online.visualstudio.com/

@frontdevir

رابط کاربری بدون تجربه کاربری مثل یه زیبای بدون مغز میمونه. به تنهایی کافی نیست.

-uxgoodies
#UI #UX

@frontdevir

یک ستونه طراحی کنید.

طراحی یک ستونه باعث میشود که کاربر سریع‌ اطلاعتش را‌ وارد کند و در نهایت
منجر به تجربه کاربری بهتری خواهد شد.

#UX

@frontdevir

با استفاده صحیح از فاصله ها، رابط های زیبایی شناختی مطلوبی بسازید. padding و margin های لازم رو به کامپوننت و المنت هاتون بدید.

#UI

@frontdevir

مواردی که UI/UX دیزاینر ها باید بدانند.
#UI #UX

@frontdevir

📖کتاب 5 اصل SOLID

به زبان فارسی

#SOLID

@frontdevir

تجربه کاربری

-credit: khoshnaz

#UX

@frontdevir

دنیای غذاها

-credit: uxcel

@frontdevir

بعضی مواقع لازم نیست سخت کد بنویسید.

#js
@frontdevir

Flexible Margin

🔸 افزایش در صفحه نمایش های بزرگ
🔸 کاهش در صفحه نمایش های کوچک (0 پیکسل برای موبایل)

#ui #ux #uidesign

@frontdevir

Color Base!

سعی کنید از رنگ سیاه کامل (000#) استفاده نکنید. بجای اون میتونید از رنگ های خاکستری که خیلی سیاه نیستن استفاده کنید.

#UI #design

@frontdevir

اکستنشن Draw.io در Vs Code

میتونید با استفاده از این اکستنشن به راحتی با Draw.io تو محیط Vs Code کار کنید.

https://marketplace.visualstudio.com/items?itemName=hediet.vscode-drawio

#tools

@frontdevir

یه روش عالی و موثر برای اضافه کردن تگ های متعدد در ورودی، هرکدوم از موارد انتخاب شده رو میشه به راحتی حذف کرد، همچنین ناوبری راحت در صفحه کلید.

#UX #UI

@frontdevir

زمانی که از badge(نشان) های notification استفاده می کنید یک بوردر به رنگ بکگراند جایی که آیکون های شما در آنجا قرار دارند اضافه کنید. با این کار UI شما بی نظیر میشه و یخورده بیشتر به چشم میاد.

#UI

@frontdevir

کاربرهاتون رو با صفحه شلوغ گیج نکنید. فیچر های پراستفاده رو برجسته تر و بیشتر کنید.
طبق یکی از تجربیات Airbnb زمانی که از UI های شلوغ کمتر استفاده کردند، اشتراک گذاری مطالب 52 درصد افزایش پیدا کرد.

#UI #UX

@frontdevir

هنوز اینو ندیدید؟

اضافه کردن قابلیت جستجو به Dropdown.

با HTML بیشتر آشنا بشیم.

@frontdevir

خیلی مهمه که تمام آیکون های شما از یک استایل واحد برای هارمونی بهتر پیروی کنن(shape, fill, size, ضخامت).

#UI

@frontdevir

انواع تست:

تست | Unit Test: در این نوع تست یکسری فانکشن‌هایی وجود دارند که این وظیفه را دارند تا عملکرد سایر فانکشن‌ها را تست کنند.

تست | Integration Test: این تست اطمینان حاصل می‌کند که کامپوننت‌های مختلف به خوبی با یکدیگر سازگار هستند.

تست | Acceptance Test: این تست همچون مورد قبل است با این تفاوت که بیشتر از بُعد تجاری نرم‌افزار را محک می‌زند.

تست | UI Test: این تست تضمین می‌دهد که وقتی رابط کاربری در اختیار کاربران قرار گیرد، همان‌طور که از آن انتظار می‌رود کار خواهد کرد.

@frontdevir

اضافه کردن alt به عکسایی که از طریق content توی CSS استفاده میکنید.

کافیه از اسلش (/) بعد url استفاده کنید.

#CSS #HTML

@frontdevir