Desenvolvimento

Ξ 6 comentários

Interface única para múltiplos usuários

publicado por Thiago Neves

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.

A escolha de um Framework para o seu Front End pode ajudar

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.

Responsivo

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.

Intuitivo. Não oculte nada, isso trará um trauma. Deixe tudo o mais óbvio possível.

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.

Na posição certa.

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.

Seja Objetivo

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.

 

Autor

Desde 1999 eu trabalho com projetos de mídia interativa. Com experiência em comunicação integrada e desenvolvimento de produtos digitais, planejamento estratégico, marketing digital, gerenciamento e desenvolvimento front-end, e-commerce e sistemas nas mais diversas tecnologias e integração de sistemas e tecnologia mobile.

Thiago Neves

Comentários

6 Comments

  • Ótimo artigo! Recomendarei…

  • 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.

    • 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.

  • Muito bom artigo, to esperando mais conhecimento…não demore 😉

  • 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?

    • 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/).

You must be logged in to post a comment.

Busca

Patrocínio

Publicidade



Siga-nos!

Newsletter: Inscreva-se

Para se inscrever em nossa newsletter preencha o formulário.

Artigos Recentes