The World Of Open Source

Date:   Friday , February 03, 2017

Material design is a comprehensive guide to address all issues and concerns around visual, motion, and interaction design across platforms and devices. This can be applied for different form factors with pre-decided templates and design patterns. Angular- JS Material framework is a UI Component framework and a reference implementation of Google\'s Material Design Specification. It has introduced the development community to a simple yet meaningful philosophy of modern UI design. The beauty of AngularJS material is that it provides a predefined set of reusable, well-tested, and accessible UI components based on Material Design.

There are several competing material design frameworks that are currently in the market. Whether it is React- JS based Material-UI or Ionic\'s Ionic Material or Bootstrap using Paper all of the material frameworks do a decent job for the user experience and interaction framework. Lumx is really a great product based on AngularJS, some of the areas of concern is that it is maintained by a smaller set of developers and is dependent heavily on JQuery. As against other matured frameworks, this looks more like a Library than a well-defined framework or a platform. Where AngularJS material shines is that it helps in creating quick, consistent and functional pages while catering to the basic principles of web design viz browser portability, device independence, and graceful degradation. Angular Material recently released Version 1 which we consider to be stable and ready for production use. This only works with AngularJS 1.x and will not work with Angular 2.0.

Some of the main features that stand out are its in-built responsive design concept, innovative ideas like cards, speed dial, swipe and so on. The design is very minimal and flat. It builds on the idea that it is easier to add CSS than overwrite existing CSS. With aggressive use of shadows and bold colors, this framework does a great job of bringing out naturally intuitive user interfaces.

With a rich set of directives, this framework uses the best of the controls to provide a seamless experience across any device.

Given that AngularJS has a rich history of combined forces from Microsoft (who was working on TypeScript) and Google, it is not surprising that this UX framework has come out as an extremely innovative enterprise. Using HTML Directives as the API provides an easy way to set a value and helps with separation of concerns. By using Material services, critical provider functions around media query evaluation, creation of floating panels, optimization in side navigation usage and provision of simple Promise API can be done. The Layout feature is essentially a set of Angular directives that can be applied to any of the HTML Content. It will provide the recipe to enable developers to more easily create modern, responsive layouts on top of CSS3 flexbox. In the flex layout model, the children of a flex container should be able to be laid out in any direction, and can \"flex\" their sizes, either growing to fill unused space or shrinking to avoid overflowing the parent as per the need of the user interface.

Material Design, Daily - MaterialUp has been built using AngularJS Material. Angular Material has taken the aesthetic index up to a whole new level. More than 50 components available within the AngularJS Material tool box make the UX developer\'s life much easier. The Grid List and Bottom Sheet samples that Google has provided are extremely well designed and presented. Whether it is using the auto fill or auto complete feature as well as toast notifications for specific alerts you would like to see this framework just gives you enough flexibility to convert the application into an extremely elegant experience.