image

Acesse bootcamps ilimitados e +650 cursos pra sempre

60
%OFF
Article image
Vagner Bellacosa
Vagner Bellacosa12/02/2022 18:48
Compartilhe

🚸 🚸 🚸 Hells Interfaces 😈 Bugando os usuarios ♻️ ♻️ ♻️

  • #Boas práticas
  • #Arquitetura de Sistemas
  • #UI/UX

Problemas no Paraiso, Interfaces capengas com o usuário.

Salve jovem padawan, vamos entrar num tema melindroso, que podem render muito mimimi, haverá defensores e detratores, e mais uma vez, nós como desenvolvedores de softwares, temos a obrigação moral de auxiliar o usuário da melhor maneira possível nesta jornada.

Estou me referindo a camada de exibição, um tema complexo e extenso, referindo-me a Arquitetura MVC, que do alto dos seus 50 anos e inúmeras atualizações, ainda é o modelo dominante no desenvolvimento de softwares. Mas atualmente aumentou exponencialmente sua complexidade devidos aos inúmeros canais e tecnologias envolvidas.

Para não estender muito o escopo dos trabalhos falaremos da camada VIEW do modelo arquitetural MODEL VIEW CONTROL , relembrando seu significado resumidamente Modelo funções de processo; Visão ou front-end e Controle sendo o agente que interliga e gere as comunicações.

Este texto é um alerta, em Itatiba costuma dizer que é um passa rapaz, pois com tantas opções e tantas ferramentas, o DEV e os stakeholders ficam confusos e perdem recursos importantes e muitas vezes clientes por causa desta indefinição tenebrosa, Spinoza ajuda aí, é liberdade demais.

Qual o problema afinal?

Num passado recente as empresas atendiam seus clientes, no olho a olho ou por via de telefones/fax, evoluindo progressivamente para acessos a terminal 3270, software desktop off-line, software desktop online, troca arquivos via FTP, interface WEB, interface PDA e atualmente interface mobile, com inúmeros apps IOT complicando ainda mais o processo, entornando o caldo.

Na atividade bancaria durante muito tempo o principal canal era o Emulador 3270 com suas telas em BMS CiCS online ou Software AG Natural, sendo os outros canais os primos pobres, usando soluções remendadas para atender os clientes.

Situação que mudou radicalmente nos anos 90, com o conceito do Banco 30 horas, em que se dizia 6 horas na Agencia e 24 horas onde o cliente estivesse, por isso o Canal Telefônico, ganhou um folego extra e choveu investimento, muito antes do surgimento das Centrais URA, o pessoal do Call Center desdobrava-se em usar softwares bancários em mainframe emulados.

🚀 Mainframe, conheça um pouco sobre Sistemas Centrais   https://web.dio.me/articles/mainframe-conheca-um-pouco-sobre-sistemas-centrais

O salto seguindo ocorreu em 1995 com o advento da Internet no Brasil, antes alguns clientes VIPs tinham software de acesso ao Sistema Bancário, seja por aplicativo como por emulador 3270. Mas com a internet e sua mania, as páginas estáticas com propaganda institucional foram obrigadas a oferecerem muito mais, surgia assim, os serviços bancários reais, sendo criados inúmeras interfaces para atender essa demanda nos primórdios do Javascript, html e Flash Player.

🚀 Dilema da Seringa em programação de sistemas  https://web.dio.me/articles/dilema-da-seringa-em-programacao-de-sistemas

Infelizmente ou felizmente para as equipes de IT, que estavam se desdobrando com os problemas do Bug do Milênio, os famosos projetos Y2K, surgiu um canal silencioso, mas com forte apelo, o canal mobile ainda na época do 2G/3G, em que a velocidade deixava muito a desejar, os Bancos tiveram que desenvolver soluções para o acesso a serviços bancários neste canal, tirando o foco e os olhos nos BugBusters que corriam contra o tempo para recompilar e corrigir programas legados antes da 23:59 do dia 31-12-1999.

🚀 Bugou? Por que dizemos isso a erros no aplicativo? [Você sabia?] https://web.dio.me/articles/bugou-por-que-dizemos-isso-a-erros-no-aplicativo-voce-sabia

Veja que bela dor de cabeça, tínhamos uma equipe responsável pela lógica do produto e dezenas de equipes para a apresentação, lembro que no Banco Real, tinha a equipe mainframe, a equipe de baixa plataforma, a equipe Web e a equipe de celulares, quando surgia um produto novo, era briga de gente grande, cada lado querendo mais verba e pessoal para entregar a inovação.

🚀 Atenção, nem sempre as aparências enganam https://web.dio.me/articles/atencao-nem-sempre-as-aparencias-enganam

