Análise de UX – Erro de senha

É preciso claramente indicar ao usuário a resposta de sua última ação.

Em muitos sites, após errar a senha, uma mensagem de erro aparece. Caso o usuário erre a senha novamente, a mensagem de erro que já estava lá continuará no mesmo local após a página recarregar, ou até mesmo uma ação assíncrona ser executada tornando a situação ainda mais imperceptível.

O usuário então fica sem saber se a mensagem de erro é a que já estava lá (e o site ainda não deu resposta para a nova tentativa) ou se já é a resposta da nova tentativa.

Exemplos

O login do Gmail possui duas indicações muito sutis: a barra de carregamento no topo e a cor fica um pouco mais apagada. Caso o usuário se distraia por um segundo, não perceberá essas mudanças.

gmail-login-form

O login do Twitter exibe um banner indicando o erro. Esse banner é permanente portanto não há diferença entre o primeiro erro e o segundo erro. Outro ponto é que não há indicação visual de cor que possa ajudar o usuário a reconhecer um problema.

twitter-login-form

Soluções

O login do WordPress.com resolve isso ao esconder a mensagem de erro quando o usuário começa a digitar alguma coisa, portanto existe uma resposta imediata que aquela última resposta já foi eliminada e qualquer mensagem de erro será nova.

O login do Pinterest possui uma solução interessante. Para a mensagem de erro, ele simplesmente esconde o balão de texto. Porém, na terceira tentativa incorreta, o sistema já envia um e-mail com um botão para recuperar acesso à conta.

pinterest-login-form

E abaixo, o e-mail enviado.

pinterest-get-back

Chat com você mesmo no WhatsApp

Em alguns celulares, o WhatsApp não mostra o nosso próprio contato na lista de Novas Conversas. Nesses casos, tente os passos abaixo:

Método 1

Após o comentário da Bárbara, adicionei esse outro jeito, que é mais fácil. O bom desse método é que você poderá colocar um nome específico no grupo.

  1. Crie um novo grupo com um contato qualquer
  2. Remova o outro contato do grupo
  3. Agora o grupo só terá você

Método 2

  1. Busque, nos contatos, o seu próprio número
  2. Verifique se aparece, nos detalhes do contato, os links de ações do WhatsApp como “conversar com”, “chamada de voz”, “chamada de vídeo”.
    • Caso não apareça, tente adicionar o número do seu celular com o código do Brasil no começo, “+55”. Exemplo: seu número é 91234-5678; coloque +55 xx 91234-5678, substituindo xx pelo código da cidade.
    • Nessa situação, é possível que você tenha que realizar uma sincronização da conta do Google (Em Configurações > Contas > Google > Sincronizar agora)
  3. Clique no link de “conversar com …” e o WhatsApp abrirá em uma conversa com você mesmo

Talvez o WhatsApp não mostre o nome do contato no chat, mas o chat ficará disponível para receber mensagens.

Para referência: Android 5.1.1 e WhatsApp 2.17.254

Formato de 24h no Thunderbird

Para alterar o formato de hora utilizado no Thunderbird, customize o script de inicialização para exportar a variável LC_TIME, que controla como a data e a hora são exibidas.

Recomenda-se copiar o script de inicialização original, localizado em /usr/bin/thunderbird, para /usr/local/bin/thunderbird e fazer as edições no novo arquivo. Os scripts localizado no diretório “local” tem preferência, portanto ele será usado se existir. É possível verificar qual executável está sendo considerado com o comando which thunderbird.

O código consiste em exportar a variável LC_TIME com o locale desejado. No caso, estou usando pt_BR.

#!/bin/sh
LC_TIME="pt_BR.utf8"
export LC_TIME
exec /usr/lib/thunderbird/thunderbird "$@"

Encontrei a forma de fazer isso nesse post, mas alterei a variável para LC_TIME por recomendação encontrada aqui.

Importar fatura do Nubank para o Excel

Esse é um pequeno tutorial sobre como criar uma planilha no Excel com os dados de uma fatura do Nubank.

Download da fatura em CSV

Acesse sua conta no site do Nubank. Entre no link “Faturas” e selecione o mês desejado. Você verá as opções mostradas na imagem abaixo. Clique em “Exportar para CSV”. Importante: esse arquivo conterá as informações da fatura com valores, local de compra e data, portanto mantenha em um lugar seguro.

exportar-para-csv

 

Importar para o Excel

Caso você somente dê um duplo-clique no arquivo CSV, poderá abrir o Excel, mas não estará formatado corretamente, com cada valor em uma coluna. Para importar corretamente, abra o Excel e crie uma nova planilha.

Acesse a aba “Dados” e clique em “De Texto” na seção Obter Dados Externos.

importar

A importação pedirá o arquivo CSV que fizemos download antes. Após isso, faremos as seguintes configurações:

