متریال دیزاین(Material Design)

تنظیمات (settings) در طراحی متریال
طراحی سایت، طراحی متریال، متریال دیزاین، آموزش متریال دیزاین، تنظیمات یا settings در متریال دیزاین

مکانیزم جستجو در طراحی متریال
متریال دیزاین، طراحی سایت، آموزش متریال دیزاین، طراحی متریال

تکنیک های اسکرول کردن در طراحی متریال
طراحی وب سایت، آموزش متریال دیزاین، ایجاد اسکرول در متریال دیزاین، روش های استفاده ااز اسکرول در طراحی متریال

اطلاعیه (notification) در طراحی متریال
طراحی سایت، یادگیری متریال دیزاین، اطلاعیه چیست، notification در طراحی متریال

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

نحوه لود شدن تصاویر در طراحی متریال
تصاویر معمولاً از طریق تغییر در میزان شفافیت، وضوح و سطوح رنگ در 3 فاز لود یا بارگذاری میشوند.

صفحه های شروع در طراحی متریال
طراحی وب سایت، آموزش متریال دیزاین، صفحه شروع در طراحی متریال، launch screen چیست

حرکات در طراحی متریال
طراحی سایت، متریال دیزاین، آموزش متریال دیزاین، انواع حرکات در متریال دیزاین

تأیید اعتبار از طریق اثرانگشت در طراحی متریال
طراحی وب سایت، آموزش متریال دیزاین، سیستم اعتبار سنجی با اثر انگشت، سیستم تأیید اعتبار

انواع error (خطا) در طراحی متریال
طراحی سایت، متریال دیزاین، انواع error در متریال دیزاین

صفحات (حالات) خالی در طراحی متریال
طراحی سایت، متریال دبزاین، طراحی متریال، متریال دیزاین چیست، صفحات خالی چه زمانی اتفاق می افتند

فرمت های داده در طراحی متریال
طراحی سایت، متریال دیزاین، آموزش متریال دیزاین، فرمت های داده در طراحی متریال

tooltip در طراحی متریال
از tooltipها برای شکل های تعاملی استفاده نمایید.

فیلدهای متنی در طراحی متریال
طراحی سایت، متریال دیزاین، فیلد متنی چیست، فیلدهای متنی در طراحی متریال

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

کلید (tab) در طراحی متریال
کلیدها این امکان را فراهم میکنند که به راحتی بین حالت های مختلف یک برنامه یا مجموعه دسته بندی شده از داده ها جا به جا شوید.

پلکان (stepper) در طراحی متریال
طراحی سایت، آموزش متریال دیزاین، پلکان در طراحی متریال

هدرهای ثانویه در طراحی متریال
طراحی وب سایت، آموزش متریال دیزاین، subheader چیست، نحوه استفاده از هدر ثانویه در طراحی متریال

اسنک بار ها در طراحی متریال
طراحی سایت، آموزش متریال دیزاین، اسنک بار چیست، کاربرد اسنک بار در طراحی متریال

اسلایدر ها در طراحی متریال
طراحی سایت، آموزش متریال دیزاین، اسلایدر در طراحی متریال

کنترل های انتخابی در طراحی متریال
طراحی سایت، متریال دیزاین، ایجاد چک باکس، دکمه رادیویی و سوئیچ در طراحی متریال

نوارهای پیشرفت و فعالیت
در زمانی که برنامه شما در حال بارگذاری محتوا میباشد، میتوانید با استفاده از یک نوار پیشرفت تغییرات ظاهری را تا لود شدن کامل محتوا در صفحه به حداقل برسانید. برای مثال، در هنگام refresh باید یک نوار پیشرفت خطی یا دایره ای نمایش داده شود.

انتخاب کننده(picker) در طراحی متریال
انتخاب کننده ها یک راه ساده را برای انتخاب یک مقدار از بین یک مجموعه ارائه میکنند.

منو ها در طراحی متریال
طراحی وب سایت، آموزش متریال دیزاین، ایجاد منو در متریال دیزاین، نجوه ایجاد منو در طراحی متریال

کنترل های لیست در طراحی متریال
کنترل های لیست آیکون هایی هستند که در چپ یا راست متن لیست قرار میگیرند. آن ها وضعیت یک آیتم را در لیست مشخص میکنند یا اطلاعاتی راجع به آن میدهند و یا یک عملیات مرتبط به آیتم لیست میباشند.

مشخصات لیست ها در طراحی متریال
مشخصات لیست ها در طراحی متریال

لیست ها در طراحی متریال
لیست ها چندین خط از آیتم ها را به صورت عمودی به عنوان یک عنصر ادامه دار نمایش میدهند.

