autoVistoria iOS

Com uma câmera no celular, e um conjunto de sensores avançados, hoje o usuário tem no bolso uma poderosa ferramenta para realizar tarefas de forma muito mais autônoma. Isso permite que as empresas possam mudar seus modelos de negócio e reavaliar como seus serviços são entregues.

Este é um dos casos do autoVistoria, um aplicativo como serviço que permite conectar seguradoras e usuários em um processo de vistoria veicular descomplicado. Além disso, essa mudança no modelo de negócio, abre novas portas para a escala e abrangência da cobertura da empresa por trás do projeto.

Visão geral do app

Seguindo as guias de design do iOS e do Google Material Design o app teve sua interface bastante diferente entre si, porém mantendo aspectos importantes dos testes práticos como o fluxo de passo a passo que você pode descobrir mais detalhes abaixo.

Construindo o aplicativo

A estaca zero do estudo para o App foi realizar uma vistoria nos moldes tradicionais, cronometrando e registrando cada passo. O processo tradicional comumente é realizado em minutos por um especialista, porém, para um leigo como eu o processo demorou em torno de 1 hora sendo ajudado por um vistoriador.

Esse era um percurso que deveria ser acelerado e ao mesmo tempo descomplicado para o usuário final, com o aplicativo.

Nesta visita foi fundamental entrevistar o vistoriador e reproduzir os passos do profissional para entender os aspectos mais comuns da vistoria.

A expectativa da equipe neste ponto era de que aproximadamente 90% das vistorias através do app fossem de carros seminovos sem grandes alterações e com pouca ou nenhuma avaria.

Após essa fase de aprendizado e reunião de materiais, transformei os passos em desenhos, formando um fluxo com telas simples no inVision para testar na minha garagem. Cada refinamento no fluxo economizou um pouquinho mais de tempo, sendo que cada passo foi encurtado cuidadosamente. Por mais que o fluxo ficasse longo no final das contas, as informações tinham de estar lá junto com as fotografias do veículo, ou a vistoria poderia ser invalidada.

Primeiro ensaio de vistoria, cronometrando e anotando cada particularidade do processo.

Cronometrando na garagem

O refinamento teve três versões até que o fluxo de telas e instruções ganhasse consistência. Um último teste prático cronometrado, sendo cuidadoso e lendo cada instrução na tela, reduziu o processo de uma hora para pouco mais de 20 minutos, seguindo o fluxo mais comum de opções do veículo.

No cenário mais extremo, onde o usuário pudesse ter o carro todo avariado, com alterações por todo o veículo, o processo poderia demorar mais de 40 minutos – mas como eu mencionei, é um cenário extremo.

No vídeo você pode visualizar o primeiro fluxo do aplicativo. Cada passo foi descrito para dimensionar a condução do usuário.

Valiosos aprendizados da pesquisa:

1. O usuário poderia não autorizar o uso da câmera ou do GPS e neste caso um tratamento deveria ser feito aqui. Sem esses dois recursos chave a vistoria não poderia ser feita.
2. O usuário pode perder a conexão durante a vistoria, ou até mesmo ter uma conexão muito lenta para transmitir as fotos enquanto estivesse fazendo a vistoria. Neste caso, armazenar as informações e fotos para transmitir depois seria um recurso importante.
3. Em alguns pontos, por mais necessários que fossem, poderiam ser muito complicados para o usuário e neste caso a opção pular viria a calhar com um alerta de importância e uma rota de ajuda.
4. O usuário pode ter muita dificuldade em identificar aspectos técnicos e variáveis no veículo como por exemplo a localização do número de chassi. Neste ponto a empresa por trás do app se prontificou a ampliar o serviço de suporte por telefone e assim possibilitar a criação de um rota de ajuda instantânea para o usuário.
5. Pedir mais de uma coisa por vez no Wizard poderia economizar algum tempo ao mesmo tempo que poderia confundir o usuário. Optamos aqui por seguir com um fluxo mais extenso, porém bastante didático.
6. O aparelho do usuário poderia ficar sem espaço durante o processo da vistoria. Uma checagem de espaço aqui seria importante, principalmente para Android.
7. O aparelho do usuário poderia não ter bateria suficiente para chegar até o final da vistoria e neste caso um alerta foi pensado no fluxo da vistoria.
8. Alguns passos da vistoria poderiam oferecer risco ao usuário como ligar o carro estacionado e abrir e fechar o capô. Neste ponto, pensamos em alguns avisos amigáveis durante o wizard.
9. O usuário deveria poder seguir em frente e voltar em pontos específicos da vistoria, com liberdade no processo. Neste ponto, um validador indicando o que falta para completar a vistoria e um índice para chegar até cada tela rapidamente resolveu nossos testes.
10. Para evitar fraudes e troca de informação depois de terminar a vistoria, o app deveria travar as informações permitindo apenas a sua transmissão. Alguns insights de monitoramento foram adquiridos aqui, como verificar a mudança de posição no GPS e transmissão interrompida pela metade.

O desafio de prazo

O projeto de design abrangeu aparelhos iPhone e  Android, que para agilizar no desenvolvimento, foi estabelecido de início do projeto que usaríamos os componentes de interface nativos de cada plataforma, a iOS Human Interface Guidelines e as guias do Material Design.

Desde o aprendizado sobre este modelo de negócio até a entrega final das telas e protótipos, foram investidos 50 dias. Durante este período, a equipe de programadores já estava se movimentando. Havia pouca margem para erro e revisão, tão logo os caras precisavam de material para começar a corrida contra o tempo do lançamento.

Ter a equipe de desenvolvedores ativa e acompanhando os protótipos foi importante para agilizar e refinar o projeto para que assim que as telas “saíssem do forno”, começassem a ser produzidas.

Protótipo iOS

Uma pesquisa inicial na App Store revelou alguns aplicativos com pouco apelo de design e experiência do usuário e isso abriu oportunidade para se destacar entregando uma experiência visual mais elaborada, além de “fazer o dever de casa” entregando um fluxo prático.

O projeto foi fracionado em três grandes entregáveis. A primeira seria o protótipo iOS que validaria o “look and feel” do aplicativo e as informações contidas em cada tela. A partir daí, a versão para Android seria criada e baseada no fluxo aprovado do iOS, respeitando as guias de design do Material.

Por último, o fluxo de motocicletas seria adicionado ao app, como uma derivação do fluxo usado para os carros. Essa era uma premissa do projeto pois o sistema de retaguarda, possuía algumas limitações de base legada em que os conjuntos de informações para Carro e Moto tinham a mesma estrutura.

Sketch App + Invision Craft foram as ferramentas principais de desenho e mapeamento do protótipo.

O desenrolar das telas sofreu pequenas mudanças pois já havia sido validado numa etapa mais bruta da interface, usando o Sketch com o inVision Craft. Através dessas duas ferramentas ficou bastante acessível mapear grandes quantidades de botões e rotas e sincronizar tudo com o inVision. Sendo assim, cada evolução era testada lado a lado no iPhone.

InVision Craft: Uma verdadeira teia de aranha! Cada linha azul é uma rota de ação para outra tela 😅

Uma decisão de desenho que perdurou durante os testes foi o fato de deixar os botões mais acessíveis possível do dedão para que o usuário pudesse intercalar o uso de duas mãos (na parte da câmera) e uma mão (na parte do wizard).

O resultado foi essa bela e fácil interface com fluxo fluído.

Neste ponto a primeira etapa do projeto foi concluída. Confira a seguir a próxima fase onde eu falo do app para Android e o resultado da interface adaptada para o Material Design.

Veja a construção do app para Android →