Simplificando o mapa de assentos de linhas aéreas móveis usando UX

Um estudo de caso simples sobre design e limitações

Ao chegar ao setor de companhias aéreas, o mapa de assentos é uma das principais áreas colocadas em auxiliares no processo de reserva. A maioria dos mecanismos de reserva na Internet contém um mapa de assentos a ser usado pelo passageiro quando faz reservas on-line.

Para todas as companhias aéreas, sua principal receita são os passageiros que a utilizam para viajar e, como o uso da tecnologia aumentou rapidamente em todo o mundo, os Mecanismos de reserva da Internet estão seguindo os passos de ter sites responsivos móveis ou aplicativos móveis nativos.

Então, o que sabemos até agora sobre o mapa de assentos de companhias aéreas?

O mapa de assentos da companhia aérea contém os seguintes detalhes

  1. As classes de reserva disponíveis no voo (Primeira Classe, Classe Executiva, Classe Econômica)
  2. Os decks do avião (se o avião for de dois andares, o mapa de assentos deve mostrar o convés inferior e o convés superior separadamente)
  3. Onde as asas do avião estão localizadas
  4. Onde os banheiros, minibares e praças de alimentação estão disponíveis.

Esses detalhes são realmente valiosos quando se trata de reservar assentos aos passageiros para selecionar suas preferências.

Por que precisamos usar o UX no mapa de assentos?

Em um aplicativo IBE móvel, o mapa de assentos deve oferecer suporte total aos usuários para que tomem as decisões apropriadas ao reservar os assentos para sua jornada. O acesso em todo o mapa de assentos deve ser fácil e a quantidade de tempo que o usuário gasta na localização de um local no mapa de assentos deve ser menos frustrante e interessante. Como pode haver mapas de assentos realmente longos para as companhias aéreas que possuem o Boeing 747-400 com capacidade para 524 passageiros, devem poder oferecer uma interface amigável que ajude e guie o usuário a encontrar seu assento.

Então, vamos aos negócios, projetar o mapa de assentos

Ao projetar o mapa de assentos no nível do skitch, as folgas entre os assentos devem estar em um espaço considerável, pois o usuário do aplicativo pode estar usando um telefone celular de tela menor. Os ícones que mostram os diferentes assentos devem ser codificados por cores de forma que o usuário possa identificá-los adequadamente.

Os assentos selecionados devem exibir da maneira que os assentos estão sendo selecionados, principalmente uma sugestão visual com gradiente de cor ou animação diferente que seria útil nesses casos.

O mapa de assentos deve mostrar o convés como no convés inferior ou no convés superior, se o vôo selecionado for um voo de dois andares, deve permitir que o usuário alterne entre os conveses para fazer a seleção de assentos.

O usuário deve poder visualizar os assentos que já estão sendo reservados, assentos inativos e assentos disponíveis.

O mapa de assentos deve conter outras informações, como banheiro, áreas de serviço, localização das asas, posição das portas de saída para dar uma melhor indicação ao usuário onde eles se sentam quando viajam no voo.

Se o usuário estiver reservando assentos para vários membros, ele deverá poder visualizar a localização atual de um membro já alocado por ele e o número do assento.

Então vamos fazer o design visual

No design visual, estou selecionando duas metodologias para maximizar a experiência do usuário e entender qual método funciona perfeitamente para concluir a tarefa com menos número de problemas.

em um vôo longo, em vez de mostrar todos os assentos associados a diferentes classes, quando o usuário selecionar a classe de reserva inicial, a tela mostrará apenas os assentos da classe de reserva selecionados no avião.

Adicionando a mágica

Quando se trata de um negócio real, o usuário precisa percorrer o design no celular para chegar a um local. Para resolver esse problema, podemos ter uma versão menor do mapa de assentos como um pergaminho para mover para o local desejado rapidamente e efetivamente. O usuário terá duas funções em jogo para serem usadas para fazer a reserva.

Rolagem de visualização rápida do mapa de assentos

Existem duas maneiras diferentes de gerenciar o mapa de assentos.

  1. Usando o tradicional clique, permite ao usuário selecionar o assento
  2. Usando a função de arrastar e soltar para alocar o usuário ao assento
Reserva de assentos de arrastar e soltar e Onclick

Ao adicionar um mapa de assentos, a visualização rápida na parte superior permitirá ao usuário identificar onde ele está ao selecionar o assento. O usuário pode rolar a visualização rápida e alterar a localização do mapa de assentos rapidamente, facilitando a descoberta dentro do mapa de assentos.

A função de arrastar e soltar e suas limitações

O arrastar e soltar é uma funcionalidade bastante útil e sofisticada que funciona em aplicativos de desktop baseados na Web. Ele permite que os usuários selecionem e adicionem um determinado conjunto de dados de maneira significativa. Ao arrastar e soltar, a experiência do usuário é muito mais satisfatória para o usuário em aplicativos de desktop.

Ao chegar ao mapa de assentos, o usuário pode selecionar um passageiro da lista, como mostrado na imagem, arrastar e soltar o usuário no assento desejado. O usuário também pode adicioná-los separadamente a diferentes lugares. Quando o usuário deseja alterar o assento do passageiro que deseja, ele deve pressionar o assento do passageiro que está sendo alocado e, em seguida, o passageiro se torna arrastável dentro do mapa do assento. Em seguida, o usuário pode soltar o passageiro selecionado no local preferido.

Usar a função arrastar e soltar em um aplicativo móvel não é uma má decisão. Mas a quantidade de multitarefa deve ser limitada, já que um objeto ou, neste caso, um passageiro é arrastado e largado em um determinado local usando uma tela móvel. A sensibilidade ao toque do dispositivo móvel entra em cena. Se o dispositivo móvel falhar ao executar a função de arrastar e soltar corretamente, isso afetará diretamente a qualidade do produto e a funcionalidade da seleção de assentos. Como nem todos os dispositivos móveis têm telas grandes, a visibilidade após a seleção do passageiro na cesta para ser adicionada ao assento específico, a queda deve ser bastante precisa, pois o dedo humano pode cobrir 4 assentos no intervalo do assento desejado e deixaria o passageiro em um leve movimento de pressão em direção à tela.

A função da seleção tradicional e suas limitações

Essa função é uma ação direta. Para adicionar um passageiro, o usuário deve clicar uma ou duas vezes no assento desejado e um pop-up aparecerá com os passageiros atuais listados na seção de detalhes do passageiro e o usuário pode selecionar um passageiro a ser adicionado ao assento específico. quando o passageiro deseja selecionar um assento diferente, o usuário deve clicar duas vezes no assento selecionado e, em seguida, o painel de ação aparecerá e permitirá que o usuário possa remover o passageiro da seleção atual. Isso fará com que o usuário faça a reserva de assento desde o início até o passageiro específico.

E se o usuário quiser visualizar os detalhes do passageiro?

Um único clique no assento selecionado mostrará os detalhes do passageiro, bem como a classe de reserva e os detalhes do número do assento.

A quantidade de detalhes seria alterada de acordo com a importância das informações que precisam ser mostradas no mapa de assentos.

Então, o que eu consideraria como a função do mapa de assentos que funcionaria bem?

Eu usaria a função tradicional de clicar e selecionar devido à natureza do design e à funcionalidade que reduziria os problemas ao adicionar um passageiro ao mapa de assentos. Mas essa seria uma perspectiva de nível pessoal. Estou sempre aberto a sugestões e discussões.