طراحی رابط کاربری (UI)
رنگ، نوشته، فاصله و اجزای صفحه: رابطی که دیدن و کار کردن با آن آسان است؛ از پایه‌ی بصری تا سیستم طراحی و تحویل به برنامه‌نویس.
از صفر۷ ایستگاه۳۴ درسدرس‌ها به‌زودی
شروع۴ درس، به‌زودی
پیش از رنگ و قلم، باید بدانید UI برای چیست.
رابط کاربری (UI) چیست به‌زودی
آنچه روی صفحه می‌بینید و با آن کار می‌کنید؛ چیده‌شده تا کار آسان شود.
UI و UX به‌زودی
UI ظاهر و اجزاست، UX مسیر و حس؛ هر دو برای یک کاربر.
طراح UI چه می‌کند به‌زودی
صفحه‌ها، اجزا و سیستم طراحی را می‌سازد و به برنامه‌نویس تحویل می‌دهد.
رابط خوب چه ویژگی‌هایی دارد به‌زودی
روشن، یکدست، خوانا، پاسخ‌گو و بی شلوغی.
پایه‌های بصری۷ درس، به‌زودی
چند قاعده‌ی ساده، فرق صفحه‌ی آشفته و آرام است.
سلسله‌مراتب بصری به‌زودی
مهم‌تر، بزرگ‌تر و پررنگ‌تر؛ چشم باید بداند از کجا شروع کند.
فاصله و فضای خالی به‌زودی
فضای خالی چیزها را گروه می‌کند و نفس می‌دهد.
شبکه و چیدمان به‌زودی
ستون‌های نامرئی که همه‌چیز را هم‌تراز نگه می‌دارند.
نوشته و قلم به‌زودی
یک یا دو قلم، اندازه‌های محدود و فاصله‌ی خط کافی.
قلم فارسی و راست‌به‌چپ به‌زودی
قلم فارسی خوانا، عدد فارسی و چیدمان راست‌به‌چپ درست.
رنگ در رابط به‌زودی
یک رنگ اصلی برای کار، چند رنگ خنثی، و رنگ برای وضعیت‌ها.
تضاد و خوانایی به‌زودی
نوشته باید روی پس‌زمینه به‌راحتی خوانده شود؛ قاعده‌ی سنجیدنی دارد.
اجزای رابط۶ درس، به‌زودی
صفحه از اجزای تکراری ساخته می‌شود.
فرم و خانه‌ی ورود به‌زودی
برچسب بالای خانه، خطای کنار همان خانه.
آیکون به‌زودی
ساده، یکدست و ترجیحا با نوشته.
فهرست و جدول به‌زودی
چیدن چند مورد کنار هم، قابل اسکن.
حالت‌ها به‌زودی
عادی، روی آن، فشرده، غیرفعال، در حال بارگذاری و خطا.
صفحه‌ها۵ درس، به‌زودی
هر نوع صفحه قاعده‌ی خودش را دارد.
طراحی رابط موبایل به‌زودی
جای شست، دکمه‌ی بزرگ، یک ستون و متن کوتاه.
طراحی رابط دسکتاپ به‌زودی
صفحه‌ی بزرگ، چند ستون و کار با ماوس و صفحه‌کلید.
صفحه‌ی فرود به‌زودی
یک حرف، یک دکمه، و دلیل اعتماد.
رابط فروشگاه به‌زودی
عکس محصول، قیمت روشن و دکمه‌ی خرید همیشه در دسترس.
حالت تاریک به‌زودی
رنگ‌ها را برای پس‌زمینه‌ی تیره دوباره بسنجید، نه فقط وارونه.
ابزار۴ درس، به‌زودی
ابزار درست، کار را سریع و قابل تحویل می‌کند.
شروع با Figma به‌زودی
ابزار جهانی طراحی رابط در مرورگر، با نسخه‌ی رایگان؛ فریم، شکل و نوشته.
چیدمان خودکار در Figma به‌زودی
اجزایی که با تغییر محتوا خودشان جا باز می‌کنند.
اجزای قابل تکرار به‌زودی
یک بار بسازید، همه‌جا استفاده کنید و یک‌جا عوض کنید.
طراحی رابط با هوش مصنوعی به‌زودی
برای ایده و پیش‌نویس سریع؛ تصمیم و یکدستی با طراح.
سیستم طراحی۴ درس، به‌زودی
وقتی صفحه‌ها زیاد شوند، بی سیستم همه‌چیز ناهمخوان می‌شود.
سیستم طراحی چیست به‌زودی
قاعده‌ها و اجزای مشترک که همه‌ی صفحه‌ها را یکدست نگه می‌دارد.
توکن‌های طراحی به‌زودی
نام برای رنگ، فاصله و اندازه؛ یک جا عوض کنید، همه‌جا عوض شود.
سبک‌های طراحی رابط به‌زودی
تخت، کمینه، کاغذی و …؛ سبک باید به کار و برند بیاید، نه مد.
تحویل به برنامه‌نویس به‌زودی
اندازه‌ها، حالت‌ها و رفتارها روشن؛ بی حدس زدن.
پایان راه۴ درس، به‌زودی
همه را در یک صفحه‌ی واقعی کنار هم بگذارید.
نقد یک رابط به‌زودی
با قاعده‌های همین مسیر یک صفحه را بسنجید.
نمونه‌کار UI به‌زودی
چند صفحه‌ی واقعی با توضیح تصمیم‌ها.
اشتباه‌های رایج UI به‌زودی
چند رنگ و قلم، تضاد کم، دکمه‌های هم‌وزن.
حالا رابط می‌سازید به‌زودی
مرور راه و پروژه‌ی تمرینی شما.