Multicast, a web application for monitoring and management of environments, equipments and supplies
Multicast is a young Internet of Things company from Vitória, ES, Brazil, providing solutions to digital transformation of economy. Through their devices associated with internet connection they are able to collect data (temperature, pressure, brightness and etc) from places and make analysis of it, allowing users like doctors, laboratory workers and many others to manage their environments, supplies and products that need to be in specific conditions.
The Client
Multicast is the provider of the service in this job, but the real client are the owners of the products, supplies and environments that need to make sure that their products don’t spoil, otherwise they lose money.
The Context
Multicast is a young and small company of Brazil, their product is sold client by client, and for many reasons as performance, application size, accessibility and etc, they believed that a Web App would be a better approach for their clients, since they would be able to use it in mobile and desktop.
My Role
As a Designer I boarded in an application that was being developed with material design and no company identity. I was briefed to redesign the current design and set a design guide that could help the developers take decisions by themselves after my work was done (I forgot to say, but I’m talking about a small company that couldn’t afford to have a designer full-time, but they do know how important design is to their product… so why not try to make their lives easy?).
So I had a big challenge ahead: Redesign their app and create a Design System for developers for both views (Mobile and Desktop)
The Design System
To create this Design System I went through a lot of researches and examples so I could organise the components the best way possible for designers and developers, so I decided to use Atomic Design as the methodology and Figma as the tool, because it’s collaborative, simple to use and the learning curve is very small for new users. I also decided to use one page for each group of components, so in the end I had the following pages (Branding, Typography, Colors, Icons, Shadows, Border & Border Radius, Grids, Modals, Forms, Navs, Simple Molecules and at last Templates.)
