Fluxo ideal de compra de passagens

Rafael Yukio Kanaoka

Questão Arquitetura de Informação

Diretrizes da resolução da questão

• Mapeamento de tarefas em um site de compras de passagens aéreas

• Fluxo de tarefas para a compra de passagens

• Apresentação do protótipo

• Defesa da solução

Mapeamento de tarefas em um site de compras de passagens aéreas

• Pesquisar por destinos para se viajar, quando não temos um lugar definido ainda

• Procurar os lugares com melhor custo/beneficio • Buscar por ofertas e passagens promocionais dependendo de feriados e

sazonalidades • Comparar preços de passagens e realizar orçamentos • Encontrar os endereços das lojas físicas e outros meios de contato • Saber um pouco mais sobre o perfil da empresa • Verificar o feedback de outros clientes da empresa, procurar nas redes

sociais se algum amigo conhece e já viajou por essa empresa • Se informar sobre detalhes da passagem, como preço, formas de

pagamento, o que está incluso e o que não está • Finalizar o processo de compra com o pagamento e o aceite dos termos • Receber os comprovantes da compra

Fluxo de tarefas para a compra de passagens

• Acessar o site • Encontrar onde buscar por passagens

– Ir para página de passagens no menu de navegação principal – Utilizar painel posicionada na home com a aba “pesquisar passagens”

• Preencher formulário com informações da viagem – Selecionar trechos “ida e volta”, “só ida”, “vários trechos” – Selecionar lugar de partida e destino – Selecionar data de ida e data de volta – Definir número de passagens

• Adultos • Crianças • Bebês

– Preencher código promocional se possuir

• Clicar no botão “buscar voos”

• Escolher o voo – Selecionar o voo de ida

• Escolher o tipo de tarifa

– Selecionar o voo de volta • Escolher o tipo de tarifa

• Preencher dados dos passageiros – Já tenho cadastro – Não tenho cadastro – Confirmar dados dos passageiros

• Escolher o assento – Selecionar o assento no voo de ida – Selecionar o assento no voo de volta

• Extras – Contratar seguro viagens

• Pagamento – Endereço de cobrança – Resumo da compra – Selecionar a forma de pagamento – Número de parcelas

Apresentação do protótipo http://i8lmwq.axshare.com/

Tela de busca por passagens:

O campo de código promocional está ocultado e é disponibilizado em um alert box ao se clicar no link “Eu tenho código promocional!”

O link da logomarca foi fixado para sempre redirecionar para a página inicial, o que já é uma ação esperada pelo usuário ao se clicar na logomarca

1

2

1

2

A ação rotulada no botão “Buscar voos” corresponde à ação realizada 3

3

Tela de escolha do voo

Os textos “Selecione o voo de ida” e “Selecione o voo de volta” foi posicionada de forma que possua a capacidade perceptiva de divisão, organizando a tarefa em duas etapas distintas

Caso o usuário deseje uma comparação de preço com voos de outras datas, ele pode visualizar um comparativo clicando no botão “Comparador de preços com outras datas”

Os detalhes da passagem, conforme os dados forem selecionados, poderão ser visualizados no topo da página, abaixo do menu de navegação principal

1

2

3

3

2

1

1

Caso o usuário não esteja logado, será colocado a opção para ele acessar a conta, caso não tenha uma conta, poderá se cadastrar clicando no botão “CADASTRE-SE”. Estas opções ficarão ocultas, e ficará exposta apenas a chamada “Já possui cadastro?” (inserir um botão abaixo para expandir).

Pequeno formulário para preenchimento dos dados dos passageiros, com validações dos campos obrigatórios.

1

2

Tela de escolha do voo

1

2

A instrução e a legenda para utilização da interface de seleção dos assentos são apresentados antes que o usuário visualize a interface

Os botões instruirão as ações que o usuário deverão tomar para realizar as etapas da seleção dos assentos.

1

2

Tela de escolha dos assentos

1

2

1

2

Tela de serviços extras:

Os serviços serão listados e para contratá-los basta selecionar o checkbox “Contratar”. Caso o usuário queira saber mais sobre o serviço, haverá o link para “ver mais detalhes”

O usuário pode navegar pelas etapas do processo de compra pelas abas/breadcrumbs e pelos botões voltar/prosseguir que estão disponíveis em todas as telas

1

2

1

2

2

Defesa da solução

• Para não sobrecarregar o usuário com muitas informações e facilitar o seu processo de compra, apenas o que é realmente necessário para se preencher foi colocado na tela. Informações e funcionalidades adicionais, podem ser acessadas por botões ou links, como por exemplo o botão de “Comparador de preços com outras datas” e “Eu tenho código promocional”.

• A animação entre as etapas do processo, mantêm uma boa continuidade do processo de compra, retirando as quebras do carregamento da página e a interrupção da fluidez do pensamento do usuário.

Rafael Yukio Kanaoka Estudante de Arquitetura de Informação e UX na Faculdade

de Impacta e Tecnologia; formado em Analise e Desenvolvimento de Sistemas na IFSP, Analista de Sistemas

na Amdocs, Fundador do projeto SamuraiUX (samuraiux.com.br)