Blog

Artigos sobre desenvolvimento web

Wireframe, a planta baixa de um site

Um site é construído em diversas camadas. Embora o usuário leigo trate o site como uma interface apenas, ele é construído atravaés de uma série de camadas e o design visual é apenas uma delas.

Antes de ser criado o layout com todas as formas, cores, ícones e outros apetrechos visuais, o projeto de um site passa por uma fase mais estrutural chamada de Arquitetura de Informação.

Nessa fase, o site tem suas estruturas trabalhadas. Quantas seções iremos ter? Que nome elas levarão? O que haverá em cada uma delas? E como elas ficarão dispostas na tela?

Imagem de um wireframe

A figura acima é o exemplo de um wireframe da primeira versão do site da Wenetus. Como pode ser visto, o wireframe é uma espécie de planta baixa do site, onde a presença e o posicionamento dos elementos que o compõem é pensada.

Ele é importantíssimo para que desenvolvedor e cliente discutam a interface do site antes de passar para o layout. Você já viu algum arquiteto ir derrubando paredes antes de fazer a planta baixa de um IMóvel?

O wireframe é simples de ser modificado pois nele não há preocupação com cores, alinhamentos, fontes e outros atributos estéticos. A finalidade é só discutir quais são os elementos da interface e como eles serão apresentados.

Antes de mostrar qualquer layout a nossos clientes, sempre apresentamos antes o esboço em forma de wireframe para ser discutido. Assim poupamos o tempo e o dinheiro das empresas que nos contratam e aumentamos as possibilidades de retorno do investimento.

6 comentários

Assine os feeds dos comentários deste post

  1. Rog

    [...] de interpretar os wireframes, mas sim tentar trocar experi

  2. Apocalipse « Vamos Falar Mal

    [...] Simplesmente porque a praga da virtualidade está matando a propaganda. Não adianta falar que é evolução, revolução ou inovação.  Ninguém nunca gostou de propaganda, mas ao mesmo tempo em que era fácil fugir dela, você acabava vendo alguma coisa, e até rindo ou se emocionando com as melhores. Quando você lia uma revista (você ainda lê revistas?), na maioria das vezes era sem pressa, relaxado, e simplesmente virar a página de um anúncio não era difícil. Mudar de canal na televisão na hora do intervaldo também era fácil (tá, às vezes ainda vemos TV). Não olhar para um outdoor era fácil, e em um engarrafamento eles até audavam a passar o tempo. Você se lembrava das melhores por um bom tempo, cantava os jingles, usava os bordões, comprava os produtos. Beleza, você ainda compra os produtos, mas o que tenta te motivar está tão cinza quanto um wireframe. [...]

  3. Apocalipse | Vamos Falar Mal

    [...] Simplesmente porque a praga da virtualidade está matando a propaganda. Não adianta falar que é evolução, revolução ou inovação.  Ninguém nunca gostou de propaganda, mas ao mesmo tempo em que era fácil fugir dela, você acabava vendo alguma coisa, e até rindo ou se emocionando com as melhores. Quando você lia uma revista (você ainda lê revistas?), na maioria das vezes era sem pressa, relaxado, e simplesmente virar a página de um anúncio não era difícil. Mudar de canal na televisão na hora do intervaldo também era fácil (tá, às vezes ainda vemos TV). Não olhar para um outdoor era fácil, e em um engarrafamento eles até audavam a passar o tempo. Você se lembrava das melhores por um bom tempo, cantava os jingles, usava os bordões, comprava os produtos. Beleza, você ainda compra os produtos, mas o que tenta te motivar está tão cinza quanto um wireframe. [...]

  4. Felipe M

    topico bom demais!
    vou usar
    att

  5. Wireframes « Dicas para criar sites, programar…

    [...] Sobre Wireframe [...]

  6. Problemas de interpretação do wireframe « Rogério Pereira – Arquiteto de Informação

    [...] de interpretar os wireframes, mas sim tentar trocar experiências nos processos de trabalho do wireframe ao [...]

Deixe um comentário




Feeds

Categorias

+55 81 3076.1576 | wenetus arroba wenetus ponto com

Porto Digital