2019
Client
Moringa Digital for UBEC
TEAM
Alex Lana — Front-end Developer
Gabriel Pedruco — Information architecture
Isabella Barbosa — Snowland's UI designer
Moringa Digital for UBEC
TEAM
Alex Lana — Front-end Developer
Gabriel Pedruco — Information architecture
Isabella Barbosa — Snowland's UI designer
What
Founded in 1972, the Brazilian Union of Catholic Education - UBEC has the objective of maintaining and manage catholic institutions of education in Brasil. It has universities and faculties across all Brazil's territory. Moringa Digital partnered with Snowland to deliver a new website on record time for almost all universities under the UBEC union.

Why
Currently, in addition to Catholic University of Brasília, UBEC also maintains the Centro Educacional Católica de Brasília (CECB), Centro Educacional Católica do Leste de Minas Gerais (CECMG), Centro Universitário do Leste de Minas Gerais (UNILESTE), Colégio Padre de Man (CPM), Centro Universitário Católica do Tocantins (UniCatólica), Faculdade Católica Recife (FCR) and Católica EAD, with 33 centers distributed throughout Brazil and also the United States, Japan and Angola.
Although they were all managed by UBEC and should follow similar visual identities guidelines and structures, each university website had its interface applied in an uncoordinated manner. Our challenge was to create an information structure and user interface that could be replicated easily across the different university websites owned by UBEC to build visual and structural consistency.
How
While my coworker Gabriel Pedruco worked on an information architecture that could suit the needs of the universities, I was in charge of building a custom component-based user interface library using atomic design principles. This library was made thinking of accessibility and responsive aspects such as color contrast ratio and mobile appropriate sizes. Having this user interface library ready greatly diminished the time needed to construct the layout of the website pages and allowed flexible modularity for future iterations or adjustments on UBEC universities websites.
Color palette with indications of accessibility levels created

Component-based user interface developed

Menu behavior and typography hierarchy created


Component-based user interface created



Final product layout created
