CIOReview
CIOREVIEW >> OpenSource >>

The World of Open Source

Advait Kulkarni, IT Director, Cetera Financial Group
Advait Kulkarni, IT Director, Cetera Financial Group

Advait Kulkarni, IT Director, Cetera Financial Group

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. AngularJS 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 ReactJS 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.

  ​The beauty of AngularJS material is that it provides a predefined set of reusable, well-tested, and accessible UI components based on Material Design   

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.

Read Also

ITSM: The Digital Customer Experience

ITSM: The Digital Customer Experience

Christian Moore, SVP, IT Service Mgmt., Texas Capital Bank
Managing Knowledge and Managing Processes

Managing Knowledge and Managing Processes

Matthew Morgan, COO, Savills Inc. (North American business unit of Savills plc)
Can your Investment Manager be both fundamentally and artificially intelligent?

Can your Investment Manager be both fundamentally and artificially...

Patrick Dugnolle, U.S. Head of Multi-Asset and Quantitative Solutions, BNP Paribas Asset Management
The coming Enterprise 5G Boom three trends that will drive Enterprise Demand for 5G in 2020

The coming Enterprise 5G Boom three trends that will drive Enterprise...

Imran Akbar, VP & GM, Small Cells & Wireless Enterprise, Samsung Electronics America
Survival of the fittest in the age of Innovation

Survival of the fittest in the age of Innovation

Bob Karschnia, VP & GM of Wireless, Emerson Automation Solutions [NYSE: EMR]
The Era of Frictionless Mobility

The Era of Frictionless Mobility

Dr. Derek Peterson, Chief Technology Officer, Boingo Wireless [NASDAQ: WIFI]