| 01 |
نمایش رایگان
-
متریال چیست :
متریال دیزاین بیش از حد به سیستم گرید و انیمشینها اهمیت میدهد و عمق و سایهها برای المانهای طراحی شده بسیار مهم است. شاید بتوان گفت ورژن بروز شده طراحی تخت (Flat Design) باشد اما خیلی زیباتر با انیمییشنها و Transition های بسیار زیبا و در عین حال پیچیده.
خود گوگل ادعا دارد که زبان جدید طراحی آنها، الهام گرفته از مرکب و کاغذ است. یکی از طراحان مشهور جهان به نام Matias Durate میگوید همانگونه که اجسام در دنیای واقعی قابل حس هستند و طول و عرض و ارتفاع دارند در این نوع طراحی دیجیتال هم باید همین حسها را منتقل کرد.
-
قرار دادن فایل های متریال در html:
ما در این قسمت و تمام قسمت ها فایل های کار با متریال و کار عملی که انجام میدهیم را همراه فایل آموزشی در اختیار شما قرار می دهیم
-
ساخت دکمه متریال:
در این قسمت یک مثال ساده ,ساخت دکمه به همراه افکت خاصت را توضیح میدهیم
|
|
| 02 |
نمایش رایگان
|
|
| 03 |
نمایش رایگان
|
|
| 04 |
|
|
| 05 |
-
آموزش تراز بندی سند ها :
کار با valign
کار با left
کار با left-align
کار با left
و.....
-
آموزش نمایش یا پنهان کردن المان ها در دستگاهای مختلف:
یکی از ویژگی ها مثبت متریالایز خصوصیت نمایش یا پنهان کردن یک شی در دستگاه های مختلف (موبایل و تپلت و کامپیوتر) است این خصوصیت بسیار مفیده برای دوستانی که علاقه دارن قالب های خود را توسط متریالایز پیاده سازی کنند.
|
|
| 06 |
-
کار با عکس در متریال:
در متریال می توانیم یک سری افکت ها به عکس بدیم , و ریسپانسیو عکس.
-
کار با پخش انلاین فیلم در متریال:
در متریال می توانیم یک سری افکت ها به عکس بدیم , و ریسپانسیو فیلم.
|
|
| 07 |
|
|
| 08 |
-
کار با Table ها در متریال:
در این قسمت از آموزش به مبحث جدول ها در متریال می پردازیم , جدول های در در طراحی وب برای نمایش اطلاعات به کار برده می شود که توسط متریال می توانیم افکت های بسیار جالب و رو بسازیم .
|
|
| 09 |
-
کار با باتن ها در متریال:
در این قسمت از آموزش به مبحث باتن ها و یا دکمه ها می پردازیم و دکمه های با افکت های خاص و به صورت زیر منویی و در موقعیت های مختلف طراحی خواهیم کرد که بسیار کاربر پسند خواهد بود.
|
|
| 10 |
-
کار با Chips :
می توان برای نشان دهنده بلوک های کوچکی از اطلاعات استفاده کرد.
-
کار با Breadcrumbs :
یک راه خوب برای نمایش مکان فعلی شما است.معمولا زمانی استفاده می شود که شما از لایه های متعدد از محتوا در سایت قرار دارید.
-
کار با Footer :
قسمت پایینی سایت که توضیحاتی در رابطه با حق نشر سایت ( کپی رایت ) تاریخ افتتاح سایت و ... قرار میگیرد را footer مینامند.
|
|
| 11 |
|
|
| 12 |
-
کار با Pagination :
اضافه کردن لینک های صفحه بندی برای کمک به تقسیم کردن محتوای طولانی در قالبتان.
-
کار با Preloader :
اگر شما مطلبی دارید که برای بارگذاری آن باید زمان نسبتا طولانی طول بکشد تا لود کامل آن , می توانید از preloader ها استفاده کنید که یک لودینگ بسیار زیبا را می توان ساخت.
-
کار با Collapsible :
ساخت منو آکاردئونی که کاربر میتوانید انتخاب کند کدام زیر منو باز باشد و کدام پنهان.
|
|
| 13 |
|
|
یک سوال دارم
توی نوشتن فرم میخوام از کاربر عکس درخاست کنم بصورت Browse
چه دستوری استفاده کنم؟
<div class="file-field input-field">
<div class="btn">
<span>File</span>
<input type="file" multiple>
</div>
<div class="file-path-wrapper">
<input class="file-path validate" type="text" placeholder="Upload one or more files">
</div>
</div>
</form>