Paradoxo do Mobile First

Atualmente o conceito mudou e a maior parte das empresas adotaram o conceito Mobile First, principalmente devido a pouco usuários utilizarem outras soluções tais como Desktops e Laptops fora do conceito empresarial, sendo que os Milenais nasceram com os celulares nas mãos e desdenham dos velhos laptops.

Por isso, invertemos o papel dos DEVs, antes a prioridade era a Logica com uso cuidadoso de memora, espaço de armazenamento e ciclos de CPU, para um conceito de Design em primeiro lugar, onde temos maravilhosas obras de arte com cores, luzes, ação e animação, mas que enervam os usuários.

Sim, jovem padawan, muitas vezes o usuário somente apenas deseja abrir o aplicativo bancário e pagar a conta e ver o saldo, outras vezes, quer rapidamente escolher a comida e solicitar a entrega, ou consultar o catalogo, comprar e sair.

Mas infelizmente não é assim, o apps a todo momento pede ou faz atualizações, o carregamento das imagens e lento demais, o consumo dos bytes em trafego e absurdo, aumentando custos na conta telefônica.

Outras vezes ficamos perdidos e nos dispersamos por não encontrarmos o que queremos em centenas de ícones, cada qual mais sexy e chamativo que o anterior, embaralhados e confusos, perdemos tempo localizando apps numa seara fértil de cores e imagens, minha pobre liberdade de indiferença se perdeu no caminho.

Por exemplo por estes dias, sofri muito e irritei-me com um aplicativo, idealizado para facilitar a vida do usuário, na tarefa de upload de documentos, porem devido a limitação técnica, nao funcionou no meu celular, um aparelho mais antigo.

Frustrado tentei via laptop, por via do web browser Chromer , mas mesmo assim, deu luta, derrubou meu navegador por uso excessivo de memória e várias vezes travou meu pc, dificultando imenso a atividade, levei quase 8 horas para concluir uma atividade que demandaria 5 no máximo 10 minutos via e-mail. Fica a dica, pensem em usuários com equipamentos antigos.

Viajando as origens das interfaces

Caro padawan, senta que entramos no modo naftalina, vamos falar sobre a origem do conceito da GUI, dos front-ends e usabilidade do usuário, peço ajuda aos analistas de UX/UI, serei sucinto, afinal estamos numa jornada introdutória, mais uma vez agradecendo ao Wikipédia pelas informações adicionais.

No século XIX, o economista Josheph Schumpeter iniciou os primeiros conceitos teóricos sobre a Inovação Tecnológica e seu auxilio no avanço econômico das Nações, sendo o pontapé inicial para as grandes pesquisas que culminaram com a informatização e a computação no século XX.

Nessa corrida rumo a Inovação Tecnológica surgiram inúmeros cacarecos e sementes de ideias sobre a Rede Mundial de Computadores, inspirados pelo avanço do Rádio e Telegrafo, interligando continentes via cabos submarinos, a informação gerada aumentou exponencialmente, os arquivos em papel implicavam muito trabalho humano, indexando e organizando extensas Bibliotecas com livros e mais livros, inclusive existia uma profissão chamada de Guarda-Livros.

Nesse ponto surgiu a ideia do Memex, obra da mente genial de Vannevar Bush, existe o artigo de 1945, chamado de “Como podemos Pensar” e foi traduzido para português, onde ele expõe sua visão e propõe a criação de um serviço misto de Painel de Controle, Celular, Google, Torrent, Web e Chat, bem na era do surgimento dos computadores, nem monitores existiam, usando cartão perfurado e consolas com lâmpadas apagando e acendendo ou fitas impressas, o barulhinho dos reles deveria ser infernal, um trabalho estafante, era muito difícil a interface humano e Computadores.

Os primeiros front-ends

Eram fabulosos os écrans com texto verde e fundo negro, com 32 linhas e 80 colunas, obrigando o uso de muita imaginação para criar telas e navegação em workflow nas tarefas, que demandavam muito trabalho de digitação, era de ouro dos datilógrafos.

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

Os Sistemas eram muito sisudos, bem pouco amigáveis com vários menus e submenus, comandos de linha e macros control + tecla, porem rápidos e evitando movimentos inúteis, mas a pressão dos usuários por cores e luzes, obrigou os engenheiros a pensarem na próxima geração de front-ends baseadas em Windows e microcomputadores velozes.

O surgimento da GUI

Os primeiros trabalhos para o GUI, surgiram com os computadores, porem o custo era inviável e necessitavam de muitas inovações, com a chegada da TV e sua rápida evolução dos tubos catódicos, permitiram a resolução necessária, passo muito esperado, desde a evolução dos transistores, tecnologia necessária para o próximo salto a GUI,

