A grande quantidade de dispositivos existentes torna a vida do designer de interfaces muito mais complicada e atraente.
Existiu um tempo onde a interface desenvolvida era feita ao agrado do seu desenvolvedor, onde o essencial era o sistema, a importância era a plena funcionalidade e a criatividade limitava-se a animações ou efeitos especiais. Em outro tempo a forma tornou-se mais importante que o conteúdo, fazendo aflorar as mais diversas mentes criativas elaborando os mais diversos labirintos virtuais com menus ocultos e formulários pulsantes.
Chegamos então à era do equilíbrio, onde o foco é no usuário, em um tempo em que a informação circula cada vez mais rápida e todos se tornam adeptos da tecnologia. E para que uma interface seja agradável, existem muito mais requisitos do que apenas ser bonita. Precisa ser organizada, leve e intuitiva para o usuário e adaptável para o designer de interfaces.
Muitos profissionais ainda começam seus códigos do zero, afirmando que isso garante um maior controle sobre os projetos e um código exclusivo. Porém como fica a manutenção após a sua ausência nessa etapa do projeto? E se não contemplar um manual para a manutenção do mesmo?
Que fique claro que o framework é uma ótima base para se desenvolver um projeto sustentável, além de deixar o projeto menos custoso, mas é necessário um bom nível de conhecimento técnico para que você possa personaliza-lo sem alterar sua estrutura base e nem correr o risco de deixar todos os seus projetos com a mesma cara.
Existem muitas ferramentas no mercado, algumas com manual já traduzido e biblioteca extensa, outras ainda começando. Em artigos futuro falaremos de algumas dessas ferramentas.
Uns navegam no tablet, outros no celular, uma parte gosta das telas wide e outros só possuem as telas convencionais, tem gente que navega na tela da geladeira, outros na televisão. A quantidade de dispositivos que podem ser aplicadas cria uma nova escrita nos códigos CSS que passam a contemplar as várias possibilidades de navegações do usuário que antes estava preso na resolução adequada, mas que atualmente usa a resolução que deseja.
Uma grande parte dos desenvolvedores de interface ainda utiliza como medida máxima os 1024 x 768, o que não gera nenhum desconforto, mas o problema fica por conta da medida mínima, já que a maioria dos dispositivos não convencionais tem resolução menor que o padrão atual.
O design responsivo flui de maneira melhor sem desorganizar ou distorcer o conteúdo independente da disposição da tela, trazendo a sensação de que a interface se adapta ao usuário e se torna comum ao uso, mostrando preocupação com quem navega, tornando fácil o uso e sem a necessidade de criar telas diferentes para resoluções e dispositivos diferentes.
Algumas das maiores tendências hoje em dia são: a simplicidade, cores chapadas, imagens vetoriais escalonáveis, tipografia simples, entre outras. Mas o que de fato aumenta o desempenho do usuário é a obviedade. Um front-end intuitivo logo se torna óbvio em seu uso por tratar realmente daquilo que foi prometido e muitas vezes dispensa o uso do manual.
Exemplo: Se foi criado um botão com intenção de excluir um registro, nomeie o botão com EXCLUIR, ou EXCLUIR REGISTRO e se optar por um ícone, use imagens óbvias como o desenho de um “X”.
O estilo visual deve pode ser usado como um sinal de confiança para ajudar as pessoas a compreender a linguagem fundamental de navegar sua interface: onde estou e onde eu posso ir. Para comunicar isso claramente aos seus usuários, os estilos de suas ações “clicáveis” (links, botões), elementos selecionados (itens escolhidos), e texto simples devem ser claramente distintas uma da outra e, em seguida, aplicado de forma consistente através de uma interface.
O posicionamento dos objetos na tela influencia no desempenho do usuário. Somos ocidentais e escrevemos da esquerda para a direita e de cima para baixo. Portanto as áreas de maior destaque devem seguir esse padrão.
Dica Importante: Coloque o menu na esquerda ou no topo, qualquer usuário do sistema irá intuitivamente nessas posições para navegar.
Durante o desenvolvimento é fácil criar, involuntariamente, várias sessões que possuem a mesma função. Mantenha-se atento para as funcionalidades duplicadas e que estejam rotuladas de maneiras diferentes, pois deixa o usuário confuso (e não queremos isso). Muitas vezes, quanto mais fragmentado a Interface, maior a curva de aprendizado do seu usuário.
Temos que ser firmes o suficiente para resistir à tentação de seguir os modismos e sensíveis para entender quais as novas e verdadeiras tendências.
Ouça, se informe, aprenda, até ouse, e lembre-se: O maior agradecimento que temos de um usuário é quando ele não liga de volta pedindo suporte no uso do sistema.
You must be logged in to post a comment.
2:51:24 pm
Ótimo artigo! Recomendarei…
3:21:01 pm
Gostaria de parabenizar o artigo e dizer que já estou de plantão aguardando a próxima publicação para receber dicas sobre, Ferramentas com manual traduzido e biblioteca extensa, poderia nos dizer se também existe alguma ferramenta boa de baixo custo ou até mesmo free.
4:09:35 pm
Boa tarde amigo!
Obrigado pela leitura e comentário do artigo.
Existem um framework que atualmente eu utilizo que é o Bootstrap. É ótimo para desenvolvedores HTML + CSS já que possui um pacote extenso de recursos e já estar integrado com um biblioteca jquery.
Se for para controle de conteúdo, eu aconselho o Word Press, nele você também pode encontrar vários temas agradáveis que podem ser personalizados com facilidade.
Mais adiante farei um artigo comentando sobre esses assuntos.
3:59:10 pm
Muito bom artigo, to esperando mais conhecimento…não demore 😉
4:56:08 pm
Uma dúvida quanto ao uso de frameworks, principalmente gratuitos. Ao utilizar framworks você não acaba por ficar dependente de uma ferramenta? E o que ocorre se ela se tornar paga ou por exemplo for abandonada pelo desenvolvedores oficiais?
8:02:48 pm
Boa noite César, desculpe a demora em respondê-lo.
Sim, podemos ficar dependentes se assim quisermos.
Um framework deve servir como um ponto de partida para a padronização de um código, mas por ser um código aberto, você pode usar dessa mesma padronização afim de criar uma estrutura própria para o trabalho e mesmo que este seja descontinuado pelo desenvolvedores oficiais, pode ser continuado por você e sua equipe.
O exemplo é o Gantry, que mesmo sendo um framework completo e bem estruturado tem como base o Bootstrap (http://www.gantry-framework.org/documentation/joomla/basics/).