Desafio

Com mais de 25 anos de atuação em ERP, SFA e logística para distribuidores de bebidas e alimentos, a LinkedBy opera sistemas em uso contínuo, com impacto direto na operação de seus clientes.

O SFA é utilizado por vendedores em campo, em tablets e smartphones, para registrar pedidos, acompanhar rotas e capturar informações durante visitas. O Painel de Vendas é a interface web usada por gestores para configurar regras, monitorar operações e analisar dados. Enquanto um exige agilidade em mobilidade, o outro concentra alta densidade de informação.

São dois produtos distintos, com contextos de uso diferentes, mas que fazem parte da mesma operação.

Sem uma base visual compartilhada, cada evolução acontecia de forma isolada. Novas telas, novos módulos e novos fluxos eram definidos sem uma referência comum. Cores, espaçamentos, comportamentos e padrões variavam de acordo com quem estava implementando.

Esse modelo levou a um cenário de inconsistência acumulada. Elementos semelhantes se comportavam de formas diferentes. O usuário precisava reaprender interações ao navegar entre fluxos. No desenvolvimento, a ausência de componentes reutilizáveis gerava retrabalho constante.

Com a expansão da plataforma, esse custo deixou de ser pontual e passou a impactar diretamente a evolução dos produtos.

Transformação_

A Evo Systems foi acionada para estruturar essa base. O objetivo não era ajustar telas existentes, mas criar o sistema que sustentaria todas as próximas evoluções.

Nasceu o UXSync, um design system desenvolvido a partir dos fluxos reais da LinkedBy.

Em vez de adaptar frameworks genéricos, o UXSync foi construído considerando as necessidades específicas dos dois produtos. Cada componente responde a cenários concretos do vendedor em campo e do gestor no backoffice.

No Painel de Vendas, isso se traduz em componentes preparados para alta densidade de informação: tabelas com expansão inline, modais estruturados para múltiplas regras de negócio e um sistema de badges com semântica clara para leitura rápida de estados.

No SFA, os mesmos fluxos foram adaptados para o contexto mobile, mantendo consistência visual e de comportamento, mas respeitando limitações de tela e interação por toque. A transição entre os dois ambientes passa a ser natural para o usuário.

O sistema foi construído com atenção especial aos estados de interface. Cada interação relevante foi mapeada com precisão, incluindo cenários de exceção. Um exemplo é o fluxo de upload de imagem, que contempla desde a seleção até a confirmação, incluindo alertas específicos para ações incompletas.

O mesmo nível de detalhamento foi aplicado a módulos como Agendamentos, onde diferentes status operacionais possuem representações visuais distintas, facilitando a leitura e tomada de decisão.

O UXSync não organiza apenas a aparência das interfaces. Ele estrutura comportamento.

Benefícios_

O UXSync estabeleceu uma base única para os produtos da LinkedBy.

A linguagem visual entre SFA e Painel de Vendas foi unificada, eliminando a fragmentação anterior e criando uma experiência contínua entre mobile e web.

Os componentes passaram a ter definição clara de uso e comportamento, reduzindo variações entre implementações e eliminando a necessidade de decisões do zero a cada nova entrega.

Os estados de interface foram documentados de forma completa, incluindo exceções, o que aumenta a previsibilidade do sistema tanto para usuários quanto para o time técnico.

No desenvolvimento, a existência de uma biblioteca reutilizável reduz retrabalho e acelera a construção de novas telas, mantendo consistência sem depender de decisões individuais.

O resultado é uma plataforma mais coerente, mais fácil de evoluir e alinhada à complexidade da operação que suporta.

Ferramentas utilizadas_

• UX/UI Design

Sem fundação, o produto cresce desalinhado

O design system raramente parece urgente enquanto o produto ainda funciona. Mas, à medida que cresce, o custo da falta de padrão aparece em cada nova tela, cada ajuste e cada nova pessoa que entra no time.

A LinkedBy estruturou essa base no momento em que ela passou a impactar diretamente a evolução dos produtos. O UXSync consolida essa decisão.

Se seus produtos seguem crescendo sem uma referência comum, a questão não é se estruturar um design system, mas quando.