لیست شبکه ای در طراحی متریال
طراحی سایت، متریال دیزاین، آموزش متریال دیزاین، لیست شبکه ای در طراحی متریال

جداساز (divider) در متریال دیزاین
طراحی سایت، متریال دیزاین، آموزش متریال دیزاین، جداساز در طراحی متریال، divider

دیالوگ های تمام صفحه (full screen) در طراحی متریال
در موبایل : به دلیل فضای محدود، دیالوگ های تمام صفحه میتوانند مناسب تر از دیالوگ های استفاده شده در دستگاه ها با صفحه نمایش بزرگتر باشند.

دیالوگ ها در طراحی متریال
طراحی سایت، متریال دیزاین، آموزش متریال دیزاین، دیالوگ و نحوه ایجاد آن در متریال دیزاین

جداول داده در کارت ها-طراحی متریال
جداول میتوانند درون کارت ها قرار بگیرند همراه با ابزار راهبری جدول و تغییرات داده که در بالا و پایین نمایش داده میشوند.

جدول های داده در طراحی متریال
طراحی وب سایت، متریال دیزاین، آموزش متریال دیزاین، جدول داده در طراحی متریال، نحوه ایجاد جدول داده در متریال دیزاین

تراشه ها (chips) در طراحی متریال
تراشه ها موجودیت های پیچیده را در بلوک های کوچک نمایش میدهند مانند یک مخاطب (contact).

بلوک های محتوا در طراحی متریال
طراحی سایت، متریال دیزاین، آموزش متریال دیزاین، ایجاد کارت در طراحی متریال، بلوک محتوا چیست

عملیات ها در طراحی متریال
عملیات اصلی در یک کارت معمولاً خود همان کارت میباشد. عملیات های تکمیلی میتوانند بسته به نوع محتوای کارت و خروجی مورد انتظار آن، از کارتی به کارت دیگر متغیر باشند برای مثال پخش کردن یک فیلم یا باز کردن یک کتاب. داخل کارت ها در یک مجموعه، عملیات ها را به طور سازگار با هم قرار دهید.

کارت ها (cards) در طراحی متریال
کارت یک برگه متریال است که به عنوان یک نقطه ورودی جهت مشاهده اطلاعات با جزئیات بیشتر ارائه میشود. یک کارت میتواند شامل عکس، متن و یک لینک درباره یک موضوع واحد باشد.

دکمه عملیاتی شناور در طراحی متریال
طراحی سایت، متریال دیزاین، آموزش متریال دیزاین، ایجاد دکمه در متریال دیزاین، ایجاد دکمه عملیاتی در طراحی متریال

انواع دکمه ها - ادامه
ادامه مطلب قبلی - انواع دکمه ها

انواع دکمه ها در طراحی متریال
طراحی سایت، متریال دیزاین، آموزش متریال دیزاین، انواع دکمه در طراحی متریال، کاربرد دکمه ها در طراحی متریال

رفتار (behavior)-طراحی متریال
رفتار ، مشخصات

برگه های تحتانی شرطی (modal) در طراحی متریال
برگه های تحتانی شرطی جایگزینی برای منوها یا دیالوگ های ساده میباشند و میتوانند محتوا با عمق لینک بالا را از یک برنامه دیگر نمایش دهند. این برگه ها بر روی عناصر رابط کاربری دیگر باز میشوند و برای کار با عناصر زیرین باید آن را ببندیم. زمانی که این برگه باز میشود بقیه صفحه تیره میشود تا توجه کاربر به برگه جلب شود.

اجزاء (components) در طراحی متریال
برگه تحتانی (bottom)، یک برگه متریال است که از لبه تحتانی صفحه نمایش بالا می اید. این برگه ها تنها در نتیجه عملیات آغاز شده توسط کاربر، نمایش داده میشوند و میتوانند جهت جهت نمایش محتوای بیشتر به سمت بالا کشیده شوند. برگه تحتانی میتواند یک سطح موقت یا یک عنصر ساختاری دائم برای یک برنامه باشد.

الگو ها در طراحی متریال
الگو ها در طراحی متریال

رفتارهای سطحی (surface behaviors)-طراحی متریال
surface behavior

شبکه (grid) در طراحی متریال
رابط کاربری در متریال دیزاین بر پایه یک ساختار 12 ستونه میباشد.

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

فریم های سفید (whiteframes)-طراحی متریال
whiteframe

منوی راهبری جانبی (side nav) در طراحی متریال
راهبری جانبی

نوارهای سیستمی در طراحی متریال
طراحی سایت، آموزش متریال دیزاین، نوار سیستمی چیست، ایجاد نوار سیستمی در متریال دیزاین