Design de produto
UX/UI design para sites, sistemas e aplicativos que as pessoas conseguem usar
Bonito não basta: a tela precisa levar a pessoa ao que ela veio fazer, sem treinamento e sem erro. A OnWeb desenha a experiência (UX) e a interface (UI) dos produtos que constrói, e também aplica fielmente o design que a sua equipe ou agência já criou.
- nota de fidelidade ao design aprovado em telas da Safetline
- 95
- nota de fidelidade ao design aprovado em telas da Safetline
- tamanhos de fonte num site inteiro, por decisão de produto
- 4
- tamanhos de fonte num site inteiro, por decisão de produto
- largura de celular conferida em toda entrega
- 390px
- largura de celular conferida em toda entrega
- contraste mínimo de acessibilidade como padrão
- AA
- contraste mínimo de acessibilidade como padrão
UX e UI: o que cada um resolve
UX (experiência do usuário) é o caminho: que informação aparece primeiro, quantos passos até concluir uma tarefa, o que acontece quando dá erro. UI (interface) é a forma: tipografia, cores, espaçamento, componentes e estados de cada botão.
Num site, UX bom é o visitante achar o produto e pedir a cotação sem procurar. Num sistema interno, é o time cadastrar um produto com 400 variações sem se perder. Os dois precisam de UI consistente, porque inconsistência é o que faz a pessoa duvidar se clicou no lugar certo.
O que fazemos em UX/UI
Pesquisa e entrevistas
com quem usa hoje, para entender tarefas, dores e vocabulário.
Arquitetura de informação
menus, hierarquia e nomes que fazem sentido para o usuário, não para o organograma.
Fluxos e protótipos
jornadas clicáveis para validar antes de construir.
Design de interface
telas finais, responsivas, com estados de carregamento, erro e vazio.
Design system
componentes, cores e tipografia documentados para crescer sem virar colcha de retalhos.
Implementação fiel
o design aprovado reproduzido no código, medido em pixel.
Do design aprovado ao site no ar, sem perder detalhe
Muitas empresas já chegam com o design pronto, feito por uma agência ou pelo time interno. O problema costuma aparecer depois: peso de fonte diferente, espaçamentos tortos, imagens achatadas. A OnWeb trata fidelidade como métrica.
Na Safetline, cada página foi comparada seção por seção com o design aprovado, com medição de fontes, espaçamentos e alturas por ferramenta, até chegar a notas de fidelidade acima de 90. O mesmo rigor vale para o celular: toda entrega é conferida em largura de 390 pixels.
UX para sistemas internos
Sistema interno costuma ser feito com pressa e usado por anos. Pequenas decisões de UX economizam horas por semana: busca que aceita nome, CPF ou número; filtros que lembram a última escolha; ações em massa; atalhos de teclado; confirmação só onde o erro custa caro.
Nos painéis da OnWeb, cada área tem textos de ajuda escritos para o usuário final ("tamanho recomendado 1215 x 831 px, fundo branco ou transparente"), e não termos técnicos. É isso que permite ao time do cliente operar sozinho.
Acessibilidade e performance fazem parte do design
Contraste mínimo, tamanho de toque, navegação por teclado, texto alternativo em imagem e tema claro e escuro entram no projeto desde a primeira tela. Performance também: imagem leve, fonte carregada do jeito certo e layout que não pula enquanto a página abre, o que pesa nas métricas do Google.
O que você recebe
Pesquisa documentada
o que aprendemos com os usuários e o que isso muda no produto.
Fluxos e protótipos
jornadas principais clicáveis e validadas.
Telas finais
desktop e celular, com todos os estados.
Design system
componentes e tokens no código, prontos para reaproveitar.
Implementação
interface construída e conferida contra o design.
Testes de uso
ajustes a partir de pessoas usando de verdade.
Como trabalhamos o design
- 01
Entender
objetivos do negócio, usuários e tarefas mais importantes.
- 02
Estruturar
arquitetura de informação e fluxos.
- 03
Uma tela de referência
aprovamos uma tela completa antes de produzir as demais.
- 04
Escalar
o resto do produto com o mesmo sistema visual.
- 05
Medir
comparação com o design e testes com usuários.
Feito pela OnWeb
Indústria · Calçados de segurança
Safetline
Site em três idiomas com painel de gestão próprio, assistente de IA que recomenda produto, modelo 3D gerado a partir de fotos e 627 endereços antigos migrados sem perder o Google.
Ler o case
SaaS · SEO e GEO
Crownler
SaaS de SEO e GEO em quatro idiomas: lê o site inteiro e desenha como um mapa, acompanha Google e respostas de IA, produz conteúdo e conversa com agentes de IA por API e MCP.
Ler o case
Energia · Comparador de energia por assinatura
Luz no Bolso
Comparador de energia por assinatura com 75 empresas em 26 estados e o EDI, uma IA que lê a foto da conta de luz, compara as empresas da região e conduz o cadastro na conversa.
Ler o casePerguntas frequentes
Vocês fazem só o design ou também desenvolvem?
Os dois. O design da OnWeb sai já pensado para ser construído, e o desenvolvimento é feito pelo mesmo time. Também implementamos designs feitos por outras agências.
Usam Figma?
Usamos as ferramentas que o projeto pedir, incluindo Figma e Canva quando o design do cliente vem de lá. O design system final vive no código, para não desatualizar.
Quanto tempo leva o UX/UI de um sistema?
Depende do número de fluxos. Trabalhamos por módulo: o design do primeiro módulo fica pronto antes do desenvolvimento dele começar.
Dá para melhorar a UX de um sistema que já existe?
Sim. Começamos observando o uso, listamos os pontos de atrito e redesenhamos por prioridade, sem parar a operação.
Serviços relacionados
Vamos ligar a sua empresa?
Conte o que você precisa. A gente responde com um diagnóstico do caminho técnico, prazo e investimento, sem compromisso.