Vobi Design System

Vobi Design System: Uma Jornada de Eficiência

A jornada para criar o Vobi Design System começou com a necessidade crítica de unificar e automatizar o produto, entre o mobile e o desktop. Cada pixel e linha no Vobi Design System foi delineado com base nas vozes dos usuários.

Pesquisas centradas no usuário foram o núcleo da definição, dando forma a um sistema que não só atende às necessidades práticas, mas também ressoa com os usuários, aumentando a usabilidade e a aceitação. A estratégia de branding não é apenas uma camada superficial, mas sim uma linguagem visual que ecoa confiança, eficiência e inovação.

Esse processo foi um esforço colaborativo, envolvendo usuários e stakeholders desde o primeiro esboço até a implementação final, garantindo que o Vobi Design System seja verdadeiramente uma ferramenta construída para, e com, aqueles que o utilizam internamente para o usuário final.

Escolhas de Cores Estratégicas

A paleta de cores do Vobi Design System transcende a estética. Cada matiz foi selecionado considerando não apenas a identidade visual da marca, mas também a psicologia das cores pensando na usabilidade da plataforma. O resultado é uma paleta que evoca confiança e ressona com o universo da construção, criando uma conexão emocional com os usuários.

Os tokens ficaram definidos seguindo uma estrutura como:‍

Color.Primary.Primary(0 - 100)‍

Color.Support.Neutral(0 - 100)

Color.Support.Neutral-variant(0 - 100)

Color.Alert.Success(0 - 100)

Color.Alert.Error(0 - 100)

Color.Alert.Warning(0 - 100)

Color.Alert.Warning-secundary(0 - 100)

Tipografia: Uma Linguagem Validada pelo Google

Na base textual, a tipografia INTER emerge como a voz do Vobi Design System. Validada pelas diretrizes do Google, essa escolha não é apenas estética, mas também funcional. A clareza e a legibilidade da INTER garantem uma comunicação eficaz, seja para profissionais lendo relatórios detalhados ou para equipes no canteiro de obras acessando informações cruciais em dispositivos móveis e possuí a documentação aberta para livre utilização.

Ícones: Construindo com uma Biblioteca Sólida

Os ícones no Vobi Design System não são apenas ornamentos visuais; são elementos que contam histórias. A escolha da biblioteca Fontawesome oferece uma vasta e rica coleção, simplificando o desenvolvimento e garantindo a familiaridade dos usuários. Cada ícone é escolhido para comunicar visualmente, seja representando ferramentas, documentos ou tarefas essenciais.

Automatização e Unificação para uma Construção Digital Coesa

A gênese do Vobi Design System foi a necessidade premente de unificar e automatizar os produtos do grupo. Ao atingir esse objetivo, os benefícios são tangíveis: a eficiência operacional se traduz em uma redução significativa no tempo de programação, liberando recursos para inovação e aprimoramento contínuo.

Pesquisas Centradas no Usuário e Colaboração Estratégica

Assim como os arquitetos, os engenheiros também são usuários da Vobi. Cada pixel, cada interação, foi moldado por pesquisas detalhadas, entendendo as necessidades, preferências e desafios dos profissionais da construção.

Este processo colaborativo não é apenas um diálogo, mas uma sinergia entre usuários, stakeholders e a equipe de design, garantindo que a plataforma seja verdadeiramente construída para atender às demandas do setor e também entregar valor na hora do desenvolvimento, garantindo rapidez e solidez.

Colaboração Estratégica e Pesquisa Centrada no Usuário

Evidenciamos a realização de um processo técnico meticuloso e estratégico. Cada escolha, desde a definição dos tokens até a implementação efetiva, reflete uma abordagem voltada para a eficiência, escalabilidade e alinhamento preciso às necessidades da empresa, no qual foi alinhado do começo ao fim com as áreas de engenharia, design e negócio.

Os tokens de cores, resolução, tipografia e ícones é mais do que uma combinação visual, serve para otimizar a experiência do usuário. A automatização e unificação resultantes têm impactos mensuráveis, culminando na redução significativa do tempo de programação. Essa conquista operacional, aliada à base de pesquisa centrada no usuário, destaca não apenas a funcionalidade da plataforma, mas também a sua adaptabilidade às complexidades e nuances da construção civil e arquitetura.

A colaboração estratégica, tanto com os usuários quanto com os stakeholders, delineou um caminho claro para a definição e implementação do Vobi Design System. A marca não é apenas visível superficialmente, mas permeia cada interação e escolha de design, reforçando a identidade e a missão da empresa. Ao final, o Vobi Design System emerge como um artefato técnico sólido, moldado pela pesquisa, colaboração e estratégia, destinado auxiliar como ferramenta na gestão de projetos da construção digital.re...

Hi guys! Here is a design system that i planning, design and developed

in-house for vobi company as i was Lead UI/UX. I hope you like it!

If inspires you, please like and save the project!

Please share some love ❤️

Behance | Dribbble | LinkedIn