Trabalhando com apresentação

Salve padawan, domingo de sol e calor, uns sortudos na praia outros no computador, e a maioria se protegendo da pandemia em casa, utilizando algum aplicativo no celular/tablet/computador, por isso vou aproveitar no artigo de hoje para conversar sobre expectativas e desafios em desenvolver softwares.

Estou falando mais precisamente na interface usuário versus dispositivo, uma parte cheia de melindres, que se for desenvolvida errada enterrara seu software e causara inúmeros danos à imagem da empresa. Os parágrafos a seguir comentam sobre os desafios e problemas que surgem na criação do front-end e camadas de apresentação.

Front-ends um desafio

Por mais performático que seja o software, usando querys fabulosas e trazendo toda a informação necessário ao usuário, se não pensarmos na apresentação e na iteração com o usuário, metade do caminho estará perdido.

Veja inúmeros bons exemplos na WEB e mesmo fora dela, lidamos com expectativas e num mundo dinâmico, a imagem diz tudo, a navegação conduz o usuário e as mensagens nas horas certas, diminuem a frustação e a ansiedade na utilização do aplicativo.

Não faça essa cara de dúvida, vamos por partes como diria Jack. Antes de sairmos feito Dr Ivon Safe codificando loucamente e ansiosos por entregar a Sprite, as vezes perdemos o norte e esquecemos de coisas básicas.

 Deu ruim no levantamento de Requisitos: A Síndrome de Dr. Ivon SaF.

https://web.dio.me/articles/deu-ruim-no-levantamento-de-requisitos-a-sindrome-de-dr-ivon-saf

Workflow: o que e onde fazer

Lembre-se que todo bom software respeita um workflow, planejado e destinado a auxiliar o usuário, onde dividimos a tarefa em passo lógicos, que completos passam para a próxima tarefa, sucessivamente até o final.

Por isso, devemos trabalhar e criar um workflow que aproveita o máximo da performance possível, fazendo acessos a rotinas, databases e acessórios no momento certo, testando o retorno e avisando sempre o usuário sobre onde está, para onde vai e o tempo decorrido.

 Conceitos funcionais: WORKFLOW

https://web.dio.me/articles/conceitos-funcionais-workflow

Navegação: cadê o fio de Ariadne

Dentro de um aplicativo nem sempre estamos obedecendo um fluxo de trabalho, as vezes temos inúmeras possibilidade de idas e vindas, as vezes muitas opções confundem enormemente o usuário, lembro que nos idos anos 90 do século passado, os softwares eram tão confusos com tantas possibilidades, que nos perdíamos na GUI, necessitando consultar manuais com prints de tela para saber sobre a navegação.

Eram muito comuns os websites apresentarem uma página chamada MAPA do SITE, com todas as possíveis navegações de forma hierarquizada e acessíveis por menus e sub-menus.

O que está acontecendo? Um problema comum

Algumas vezes o app congela e não temos a menor ideia do que está acontecendo, vemos a ampulheta girando, girando e nada. Infelizmente o programador poderia ter dado um aviso e deixado esta mensagem na tela, assim o usuário sabe o que está esperado enquanto assiste a ampulheta girando e girando.

Uma boa pratica sempre, informar ao usuário que está entrando num possível gargalo, um ciclo que poderá demorar e deixa-lo decidir se quer ou não. Com os promises e os processamentos em paralelo, temos a sensação de fluidez, mas mesmo assim as vezes ficamos vendo o vazio, aguardando sem saber para onde vamos.

Cuide da aparência

As vezes alguns artistas resolvem encher o app de ícones, luzinhas, sons e coisinhas piscantes acreditando esta desenvolvendo o Estado da Arte em software responsivo, convido a todos a fazerem os cursos de UX, UI e FIGMA da DIO, descobrindo que menos é mais e recebendo excelentes dicas sobre o melhor Front-End.

Siga o padrão da instalação, atente-se sobre o local correto onde a mensagem estará, respeite as fontes e a tipografia do padrão.

