Metrô SP

Reprojetando um aplicativo, uma nova proposta de valor

Nota do autor: O projeto apresentado a seguir é resultado de um design sprint lab — um laboratório de duas semanas — conduzido durante um Bootcamp de UX/UI da Ironhack.

Logo do app Metrô SP

O Metrô

A Companhia do Metrôpolitano de São PauloMetrô — constituída no dia 24 de abril de 1968, é composta por 6 linhas, totalizando 101,1 km de extensão e 89 estações.

Integrada à Companhia Paulista de Trens Metrôpolitanos (CPTM), criada oficialmente em 28 de maio de 1992, formam a maior rede Metrôpolitana de transporte ferroviário da América Latina.

O sistema do Metrô transporta cerca de 5.300.000 passageiros em um dia útil e, combinado com a CPTM, forma uma rede de mais de 374 km (232 mi).

O aplicativo Metrô SP foi lançado em 2013, porém não teve uma atualização significativa desde então.

Objetivo do Projeto

Reprojetar e atualizar a IU do aplicativo Metrô SP com uma nova proposta de valor.

Desafios

  • Ser uma banda de um homem só (também conhecido como sozinho).
  • Desenvolver um produto mínimo viável (MVP) em um sprint de duas semanas.
  • Testar e avaliar o aplicativo atual de forma ágil.

Pesquisas

Antes de começar a pesquisar, era importante entender o serviço do Metrô, como funciona a infraestrutura e como ela é mantida.

Eu precisava me consultar com um especialista, uma expertise, então encontrei alguém: um ex-Supervisor de Tráfego de 66 anos, aposentado em 2018.

Com mais de 40 anos de experiência, de Assistente de Manobra a Supervisor Geral de Tráfego, Mr. R. esclareceu dúvidas sobre os procedimentos e o relacionamento do Metrô de São Paulo com seus usuários.

Ready to go!

Metrô SP App: Classificações e Avaliações — App Store (iOS) e Google Play (Android)

Depois de verificar as avaliações e análises do Google Play, um teste de usabilidade foi administrado para identificar problemas, encontrar oportunidades e aprender sobre os usuários.

Metrô SP — aplicativo atual

Usando a plataforma Maze, foi possível analisar respostas e visualizar mapas de calor através das seguintes tarefas dadas aos usuários:

1- Planeje uma rota para a Estação Vila Madalena.

2- Onde você pode encontrar o mapa do metrô?

3- Onde você pode verificar o status das linhas?

Mapas de calor das tarefas 1, 2 e 3.

4- Como você se sente sobre o mapa da rede?

Respostas da tarefa 4.
Respostas da tarefa 4.

5- O que você acha que a opção METRÔ CONECTA faz / mostra?

Respostas para a tarefa 5.
Respostas para a tarefa 5.

O Metrô Conecta é um aplicativo lançado em 2017: o Metrô de São Paulo aproveitou a home do seu aplicativo para incluir um botão que leva ao download do Metrô Conecta — se o usuário assim desejar.

Nenhum dos testadores acertou a pergunta.

Além dos testes, foi realizada uma pesquisa — com pessoas aleatórias da Região Metropolitana de São Paulo — para entender as preferências de transporte e o conhecimento atual do aplicativo.

Seguem alguns gráficos:

Qual é (ou era antes da pandemia) o seu principal meio de transporte?
Qual é (ou era antes da pandemia) o seu principal meio de transporte?
Você conhece, utiliza ou já utilizou o aplicativo `Metrô SP`?
Você conhece, utiliza ou já utilizou o aplicativo `Metrô SP`?
Você já foi abordado(a) por um estranho perguntando informações sobre o metrô?
Você já foi abordado(a) por um estranho perguntando informações sobre o metrô?
Se sim, sobre quais assuntos goi questionado(a)?
Se sim, sobre quais assuntos goi questionado(a)?

A partir dessa pesquisa, foram selecionados e entrevistados cinco usuários do metrô.

Como resultado, foi possível imaginar de forma mais precisa como um usuário frequente do metrô utiliza o aplicativo no cenário atual:

Em março de 2020, no início da pandemia do Covid-19, o tráfego de passageiros no transporte público de São Paulo caiu cerca de 60%, consequência dos efeitos colaterais da quarentena.

Entretanto, segundo esse gráfico da Moovit, conclui-se que o uso do transporte público esta instável desde então, crescendo exponencialmente até dezembro e caindo novamente com a segunda onda do vírus.

