Wireframe

Um wireframe define-se por uma ilustração simplista da estrutura e dos componentes de um projeto, ou seja, é o primeiro passo no processo de design, onde são explorados os princípios básicos do projeto em questão. No caso de uma página web as informações relevantes a estarem presentes nos wireframes seriam:

  • Cabeçalhos.
  • Rodapés.
  • Barras laterais.
  • Separadores de conteúdo.
  • Pesquisa.
  • Widgets.
  • Gráficos.
  • Área de login/registo.
  • Interatividade (compra/partilha nas redes sociais).

Para a criação de wireframes muitos profissionais utilizam programas como: Adobe Illustrator, Adobe InDesign, Axure, PhotoShare, iPlotz, entre outros. Os wireframes são extremamente relevantes, pois antes de avançar com o design, deverá transpor para o papel ou em digital as suas ideias de como poderá funcionar um determinado projeto, em ambiente web, para que todo o processo seja exequível. Assim, poderá pensar atempadamente nos pormenores, evitando no futuro mudanças ou alterações que possam pôr em causa o êxito do projeto.

Wireframe

Na imagem acima apresentamos um exemplo de duas wireframes para IOS, das áreas da Galeria e da Composição da mensagem. 

Sobre o autor:
  • Marketing Consultant na Fullsix Portugal
  • Pós-graduação em Marketing Digital (IPAM)
  • Licenciatura em Relações Públicas e Comunicação Empresarial (ESCS-IPL)
  • Licenciatura em Ciência Política e Relações Internacionais (FCSH-UNL)

Glossário