Citymapper | Design Thinking Challenge
--
Se você vive em uma grande cidade com certeza conhece os dramas que envolvem nossa locomoção diária: trânsito, transportes públicos lotados, dificuldade de compra de passagens e muitos outros. Afinal, quem nunca saiu atrasado e de repente se deparou com um congestionamento intenso (e inesperado)? Ou se esqueceu de comprar os bilhetes de embarque e precisou enfrentar filas de última hora?
Para solucionar muitas dessas questões, diversos aplicativos vêm surgindo com o intuito de facilitar o transporte diário de milhões de pessoas, fornecendo informações muito úteis como o tempo de deslocamento entre dois ou mais pontos e os meios de transporte disponíveis para realizar a viagem.
Um dos aplicativos que se propõe a isso é o Citymapper, voltado principalmente ao sistema de transporte público de grandes cidades. Com ele você consegue pesquisar tanto a rota mais rápida quanto a mais barata disponível para o seu percurso, otimizando seu tempo. Além disso, integra os dados dos mais variados modais e está disponível tanto na versão mobile quanto na web. O aplicativo também conta com uma interface simples e bastante intuitiva (:
Porém, um quesito importante no Citymapper deixa a desejar: a impossibilidade de realizar a compra de passagens diretamente pelo aplicativo.
Assim, o desafio proposto foi desenvolver uma funcionalidade que facilitasse a compra de bilhetes, uma vez que existem diferentes canais de compra e também diferentes tipo de passagens para cada transporte. Poder simplificar isso com certeza trará muito mais comodidade e rapidez aos usuários durante a aquisição de bilhetes e esse é meu principal objetivo.
O conceito base utilizado no meu processo de pesquisa foi o Design Thinking, que dialoga com uma abordagem centrada no usuário. Desse modo, busquei entender os diferentes aspectos das necessidades dos usuários por meio de entrevistas e depois analisei os principais pontos encontrados aplicando a metodologia de Design Thinking, composta por cinco etapas: Empatia, Definição, Idealização, Prototipação e Teste.
No primeiro estágio, a Empatia, realizei uma breve entrevista com cinco pessoas de diferentes idades. Procurei investigar aspectos que dessem uma boa margem para descobrir como aplicar a funcionalidade de compra de bilhetes de forma a aprimorar o uso do aplicativo e sempre mantive o foco nas emoções do usuário, tentando me colocar no lugar dele e entender ao máximo suas experiências.
Os pontos principais pontos:
- Perigo do uso do cartão físico em plena pandemia da Covid-19;
- Possibilidade de compra de bilhetes em quantidades customizadas que se adequem às mais diversas necessidades;
- Necessidade de agilizar o embarque;
- Evitar filas para compra de passagem;
- Se manter informado com o histórico de compra de bilhetes;
- Bilhetes físicos contribuem para o desperdício;
- Pagamento por outras vias (cartão de crédito, plataformas como PagSeguro e pix);
- Praticidade de juntar várias funções em um só aplicativo.
O que todos esses pontos têm em comum? Apontam para uma necessidade de simplicidade e otimização.
Em tempos de pandemia, é inegável reconhecer que aconteceram mudanças que continuarão sendo adotadas mesmo após tudo voltar ao que era, sobretudo na área da tecnologia. A popularização massiva do uso de sites e aplicativos veio para facilitar as tarefas cotidianas é um dos pontos que certamente será mantido. Com isso, somos mais capazes de evitar aglomerações, filas e possíveis contaminações pelo coronavírus (que foi um aspecto citado por mais da metade dos entrevistados); sem falar na potência de agilização dos processos.
Isso nos leva diretamente ao próximo passo: a Definição. Para definir as principais questões a serem solucionadas, analisei novamente as falas dos usuários e sintetizei a seguinte sentença: “O principal objetivo do usuário é ter a possibilidade de comprar as passagens de forma simples e fácil por meio do aplicativo uma vez que a compra por outros canais muitas vezes é ineficiente e confusa, causando chateação. Além disso, o fator Covid-19 também se mostra relevante.”
O próximo estágio, a Idealização, consistiu em realizar um brainstorm para angariar as melhores soluções para o problema. Desse modo, cheguei em três pontos principais que irão compor a funcionalidade desenvolvida de acordo com as necessidades listadas pelos usuários.
O primeiro consiste na geração de um QR Code para facilitar a utilização dos bilhetes juntamente com o armazenamento das passagens dentro de uma carteira no próprio aplicativo. Já o segundo é a possibilidade de acessar um histórico com as últimas compras realizadas para auxiliar no monitoramento de gastos do usuário. O terceiro ponto é a adição de formas de pagamento mais práticas que as disponíveis atualmente: cartão de crédito, PagSeguro (plataforma de pagamento online) e Pix.
Durante o brainstorm me inspirei muito no transporte público de países mais desenvolvidos nos quais o uso de QR Code já faz parte da realidade cotidiana de grande parte da população e traz muitos benefícios para a otimização do embarque de passageiros. Além disso, o acesso ao pagamento exclusivamente online simplifica o processo de compra de bilhetes, uma vez que, em geral, as formas de pagamento presencial no transporte público no Brasil são bem restritas (somente dinheiro ou cartão de débito). Outro fator fundamental que contribuiu muito para o desenvolvimento dessa funcionalidade foi o benefício em relação ao combate à Covid-19, já que esse processo sendo realizado inteiramente online ajuda a minimizar a contaminação pelo coronavírus.
Agora vamos direto à Prototipação! Essa etapa consiste em simular o fluxo do usuário por meio da representação das telas da aplicação desenvolvida. Eu optei por dividir a representação em dois fluxos: compra de bilhetes e uso de bilhetes e acesso ao histórico. Desse modo a visualização fica mais fácil.
No fluxo de compra de bilhetes, representado em verde, o usuário irá preencher os campos com os dados de origem e destino de forma usual, porém antes de completar o processo, um novo botão “Comprar bilhete” (tela 5) irá aparecer. Clicando nele, ele será direcionado para uma nova tela (tela 6) que mostrará as quantidades e os tipos de passagens necessários para concluir a viagem, permitindo que o usuário selecione quais deles deseja comprar.
Em seguida, aparecerá uma tela contendo as formas de pagamento disponíveis (tela 7) e, após a confirmação, uma nova tela (tela 8) com a revisão dos dados da compra para prosseguir o pagamento. Depois da confirmação, o usuário é direcionado para a tela 9, na qual ele pode acessar a carteira, voltar à página inicial ou prosseguir a viagem.
Os outros fluxos (uso de bilhetes, em laranja, e acesso ao histórico, em azul) foram sintetizados em uma mesma esquematização a partir da tela de início onde está posicionado um novo botão, representado pelo ícone da carteira no canto superior direito.
Clicando nesse ícone, o usuário poderá visualizar todos os bilhetes que estão disponíveis para uso e, ao clicar em um deles, o QR Code será gerado. Para utilizá-lo, é só aproximá-lo dos leitores ao embarcar e a passagem referente àquele QR Code específico será deletada automaticamente, levando o usuário de volta à tela da carteira. Além disso, os bilhetes não possuem data de validade.
Também na tela da carteira acrescentei um novo botão no canto inferior direito que dá acesso ao histórico de compras. ao clicar nele, aparecerá uma tela contendo todas as informações das compras realizadas pelo usuário nos últimos dois meses, o que ajudará na manutenção do controle financeiro.
Eu me diverti muito realizando todas as etapas desse desafio, foi muito interessante e um ótimo início para adentrar o universo de UX/UI. Um dos pontos que considerei mais desafiadores foi a manutenção do foco no objetivo principal sem me preocupar tanto com a estética, uma vez que sou bastante perfeccionista. No entanto, acho que consegui desenvolver um bom trabalho e sigo ansiosa para seguir progredindo e me desafiando cada vez mais!
Se quiser deixar um feedback sinta-se à vontade e agradeço a todos que tiraram um tempinho para essa leitura 😄