Síntese

Convergir os dados coletados em Diagramas de Afinidade, no Mapa de Empatia, na Persona e na Jornada do Usuário foi uma tarefa hercúlea, mas não mais difícil do que definir o problema.

Motivações

  • Aprender novas habilidades profissionais.
  • Desenvolvimento de carreira.
  • Conhecimento cultural.

Necessidades

  • Ser pontual no trabalho.
  • Informações sobre as estações de metrô e operações de linha.
  • Tempo para tarefas domésticas e atividades de lazer.

Frustrações

  • Metrôs lotados.
  • Estações de metrô ocupadas.
  • Tempo gasto em seu trajeto diário.

A Fernanda necessita de uma ferramenta para otimizar seu tempo na utilização do metrô pois sente desconforto com estações de metrô movimentadas, vagões lotados e tempo de deslocamento para o trabalho.

Declarar o problema da Fernanda não era o bastante, uma vez que objetivo principal do projeto era redesenhar o aplicativo do Metrô SP.

Entende-se que o aplicativo Metrô SP foi desenhado para ser um informativo de serviços do Metrô, um aliado na jornada do usuário dentro do transporte Metrôviário.

Dessa forma, foi observado que o aplicativo atual está falhando para com seu propósito, bem como suas funções:

  • Rotas: elementos desnecessários distraem os usuários das informações necessárias.
  • Mapa de rede: faltam flexibilidade e eficiência de uso (ex .: falta de aceleradores).
  • Linhas e Estações: o conteúdo e o design visual são basicamente os mesmos desde 2013.
  • Status de operação: falta consistência, dificultando a localização das informações.
  • Comunicação institucional: as pessoas precisam relembrar informações na interface, ao invés de reconhecê-las.

Ideação & Redesign

Antes de projetar uma nova interface, foi necessário estruturar a Arquitetura da Informação do aplicativo.

Ou seja, era preciso coletar informações já existentes no aplicativo com uma Auditoria de Conteúdo, entender os Casos de Uso da Fernanda, desenhar o Mapa do Aplicativo e mapear os principais Fluxos do Usuário.

73 / 5000 Resultados de tradução Auditoria de conteúdo: coleta de todas as informações que já existiam no aplicativo.
73 / 5000 Resultados de tradução Auditoria de conteúdo: coleta de todas as informações que já existiam no aplicativo.
Casos de uso: compreensão de cenários e situações em que o aplicativo será usado.
Casos de uso: compreensão de cenários e situações em que o aplicativo será usado.
Mapa do aplicativo
Fluxo do usuário: mapeamento de caminhos do usuário.

A aplicação da metodologia Red Routes aqui é essencial para descobrir e priorizar quais user stories são críticas e frequentes, decidindo quais devem compor o produto mínimo viável (MVP) a ser entregue.

Red Route Analysis: priorizando histórias de usuários.

Implementação

Após a prototipagem Mid-Fi (fidelidade intermediária) do app Metrô SP, um novo Teste de Usabilidade foi criado com o Maze (clique AQUI para conferir).

Protótipo de Fidelidade Média.

Dessa forma, ajustes finais foram realizados para chegar na seguinte solução:

Metrô SP — Protótipo Final

Tecnologia & Ferramentas

  • Miro.
  • Figma.
  • Maze.

Lições Aprendidas

  • Reciclagem de Expertise: Como funcionários aposentados podem transmitir sua experiência para as gerações mais jovens.
  • Mobilidade Urbana: Como a tecnologia pode melhorar o tempo de deslocamento.
  • Oportunidade: ótimo momento para rever e atualizar produtos / serviços, uma vez que a perspectiva do mundo mudou com a pandemia.

Próximo Sprint

  • Aprimorar o mapa da rede, as rotas e caminhos de configuração — também precisam ser redesenhados.
  • Aplicar recursos de acessibilidade — modo escuro e remova a transparência.
  • Conduzir novos testes de usabilidade — continuar iterando.

Projetar qualquer coisa é um processo de iteração infinito e este artigo é o resultado de apenas uma sprint.

Obrigado pelo seu tempo e por chegar até aqui!

A UX / UI Designer. A mad scientist, a curious problem solver, always learning to provide a unique experience.

A UX / UI Designer. A mad scientist, a curious problem solver, always learning to provide a unique experience.