Atente-se para a padronização de cores, tamanhos e pontos de entrada e saída. Nao queire fazer a apoteose do carnaval no seu software.

A Flexibilidade

Um problema comum é encher a tela com milhares de informações, textos, gráficos, botões e sabe la mais o que, pense que atualmente podemos acessar um determinado aplicativo através de inúmeros hardwares, tais como PC Desktops, PC Laptops, PDAs, Tablets, TVs e inúmeros outros IOTs.

Tenha atenção que algo que funciona num dispositivo de saída, poderá não funcionar tão bem em outros e a poluição visual atrapalhara o usuário gerando desconforto, que a longo prazo abandonara o app, ou solicitara uma nova versão.

Performance e uso de memoria

Outra coisa a nos atentarmos nem todo hardware possui as mesmas especificações e muitas vezes equipamentos de desenvolvimento são mais rápidos e com mais memória, que o equipamento do comum dos mortais, com isso, algo que funciona bem em desenvolvimento poderá falhar redondamente na máquina dos usuários.

Lembro que no Banco Real o Sistema funcionava perfeitamente em São Paulo com boas linhas de comunicação, porem para agencias de outros estados o mesmo aplicativo tinha um delay maior devido a instabilidade da comunicação com os computadores centrais.

Nos dias atuais a HBO Brasil sofreu vários problemas na estreia de suas series, devido à internet brasileira gerar gargalos e derrubar os servidores por inúmeros pedidos pendentes.

 Performance e otimização uma primeira olhada

https://web.dio.me/articles/performance-e-otimizacao-primeira-olhada

Prenda a atenção do usuário

Entregue a informação aos poucos, dando a mais relevante primeiro e deixando a menos útil no final. Assim deixamos na mão do usuário a liberdade de seguir ao fim ou não, tempo vale ouro.

Avise o que está acontecendo, indicando o ponto do fluxo do processo, em validações de mensagens de erro claras e simples, nada irrita mais que mensagens cabalísticas e com significado dubio.

Defina um local padrão para exibir as respostas dos sistemas, não confunda o usuário com mensagens aparecendo em locais aleatórios da tela. Imagina o pânico de uma pessoa ao usar o sistema pela primeira vez e não sabe o que significa aquela mensagem estranha que aparece saltitando na tela.

Sistemas globalizados

Não sabemos quem ou onde o seu aplicativo será usado, então as mensagens de output devem ser pensadas na localização, tornando simples o processo de tradução e acrescentar novos idiomas.

Atenção aos ícones e imagens utilizadas, o que para nos parece inocente ou divertido, poderá ser altamente ofensivo e irritante para outras culturas, muito cuidado e na dúvida, não use.

Conclusão

Jovem padawan, vimos de uma maneira ligeira alguns pontos sobre a apresentação do aplicativo, falei sobre os desafios em desenvolver um bom front-end, independente de plataforma, uma visão geral sobre os desafios em apresentar as informações, boas praticas sobre mensagens e workflow.

Convido a estudarem sobre Workflow, Mensagens de Retorno e Validação, Teoria das Cores, Tipografia e navegação em aplicativos, sei que é muita informação, mas conhecendo o básico poderá programar mais e melhor.

Espero ter ajudado ate o próximo artigo.

 Mais momento jabá, visita ao fabuloso palácio de Queluz lugar de luxo e glamour onde se realizou o ultimo grande baile da monarquia portuguesa, a pequena Versalhes portuguesa, jardins de sonho e glamour, luxo e requinte num palácio de verão, rodeado de belas estatuas clássicas e muita arte antiga, imagens para distrair, visite meu vídeo e veja para onde fui desta vez : https://www.youtube.com/watch?v=-eogEZbWinA

Bom curso a todos.

 https://www.linkedin.com/in/vagnerbellacosa/

 https://github.com/VagnerBellacosa/

Pode me dar uma ajudinha no YouTube?

 https://www.youtube.com/user/vagnerbellacosa