thumb|Um documento wireframe para um perfil de uma pessoa. Em webdesign, um wireframe de website (do inglês website's wireframe), ou protótipo de baixa fidelidade, é um esboço inicial simples da aparência de um site web; um guia visual do esqueleto do site; um protótipo usado em design de interface para sugerir a estrutura de um sítio web e relacionamentos entre suas páginas; uma ilustração semelhante do layout de elementos fundamentais na interface. Normalmente, wireframes são concluídos antes que qualquer trabalho artístico seja desenvolvido, tendo como principal objetivo a navegação e disposição do conteúdo, assim como demonstrar as preferências de um cliente quanto aos requisitos funcionais de um sistema.

Wireframe então é um desenho básico de uma interface. Este desenho, no entanto, deve retratar toda a arquitetura de informação do sistema desejada pelo cliente, assim como também um veículo para propostas de funções, elementos gráficos, estrutura e conteúdo. Deve-se observar também que o wireframe retrata a usabilidade do sistema. No entanto, este desenho deve ser muito simples e resumido, informando ao desenvolvedor apenas o que for estritamente necessário de forma simples.

Pode ser usado apenas como base para os desenvolvedores, mas o mesmo também pode ser entregue para o usuário. Esta entrega gera o primeiro contato entre o ambiente digital e o usuário final.

Usos Wireframes permitem o desenvolvimento de variações de um layout para manter a consistência do design através do site. Esta é uma parte importante do estágio de desenvolvimento inicial pois ela cria expectativas ao usuário e ajuda a desenvolver familiaridade com o site.

A criação de um conjunto de wireframes para um projeto também serve como um meio de comunicação com os clientes e os stakeholders como os geradores de conteúdo, engenheiros e desenvolvedores. No decorrer de um projeto a utilização de wireframes funciona como uma base estável para se considerar mudanças, diversos caminhos de usuário e novos requerimentos. O arquiteto de informação e designer de informação normalmente usam os wireframes como uma reunião dos pensamentos e como documentos de trabalho sólidos nos quais estabelecem a linguagem, o conteúdo e a estrutura de interações que os usuários terão com um determinado projeto ou site.

Wireframes podem variar de simples desenhos estruturais do sítio a uma simulação de navegação de alta fidelidade, que possui movimentos, enlaces funcionais e interações complexas. Para simples desenhos, a prototipagem em papel é a técnica mais comumente utilizada, mas ela tem sido melhorada com a utilização de software para projetos mais complexos. Os programas mais utilizados para criação de wireframes de baixa fidelidade são o Visio, Mockingbird, Balsamiq, iPlotz, Pidoco, InDesign, Illustrator, Photoshop, Adobe Fireworks e OmniGraffle. Para alta fidelidade, ferramentas de prototipagem/wireframing incluem Axure, ProtoShare, Justinmind e Irise. Para propósitos de design de interface de usuário colaborativa, ferramentas de wireframing online como Pidoco ou Protoshare, que oferecem funcionalidade de gerenciamento de projeto ou colaboração, são comuns.

Ver também Design gráfico Web design Design de interface de usuário Arquitetura de informação Design de interação

Ligações externas

Categoria:Web design