Etapa 1 da importação

  • “tipo de campo” deve estar “Delimitado”
  • “origem do arquivo” deve estar “65001 : Unicode (UTF-8)”.  Se deixar em “Windows (ANSI)” os acentos não aparecerão corretamente.

codificacao

Etapa 2 da importação

  • “delimitadores” deve ter “Vírgula” marcado

delimitador

Etapa 3 da importação

  • Clique no botão “Avançado”
    • Em “separador decimal” coloque um ponto “.”
    • Em “separador de milhar” coloque uma vírgula “,”

formato-numero.png

Finalmente, clique em Concluir. O Excel perguntará em qual célula deseja colocar os novos dados. Escolha o local desejado e clique em OK.

Análise de UX – ZAP Imóveis

Comecei ontem o curso “User Experience (UX) Research and Design” no edX oferecido pela Universidade de Michigan. No início do módulo “Introduction to User Experience”, uma das atividades pede para descrever dois exemplos: um de boa e um de má experiência do usuário.

Bom

No site ZAP Imóveis, é possível buscar resultados no mapa. Cada vez que se move o mapa os resultados da busca são atualizados automaticamente. Isso cria uma espera a cada interação e, às vezes, não queremos refazer a busca, queremos simplesmente navegar pelo mapa sem “perder” os resultados atuais.

Felizmente, existe a opção “Buscar enquanto eu movo o mapa”, que pode ser desativada e o mapa só é atualizado se clicamos no botão “Refazer busca aqui”.

zap-imoveis-opcao-atualizacao-automatica

Abaixo, o detalhe do botão após mover o mapa com a atualização automática desativada. Excelente! Com isso, posso navegar pela região de um anúncio sem modificar os resultados que já retornaram.

zap-imoveis-refazer-busca

Ruim

Para o segundo exemplo, pedido pelo curso citado no início do post, usarei o mesmo site. Nas opções de filtro, existe uma limitação em relação aos tipos de imóveis.

zap-imoveis-fitro-tipo

Nessa caixa de seleção, só é possível selecionar um dos tipos. Por exemplo, eu posso pesquisar “Todos os imóveis” ou algum tipo específico como “Casa de Vila” ou “Conjunto Comercial/Sala”. Porém, não é possível pesquisar por categorias como “Apenas residencial”, “Apenas comercial”, ou dois ou mais tipos específicos.

Para melhorar, minha sugestão seria que cada opção dessa caixa de seleção fosse um checkbox em que eu escolhesse exatamente os tipos que quero filtrar. Dessa maneira, eu poderia escolher, por exemplo: todos dentro de residencial ou apenas “casa de condomínio e casa de vila”.

Voando com a Azul

Ontem, pela primeira vez, viajei de avião com a Azul. Gostaria de destacar os seguintes pontos que foram positivos:

Serviço de bordo

O serviço de bordo foi realizado da seguinte maneira:
1) as comissárias passaram anotando as bebidas de cada um;
2) trouxeram as bebidas em bandejas;
3) trouxeram as comidas em cestas.

Ao contrário do carrinho bloqueador de corredor usado pela LATAM e Gol, as próprias comissárias trouxeram as bandejas e cestas na mão, realizando apenas algumas viagens para trazer tudo para todos. Foi um serviço muito mais agradável, silencioso e discreto.

Na LATAM e na Gol, o serviço de bordo é feito com garrafas e mais garrafas, serve aqui, serve ali, anda carrinho, para carrinho, “Senhor?”, coloca garrafa, esvazia garrafa, abre gaveta, “Senhora? Senhora?”, fecha gaveta. Nos poucos minutos que o carrinho está no corredor ao seu lado, existe um momento de agitação intenso que, na minha opinião, foi muito bem contornado pela Azul.

Sem propagandas

Ao entrar no avião e caminhar pelo corredor, algo estava diferente. Como se tivesse faltando alguma coisa. É daquelas coisas que demora um momento até entendermos, porque é diferente do que estamos acostumados.

Os assentos do avião não tinham propaganda. Que alívio! Na LATAM/Gol você tem que viajar olhando para o logotipo deles e um slogan qualquer. E não há como não olhar, pois está bem na sua frente, a menos de 50cm do seu rosto.

Na Azul, os assentos são só assentos e não veículos de propaganda. Eu espero que todos os vôos sejam assim e que eu não tenha dado sorte de pegar uma troca de propagandas.

Imagine se os restaurantes colocassem propaganda nos pratos, se os livros tivessem uma marca da editora em cada página, se os seriados tivesse o logo do Netflix, em algum canto da tela, durante todo o tempo.

Gostei da experiência, espero que isso se repita na minha próxima viagem que, se tudo der certo, será com a Azul novamente.

Restringir cache do Spotify no Linux

Estou usando pacote spotify do AUR no Arch Linux.