A Graphicl User Interface, ou Interface Gráfica de Usuário, surgiu nos laboratórios da XEROX e foi contrabandeada pela APPLE, posteriormente usurpada e melhorada pela Microsoft, com muitas histórias acontecendo em paralelo e casos de espionagem industrial , temos a IBM e muitas outras empresas ajudando nessa fabulosa evolução, cada qual criando um periférico fabuloso.

O resto é história que iremos explorar no futuro culminando com a inundação de APPs para Celulares com inúmeras tecnologias explorando ao máximo as interfaces gráficas de usuário com auxílio de mouses, canetas, sensores e toques sendo o ápice desta jornada os comandos de voz e os tutores Cortana, Siri, Alexa e tantos outros assistentes virtuais.

Minha crítica a interface capenga

No anseio por produzir MVP, muitos programadores esquecem do Peopleware, lançando programas com navegação difícil, excesso de cores e inúmeras distrações que dificultam o workflow e o trabalho usando dispositivos moveis. Veja a lista de cuidados ao desenvolver apps.

1)	Pense nos equipamentos antigos, qual o equipamento mínimo ideal para uso de seu software.
2)	Lembre-se que existem inúmeros usuários com problemas de visão, que podem nao visualizar bem devido ao tamanho das fontes
3)	A quantidade de memória RAM consumida pode prejudicar a experiência do usuário
4)	Uso excessivo de CPU pode travar o equipamento
5)	Efetuar upload de arquivos pode ser um martírio, afinal o usuário pode ter inúmeras pastas a serem utilizadas
6)	Menus e pop-ups em demasia irritam profundamente
7)	Barras de scroll infinitas e confusas
8)	Imagem de fundo confunde-se com o texto
9)	Estudar UX não mata ninguém
10)	Estudar UI , repetindo-me não mata ninguém
11)	O TextBox e ListBox devem ser usando com sabedoria
12)	Performance é importante
13)	Teste seu aplicativo em diversos equipamentos
14)	Veja qual a resolução mínima ideal 
15)	Constantes atualizações irritam muito
16)	Menos é mais
17)	Lembre-se da regra de Pareto 
18)	A Lei de Murphy é real
19)	Muitos celulares tem a tela trincada, pense no pobre usuário
20)	A lista não termina mais

🚀 Tríplice alicerce da informática: PEOPLEWARE https://web.dio.me/articles/triplice-alicerce-da-informatica-peopleware

Canais de distribuição

Seu cliente usa predominante qual canal? Sua solução atende a quem? Lembre-se não podemos servir a dois senhores, antes de sair fazendo a la Dr. Ivon Saf, analise e negocie.

1)	Canal Desktop
2)	Canal Call Center
3)	Canal Web-Browser
4)	Canal Mobile
5)	Canal Emulador 3270
6)	IoT
7)	Outros.

🚀 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

Conclusão,

Obrigado pela paciência meu jovem padawan, divertiu-se na jornada, pense no usuário, cuidado ao codificar, pense em auxiliar, somos facilitadores, quanto mais podemos fazer para melhorar a produtividade dos utilizadores.

Aproveitei para passar em revista os trabalhos de Bush e Schumpeter, vimos os avanços tecnológicos e os passos de formiguinha para aprimorar a interface de usuário, melhorando significativamente os periféricos de entrada, saltando de botões para cartão e fita perfuradas, teclados e monitores, num salto gigantesco com a criação dos mouses e telas clicáveis.

Tendo sempre em mente, em facilitar, criando soluções rápidas e com curva de aprendizado rápida, pois irrita profundamente a sensação de inutilidade em cada evolução de software. 

Espero ter ajudado ate o próximo artigo.

image Referência Bibliográfica

WIKIPEDIA - A Enciclopédia Livre, faça parte, ajude atualizando ou criando verbetes http://www.wikipedia.org

Google Books um repositório com milhões de livros digitalizados https://books.google.com/

Internet Archive, tudo aquilo que um dia foi publicado veio parar aqui. https://archive.org/

Biblioteca de ícones https://www.flaticon.com/

image

image Mais momento jabá, uma visita a cidade aventura, estamos em Brotas seguindo na Estrada do Patrocínio rumo a São Pedro, em um dia super ventoso, apreciando la longe o rio Piracicaba, o Cristo Redentor e inúmeras curiosidades nesta jornada pela Serrinha , visite meu vídeo e veja para onde fui desta vez : https://www.youtube.com/watch?v=remxyfMggDg

Bom curso a todos.

image https://www.linkedin.com/in/VagnerBellacosa

image https://github.com/VagnerBellacosa/

Pode me dar uma ajudinha no YouTube?

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

Compartilhe
Comentários (0)