Samuel Simões
Início Projetos Processo Depoimentos Formação Sobre mim Contato
arrow_back Todos os projetos

Caso 07 · IPA Turismo · turismo · 2026

IPATOUR: site, sistema e app para excursões

O ecossistema digital da IPA Turismo, agência de excursões rodoviárias de Ipatinga, no Vale do Aço: um site que vende a viagem, um sistema que organiza a operação e um app que leva o embarque para o celular do guia.

Papel
UX/UI Design e Design System
Cliente
IPA Turismo, Ipatinga (MG)
Ano
2026
Escopo
Identidade visual, site de vendas, sistema de gestão e app do guia
Capa do estudo de caso IPATOUR, com o ônibus amarelo da IPA Turismo

Contexto

Uma excursão rodoviária acontece em três momentos: a venda, a organização e o embarque. Em cada um, alguém diferente faz uma pergunta diferente. O projeto começou por essas perguntas: quem viaja quer saber quando sai, quanto fica por mês e com quem falar; quem organiza quer saber quem pagou, quem enviou o RG e quantas poltronas faltam; quem embarca quer saber quem já subiu e quem falta, às seis da manhã, com uma mão livre.

Slide do desafio: três pessoas, uma mesma passagem. Quem viaja, quem organiza e quem embarca.
O desafio: três pessoas, uma mesma passagem

Estratégia

A passagem é o fio condutor. O site gera a venda, o sistema emite a passagem com QR Code e confere o RG, e o app do guia lê o código na porta do ônibus. Quatro decisões sustentam a jornada:

A data é a vitrine

Próxima saída, vagas e parcela aparecem antes do roteiro. O card responde "quando" e "quanto".

O humano fecha a venda

O WhatsApp é etapa do fluxo, não plano B: o consultor confirma a vaga e envia o contrato.

Nada trava o embarque

Pagamento ou RG pendente vira aviso para o guia, não bloqueio na porta do ônibus.

Feito para as 6h

Uma mão livre, sinal fraco e fila na calçada: o app do guia mostra só o essencial.

Slide da estratégia: uma jornada, três telas. Site de vendas, sistema de gestão e app do guia, ligados pela passagem com QR Code.
Uma jornada, três telas

Identidade visual

O símbolo nasce da imponência da águia, que voa à frente do grupo. Ao fundo, o pin de GPS traz destino e segurança; no peito, a estrela é o guia; no centro, as letras I e T de IPA Turismo. O logotipo, sem serifa, é inclinado em 21°: a marca já parece estar em movimento. Esse ângulo reaparece nas transições e nos recortes do site.

Slide da identidade visual: a águia que aponta o destino, com águia, GPS, estrela e logotipo a 21 graus.
O símbolo: águia, GPS, estrela e logotipo a 21°
Slide com aplicações da marca IPA Turismo.
Aplicações da marca

Site de vendas

A home responde às duas perguntas de quem viaja, quando sai e quanto fica por mês, antes de qualquer roteiro. A parcela em 10x aparece no primeiro olhar, a busca filtra pela cidade de embarque do Vale do Aço e cada destino abre uma conversa no WhatsApp com mensagem pronta. No celular, a busca vira blocos e os botões ocupam a largura.

Slide do site de vendas, com a home em desktop e duas telas mobile.
Site de vendas: a data é a vitrine

Da compra ao embarque

Toda passagem nasce com QR Code no momento da emissão. Fechou a venda, a passagem sai na hora, sem esperar a conferência de documentos. O RG enviado na compra entra numa fila para a equipe comparar com o cadastro, e uma pendência vira aviso ao passageiro ("documento em análise, embarque garantido"). Na calçada, o guia aponta a câmera para o QR Code e marca quem embarcou.

Slide do cartão de embarque com QR Code e a confirmação de embarque.
A passagem com QR Code

Sistema de gestão

A operação cabe numa tela só. No topo, o dia em quatro números: passageiros em viagem, viagens ativas, RGs pendentes e receita confirmada. Só o card que pede trabalho ganha a cor de destaque e um atalho para a fila. Abaixo, cada saída mostra ocupação de poltronas, guia responsável e RGs em aberto. A mesma base alterna entre a visão do administrador e a do guia.

Slide do sistema de gestão com o painel de visão geral da operação.
Sistema de gestão: a operação numa tela só

Validação de RG

A passagem nasce válida, e o RG entra numa fila paralela. A equipe compara documento e cadastro lado a lado, com check em cada campo, vê frente e verso com zoom e rotação sem sair da tela e decide pelo teclado: A aprova, R reprova e as setas passam para o próximo da fila. O modal lembra que o embarque não depende dessa conferência.

Slide da validação de RG, com o documento ao lado do cadastro do passageiro.
Conferir sem travar

App do guia

Pensado para a calçada às 6h: o guia escolhe a excursão do dia, lê o QR Code de cada passageiro e acompanha quem já subiu no ônibus. É instalável sem loja, mostra o status num anel de progresso com três contadores (embarcados, aguardando, ausentes), tem o scanner no centro da barra, ao alcance do polegar, e permite marcar embarque ou falta com um toque.

Slide do app do guia com as telas Hoje, Roteiro e Passageiros.
App do guia: o embarque na palma da mão

Design system

Site, sistema e app bebem da mesma fonte de tokens: cores primitivas viram papéis semânticos (como brand-accent, feedback-success e feedback-danger), e os componentes só conhecem o papel. Trocar um tom atualiza os três produtos. Os tokens são exportados em formato W3C Design Tokens, prontos para o Figma e para código.

Slide do design system com tokens de cor, botões, etiquetas e status.
Tokens que viajam juntos

Resultado

Quatro peças para uma mesma viagem: identidade, site, sistema e app, no ar e ligados por uma única passagem. O site vende com clareza de data e parcela, a equipe enxerga a operação inteira numa tela e o guia embarca o grupo sem depender de papel nem de sinal forte.

Entrar em contato arrow_outward