ایراوب - طراحی وب سایت – طراحی و پیاده سازی رابط کاربری وبهمینطور که در جریان هستید در سال اخیر طراحی رابط کاربری به سبک متریال خیلی مرسوم بوده است. در بین انبوهی از فریم ورک های material design که هم اکنون در درسترس هستند مهم ترین موضوع انتخاب بهترین مورد برای هر نیاز شماست. در این مقاله تعداد محدودی از چنین framework های طراحی که در زمینه ی خود بهترین هستند، عملکرد های زیاد و ماهیت به روز دارند، ساده و مفید هستند را انتخاب کرده ایم و معرفی می کنیم.
متریال دیزاین از کجا شروع شد
گوگل با اعتبار و سابقه ی موفق خود یک تعریف جدیدی از جهان وب در June 25, 2014 به عنوان “material design” ارائه داد. برپایه ی محتوای کاغذ و جوهر به سادگی می توانید تصورات خود را به صورت یک طراحی بیان کنید. این تلاش گوگل، سیستم عامل کروم، اندروید، اپلیکیشن های وب، asp و خود اپلیکیشن ها را استاندارد می کند. با سیر تکاملی طراحی وب اولین دیدگاه در این زمینه این است که به صورت موبایل ازطریق اندروید، فهم آن را برای هرکسی آسان کرد. توسعه دهندگان وب با framework ارائه شده توسط گوگل برای material design کار می کنند.
Material design روی ساخت یک زبان بصری که ترکیبی از اصول orthodox طراحی قدیمی با نوآوری ها و امکانات تکنولوژی است تاکید می کند. این تکنولوژی فقط در اپلیکیشن ها استفاده نمی شود بلکه در وب و اپلیکیشن های ترکیبی نیز استفاده می شود. از آن جایی که این سیستم و فلسفه ی طراحی یکپارچه ی عناصر به عنوان مثال سایه ها، رنگ، انیمیشن و غیره تاثیرات روانشناختی فوق العاده ای دارد جذابیت کامپوننت هایی نظیر whatapps و دیگر موارد را بیشتر می کند.
بهترین Framework های Material Design برای وب وطراحان موبایل
در بین انبوهی از framework های material design که هم اکنون در درسترس هستند مهم ترین موضوع انتخاب بهترین مورد برای هر نیاز شماست. در این مقاله تعداد محدودی از چنین framework های طراحی که در زمینه ی خود بهترین هستند، عملکرد های زیاد و ماهیت به روز دارند، ساده و مفید هستند را انتخاب کرده ایم. این 10 framework های material design به صورت زیر لیست شده اند:
متریال دیزاین لایت Material Design Lite
این مورد یک کتابخانه از کامپوننت ها برای توسعه دهندگان وب براساس فلسفه ی Material Design گوگل است. این مورد framework اصلی گوگل است بنابراین به روز و آسان است، پوشش گسترده ای دارد و به هیچ وابستگی خارجی نیاز ندارد. شما می توانید از بین template هایی نظیر template وبلاگ برای شروع وبلاگ خودتان یا استفاده از نسخه ی سبک تر آن ها انتخاب کنید.
متریالایز Materialize
این مورد یک framework مدرن برای front-end با استفاده از Material Design می دهد. این framework شامل CSS برای تاثیر رنگ، جداول، grid ها، تایپوگرافی و غیره است. Materialize با استفاده از SAAS که به عنوان بهترین مورد برای پروژه های کوچک و توسعه های در مقیاس بزرگ است ساخته شده است.
انگولار متریال Angular material
این مورد از پیاده سازی material design در angular j.s استفاده می کند. مهم تر از همه مستندات مختصر برای نشان دادن چگونگی اسناد با استفاده از materialاست . Angular Material طراحی کامپوننت ها برای اپلیکیشن ها ی Angular که هم روی دسکتاپ و هم اندروید کار می کنند را پیشنهاد می دهد.
MUI CSS
استفاده از طراحی کاربر پسند MUI CSS شامل framework های HTML, CSS و جاوااسکریپت است. و سرویس هایی نظیر پشتیبانی از React، سفارشی سازی را ارائه می دهد و شامل نسخه های خطی جداگانه برای استایل دهی به ایمیل ها می باشد و همچنین از SAAS استفاده می کند و بسیار ساده است و استفاده از آن نیز ساده می باشد.
Material UI
این مورد یک کامپوننت React که قابل سفارشی سازی می باشد و همچنین framework مربوط به CSS می باشد و به شما امکان انتخاب template (تاریک یا روشن) ، نوار های اپلیکیشن، تکمیل خودکار فرم ها، ساعت و غیره را می دهد.
Bootstrap Material Design
این مورد یک framework مربوط به front end است که برپایه ی JavaScript است و شامل پلاگین های jQuery برای کمک به شما در توسعه می باشد. این مورد یک تم Bootstrap کارآمد است که از material design برای ساخت یک تجربه ی کاربری عالی استفاده می کند.
فریمورک Material Design
فریم ورک Material Framework
با استفاده از این مورد اضافه کردن material design به طراحی موجود آسان می شود. تنها یک framework ساده ی responsive در CSS که می تواند در صفحات وب یا اپلیکیشن های وب استفاده شود برای پروژه های کوچک نیز مناسب می شود.
فریم ورک Framework7
این اپلیکیشن به تازگی درحال توسعه ی خود به صورت کاملا رایگان است. گروه بزرگ کاربران من در حال استفاده از HTML framework برای توسعه ی اپلیکیشن های موبایل و وب هستند بنابراین قابل فهم است و استفاده از آن آسان می باشد.
فریم ورک LumX – Material Design Front End Framework
LumX اولین framework مربوط به front-end و responsive است و بر پایه ی AngularJS و Material Design می باشد و دارای مجوز از MIT می باشد. کامپوننت های LumX همه ی زمینه هارا پوشش می دهد و جزئی از طراحی سنتی layout وبسایت است. LumX یک framework کاملا responsive است و از هسته ی jQuery بدون هیچ پلاگین اضافه ای برای اطمینان از عملکرد بهتر استفاده می کند.
فریم ورک Polymer
از آنجایی که Polymer توسط خود گوگل طراحی شد ممکن است انتظارات شما درباره ی material design را افزایش دهد. Polymer در ساخت سریع و آسان کامپوننت های وب در دسکتاپ و موبایل کمک می کند. این مورد با مجموعه ای از کامپوننت های وب مرسوم، همراه است. Polymer بر مبنای اصول material design گوگل است و تحت مجوز BSD می باشد.
زمانی که شما چندین گزینه برای انتخاب کردن دارید، پیدا کردن موردی که بیش از همه متناسب با نیاز شما باشد چالش اصلی است. درحالی که روند Material Design رو به رشد است تعداد زیادی انیمیشن، تم و طراحی با تعداد زیادی از framework های Material Design که بطور گسترده مورد قبول طراحان وب و توسعه دهندگان است را می بینیم. لیستی که در بالا به آن اشاره کردیم در زمینه ی عملیاتی که ارائه می دهند، سادگی و طبیعت تعاملی آنها، بهترین هستند. بنابراین کاربر باید نیازها و انتظارات از framework ها را درک کنند و سرانجام بهترین و موثر ترین مورد را انتخاب کنید.
