| کانال طراحی و رابط‌کاربری |: post #129 — TG.ME

🧩 فضای خالی، عنصر نامرئی که UI را حرفه‌ای می‌کند خیلی وقت‌ها برای "پر کردن" صفحه وسوسه می‌شود همه‌جا متن و کامپوننت بگذاریم، اما درست استفاده کردن از فضای خالی (White Space) باعث می‌شود رابط‌کاربری مرتب‌تر، قابل‌اسکن‌تر و حرفه‌ای‌تر به‌نظر برسد. 🧘‍♂️ نکته کلیدی: فاصله‌های عمودی و افقی را آگاهانه و یکنواخت تنظیم کن؛ مثلاً یک سیستم 4px یا 8px. این کار هم در Figma و هم در کد کمک می‌کند ساختار تمیز داشته باشی. مثال ساده برای فاصله‌گذاری یکنواخت بین آیتم‌های لیست: .list-item { padding: 8px 16px; } .list-item + .list-item { margin-top: 8px; /* فاصله عمودی ثابت بین آیتم‌ها */ } 🔍 چرا مفید است؟ • المان‌های مرتبط را با فاصله کم‌تر، و بخش‌های جدا را با فاصله بیش‌تر از هم قرار بده. • چشم کاربر راحت‌تر ساختار را تشخیص می‌دهد و سریع‌تر محتوا را اسکن می‌کند. برای الهام گرفتن از نمونه‌های خوب فاصله‌گذاری، راهنمای Layout در Material Design عالی است 👇 material.io — Spacing Guidelines 🪄 دفعه بعد که UI را مرور می‌کنی، فقط با تنظیم فاصله‌ها سعی کن بدون تغییر رنگ و تایپوگرافی، حس حرفه‌ای‌بودن را بالا ببری. 🔖 #Design #طراحی #UI #UX #UI #UX #White_Space #Layout #Spacing #Material_Design 👤 Developix 💎 Channel: @DevelopixDesign