Escale is a Costumer Acquisition company, which deals with sales funnel of Telecom brands (NET, Claro, Vivo and etc.) and health insurance companies like Amil, Sulamerica, Unimed and others. Be Water, the Escale’s Design System comes with the needs to optimize our process to build and develop the company’s products.
At the second semester of 2018, with the evolution of telecom and health insurance products, the design and development teams had some difficulties to built and create new websites, and functionalities, the main problems were:
To solve this problems, me with the design team created a small component library, dividing in small structure pieces (following part of Atomic Design created by Brad frost). The structure are divided by:
After that, each page and components was created by the component library to keep consistency and agilize the construction process, specially had more time to validate with the users pages or functionalities.
Even with the library, the design team wasn’t aligned with the development team, in the end, the final products had still inconsistencies because still didn’t have a macro structure with design and development working together.
Because of this, each tuesday, the development and design teams had meetings to talk about these problems, pains and insights to improve it.
In these meetings, a vision to make an universal structure was idealized, that unite all products builted since then, a fluid structure , then, this vision was named it by Be Water.
After all the problems and insights collected in these meetings, i did an activity with designers and developers to do a structure with same language between design and code and especially works to all products and new products that would come.
“Empty your mind. Be formless, shapeless, like water. Put water into a cup, it becomes the cup. Put water into a teapot, it becomes the teapot. Water can flow or creep or drip or crash. Be water, my friend.“- Bruce Lee
After the design tokens, names and taxonomy defined, an structure that works in all products came real, and helps to create new ones in a scalable way.
It works with an universal base, only changing the themes. Be Water comes to life, it became real, and was been using for all Escale teams (Health team, Telecom team, Operations team).
The creation and evolution of Be Water brings more benefits for all teams and product’s evolution: