App · Aviação e Pets

MIA Pet

App do Aeroporto Internacional de Miami para quem viaja com pet: identidade digital do animal, check-in e parceiros, feito na Ivy

Meu papel: UI/UX Designer Sênior

Quero um projeto assim

Contexto

O MIA Pet é um aplicativo para o Aeroporto Internacional de Miami (MIA) voltado a quem viaja com animais: cada pet ganha uma identidade digital com dados, vacinas e microchip, que o tutor compartilha com a companhia aérea e usa para fazer check-in nos parceiros do aeroporto. O projeto foi feito na Ivy, onde atuei como UI/UX Designer Sênior em toda a jornada do app.

Cliente

Miami International Airport

Empresa

Ivy

Ano

2023 a 2024

Papel

UI/UX Designer Sênior

Desafio

Viajar com pet envolve muita informação: espécie, porte, peso, vacina antirrábica, tipos diferentes de microchip, se o animal é de suporte emocional ou cão de serviço, condições médicas e comportamentais. Tudo isso precisava caber no celular de um passageiro com pressa, ser preenchido uma vez e reaproveitado a cada viagem.

A jornada, passo a passo

Fundo claro, azul do MIA na marca e azul de ação nos botões, com um título grande e uma tarefa por tela. Botão cinza enquanto falta algo, azul quando dá para seguir.

01 / 08
Entrada
Abertura com a marca do aeroporto, login por e-mail e senha ou com Google e Facebook, e o estado preenchido com o campo ativo destacado em azul.
02 / 08
Criar conta e verificar
Cadastro com nome, e-mail, senha e aceite dos termos, confirmação por link no e-mail e verificação do telefone com código de 4 dígitos. O botão só acende quando o código está completo.
03 / 08
Completar o perfil
Dados da conta em quatro campos e a foto de perfil, com a escolha entre tirar uma foto ou usar a galeria num painel que sobe da parte de baixo, e a opção "Maybe later" para não travar quem está com pressa.
04 / 08
Home dos pets
Os pets do tutor em cards empilhados com foto, código e o botão "View ID"; abaixo, um banner que alterna ofertas dos parceiros, o assistente de IA e o pin MIA, e um feed de dicas de saúde. O "+" abre a escolha entre cadastrar um pet ou falar com o chatbot.
05 / 08
Pet ID e ficha completa
O card do pet (foto, código, espécie, raça, sexo e nascimento) com três ações: ver o ID, compartilhar e fazer check-in. A ficha é dividida em blocos com marcador azul: castração, origem, porte, peso, vacina antirrábica, microchip (ISO 15 dígitos, AVID 9 e 10 dígitos), status de suporte emocional ou serviço, condições médicas e comportamentais e arquivos como o CVI.
06 / 08
Compartilhar com a companhia aérea
Quatro campos (companhia, origem, destino e data) e o botão "Share pet id". A confirmação muda conforme a ficha: para a maioria, "Happy to have you and your pet at MIA!"; para um pet que precisa de atenção, um aviso para falar com a companhia antes de viajar.
07 / 08
Check-in nos parceiros
"At MIA your pet is a superstar!": restaurantes e cafés do aeroporto com desconto para quem faz check-in com o pet, e o check-in pela câmera do celular no ponto do parceiro.
08 / 08
Conta e configurações
Perfil com foto, edição dos dados pessoais e preferências de notificações, idioma e unidade de medida, porque o app atende passageiros de vários países.

Todas as telas

Sistema Visual

Base neutra e clara para as fotos dos pets serem as protagonistas, o azul da marca do aeroporto na identidade e um azul mais vivo só nas ações. Os blocos da ficha usam um marcador azul na lateral para guiar a leitura de um formulário longo.

Paleta

Azul MIA

#005696

Marca, abertura e login

Azul Ação

#2C7ECB

Botões, links e campo ativo

Gelo

#EFEFEF

Fundo das telas

Cinza Campo

#D4D4D4

Campos e cards

Grafite

#4A4A4A

Títulos e textos

Aprendizado

Formulário longo não precisa parecer longo. Dividir a ficha do pet em blocos com um assunto cada, mostrar só o que se aplica (os campos do microchip abrem quando o tipo é marcado) e deixar o card do animal sempre no topo faz o tutor sentir que está montando a identidade do pet, não preenchendo papelada.

Mais projetos