Para limitar o tamanho do cache:

  1. Abra o arquivo
    ~/.config/spotify/prefs
  2. Edite ou adicione a propriedade e configure o tamanho em MB
    storage.size=1024
  3. Reinicie o Spotify para aplicar a configuração
  4. Verifique o tamanho do diretório “Data”
    $ du -d 1 -h ~/.cache/spotify/

Referência: vi qual propriedade eu precisava editar nesse post.

Aviões em Guarulhos 2

No post anterior, fiz três perguntas e aqui estão as respostas:

A rota de pouso pode mudar no meio do dia?

Sim, dependendo da direção do vento ou da necessidade do aeroporto.

O Aeroporto de Guarulhos possui duas pistas de pouso:

  1. 09R/27L com 3.000 m x 45 m
  2. 09L/27R com 3.700 m x 45 m

Os números e letra indicam a ponta da pista. Portanto, a pista 09R/27L é a que liga a ponta 09R com a ponta 27L. Similarmente, a pista 09L/27R é a que liga a ponta 09L com a ponta 27R.

pistas

Os códigos 09R, 09L, 27R e 27L estão pintados no chão da pista. Abaixo, como exemplo, a ponta 09R.

detalhe-09r

O vídeo abaixo mostra um avião pousando na pista 09R, depois cruzando a pista 09L/27R, até chegar na área de parada.

No início do vídeo, vemos o sobrevoo pela Cantareira, com o piloto direcionando até ficar “de frente” para o Aeroporto; ou seja, seguindo a rota abaixo.rota-cantareira-detalhe.png

A direção das rotas de pouso e decolagem é definida pela direção do vento?

Sim, porém é a torre de controle que determina isso. Pode haver alguma manutenção necessária na pista, por exemplo, e a torre diz ao piloto qual é a pista de pouso a ser usada.

Existem outras rotas além das mostradas aqui?

Não. Quando os pilotos vão pousar pela 09R, fazem o sobrevoo na Cantareira e quando vão pousar na 27L fazem o sobrevoo em Arujá.

E da onde vem esses número 09 e 27? E as letras L e R?

Sobre isso, achei um post bem legal do Lito, veja abaixo:

http://www.avioesemusicas.com/os-numeros-pintados-nas-pistas-de-pouso-e-a-faixa-de-pedestre.html

Aviões em Guarulhos

Recentemente passei um tempo observando o movimento dos aviões no Aeroporto de Guarulhos pelo app Flightradar24. Dá para ver em um mapa aonde cada avião está e saber várias informações como origem, destino, altitude, etc. Abaixo, mostro duas screenshots que achei interessante.

Veja a “volta” que os aviões fazem, sobrevoando o Parque Estadual da Cantareira. A linha esverdeada mostra o trajeto percorrido pelo avião selecionado. Essa é a rota de pouso que os aviões estavam seguindo nesse dia. Atrás do avião selecionado, vem um outro que cumpre a mesma rota para descer ao aeroporto.

rota-cantareira

Nessa outra imagem, vemos uma rota diferente, em outro dia. Veja a linha verde esverdeada do avião que acabou de pousar. Dois outros seguirão a mesma rota para pousar em Guarulhos.

rota-aruja

Seria interessante saber:

  • A rota de pouso pode mudar no meio do dia?
  • A direção das rotas de pouso e decolagem é definida pela direção do vento?
  • Existem outras rotas além das mostradas aqui?

clj-sp meetup

Ontem, na sede do Nubank, aconteceu um meetup do Grupo de usuarios de Clojure de São Paulo. O evento teve duas palestras, com os temas abaixo:

  • Programação lógica-funcional e aplicações (Palestrante: Vinicius Correa)
  • clojure.spec (Palestrante: Alessandro Andrioni)

img_20161213_204733762

Na primeira, o Vinicius iniciou falando sobre o funcionamento do Prolog, como fatos são inseridos na base de conhecimento do programa e as conclusões lógicas que podemos tirar das relações entre os fatos. Em seguida, mostrou alguns exemplos de Clojure falando sobre representação de código como data e estilo de programação funcional, com mapas, listas e conjuntos. Também vimos vários exemplos de criação e interação com o banco de dados Datomic que permite, entre outra coisas, consultas lógicas sobre os dados armazenados e recuperação de estados anteriores do banco (antes de inserção, modificação ou remoção de valores) – interessante para auditoria.

Em seguida, em 45 minutos e talvez 200 exemplos, o Alessandro fez uma introdução ao clojure.spec. Passamos por inúmeros conceitos dessa biblioteca, incluindo como definir specs com s/def, como validar dados com s/conform e s/valid, atributos opcionais, geração automática de teste e muitos outros, com documentação disponível na API.

img_20161213_204633312

Para quem se interessou, segue o link do próximo evento, em Janeiro de 2017: clj-sp meetup Jan/2017