Analisando a interface: Banco Santander

14/01/2018
a imagem mostra um homem segurando um smartphone acessando o aplicativo do Banco Santander

Olá pessoas, tudo bem?

Hoje lanço aqui neste singelo blog, uma série de posts que sempre tive vontade de fazer. Vou analisar as interfaces de serviços que usamos diariamente. Como cliente do Banco Santander, creio que tenho alguma propriedade para analisar a interface dos serviços do banco via internet, tanto desktop quanto do aplicativo, já que uso constantemente. Por isso, começo a série Analisando a interface com o Banco Santander.

OBS: O propósito deste post é apenas avaliar a experiência de navegação do aplicativo e desktop e não avaliar os serviços do banco.

No desktop

A interface sofreu mudanças importantes recentemente. Para qualquer transação, tinha que ter em mãos o cartão de segurança com 50 códigos. Imagina se eu esquecesse o cartão e precisasse fazer alguma transação emergencial? Impossível!

Na versão antiga, os serviços não eram bem distribuídos e, por isso, era bem confuso procurar um serviço específico (detalhe: não tinha campo de busca). A tela continha muita informação e tudo era muito junto, sem respiro. Com o tempo você se acostumava a usar mas, definitivamente, não era intuitiva no primeiro acesso. Dá uma olhada:

Após as mudanças, a interface ficou muito mais amigável e fácil de usar. Logo após o login, um tutorial é apresentado. Isso é muito importante para orientar quem acessa pela primeira vez e, mais importante ainda, é a opção de acessar esse tutorial quantas vezes forem necessárias.

 

Nova página inicial

Vamos analisar a nova página inicial do internet banking do Banco Santander:

Percebam que a interface ficou muito mais limpa e intuitiva. O campo de pesquisa está em destaque no topo da página e assim permanece em todas as páginas de serviço. Os itens de destaque estão separados por boxes, o que facilita bastante a interação. Dou destaque ao box Favoritos. Nele você pode inserir os serviços que mais utiliza, facilitando o processo. Um item importante, que já vem desde a versão antiga, é a opção para controlar o tamanho da fonte no topo da página. Mostra que o banco está preocupado com a acessibilidade. Poderia ter mais recursos, mas já é um começo.

O menu foi enxugado e você tem acesso a todos os subitens de maneira mais fácil e organizada:

Obviamente, utilizo muito o internet banking para pagamento de contas, faturas e recarga de telefone. Com a nova interface, o pagamento ficou mais simplificado. Ao acessar a opção Pagamentos, sou levada a tela de Preenchimento. Veja que boa parte da transação se resume a apenas uma tela. Você seleciona como quer pagar (débito em conta ou cartão de crédito), fornece o código de barras, o valor e se quer pagar no mesmo dia ou agendar.

Importante também o destaque para a navegação. Todo o andamento do processo pode ser visto no breadcrumb no topo superior direito. Ele é fundamental para mostrar ao cliente em que passo da transação ele está. Parece óbvio, mas muitas interfaces não possuem essa navegação ou a mesma não é destacada.

Este tipo de breadcrumb é fundamental para orientação

Após esse processo, sou levada a tela de Confirmação:

Aqui você confere se está tudo certo e valida a transação. Lembra do cartão com os códigos que citei no início do post? Era aqui que ele entrava. Agora esse código de segurança é gerado pelo aplicativo do banco. Bem mais cômodo, porque ando sempre com o meu celular. No aplicativo há uma opção chamada Id Santander onde você ativa o leitor de QR Code para gerar o código. O processo é bem rápido e as telas são bem leves e limpas.

Tela mostrando o processo de validação de segurança de uma transação utilizando o aplicativo

Processo de validação de segurança de uma transação utilizando o aplicativo

 

Após digitar o código, temos a tela Comprovante, onde mostra os dados da transação. Você pode imprimir o comprovante, salvar em PDF ou enviar por e-mail.

 

Tela final da transação

 

Se você tiver tudo em mãos, todo o processo leva menos de dois minutos. Quando ocorreu a mudança da interface, não tive nenhuma dificuldade de compreensão e consegui fazer as tarefas tranquilamente. O tutorial de início ajuda muito quem possa ter algum problema em compreender inicialmente e o campo de busca em destaque faz toda a diferença.

A tela mais enxuta e a melhor distribuição dos ícones deu o “respiro” que a interface precisava. A única mudança que faria seria colocar os ícones no topo, abaixo da barra principal. Não sei se o Banco Santander usa alguma ferramenta para analisar interações e com os resultados em mãos, preferiu manter as opções à esquerda. Se for essa a razão, foi uma escolha acertada.

 

tela com sugestão de tela com os ícones abaixo da barra principal

Sugestão de tela com os ícones abaixo da barra principal

O aplicativo

O aplicativo do Banco Santander recebe atualizações frequentemente e, assim como no desktop, vem melhorando muito com as mudanças. Eu tinha muito receio em fazer pagamentos pelo aplicativo (usava apenas para consultar o saldo e olhe lá!), mas com as últimas atualizações ficou muito mais simples pagar contas e faturas.

As telas são limpas, o aplicativo está bem leve e você pode fazer absolutamente TUDO por ele. Na página inicial, os serviços mais acessados, creio eu,  já estão listados, como consulta de saldo, pagamentos, consulta e pagamento de fatura, empréstimos, poupança e investimentos. Creio que essa escolha seja baseada em pesquisas internas, já que o banco deve ter total acesso ao serviços mais usados pelos clientes.

a imagem mostra tela de abertura e tela principal do aplicativo Santander

Tela de abertura e tela principal do aplicativo Santander

 

Se fosse para fazer alguma mudança, daria mais espaço entre as opções,  inserindo uma simples linha.

 

Sugestão de mudança: Inserir uma linha para dividir os serviços

Sugestão de mudança: Inserir uma linha para dividir os serviços

 

Para pagamentos, além de digitar o código de barras, também há um leitor de QR Code. Após esse processo, você verá um tela para conferência dos dados. Com o seu ok, você verá uma tela de confirmação. Tudo isso de maneira bem rápida e prática (com um bom acesso à internet).

Leitor de código de barras do aplicativo do Santander

Leitor de código de barras do aplicativo do Santander

 

Tela para digitar o código de barras no aplicativo do Santander

Tela para digitar o número do código de barras no aplicativo do Santander

Conclusão

Na minha opinião, tanto as telas da versão desktop quanto as do aplicativo estão bem desenhadas e mais intuitivas do que as versões anteriores. Cabe ao Banco Santander investir em pesquisas e análises de interações para que as melhorias sejam constantes, principalmente na questão da acessibilidade.

Até a próxima. Cya!