Wireframe para site e blog

postado em: O que é, Web Série | 0

O wireframe é um guia visual básico da camada de apresentação e propõe a estruturação entre a interface do usuário em relação a páginas do site e/ou blog. O processo de criação dos wireframes é iniciado na etapa de protótipo do layout, antes do design, pois o foco não cores, tipografia e outros elementos visuais.

Como principal utilidade do wireframe, é ser a planta (blueprint) do site e/ou blog e com isso é utilizado como ferramenta para definir estrutura da arquitetura da informação e as páginas de conteúdo, bem como, a navegação e demais funcionalidades do site e/ou blog.

Obtenção de Requisitos

Ao usar wireframes, a equipe que participa do projeto, auxilia o cliente a identificar com maior facilidade o resultado final com apresentação dos requisitos funcionais da camada de apresentação do aplicativo web. 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.

Elementos importantes

Wireframes devem incluir todos os elementos importantes de uma página da web. Estes incluem:

  • navegação
  • logotipo da empresa
  • área seções de conteúdo
  • função de pesquisa
  • registro do usuário em áreas se for o caso

Wireframes funcionais

Este é um outro tipo de wireframe que é usado no desenvolvimento de aplicações web. Apresenta como cada página é estruturada, contendo informações sobre cada elemento, botão, campo da página, cada parte do conteúdo, e o que é processado por uma ação, isto é, quais processos ocorrem ou poderão ocorrer ao clicar em determinado botão.

Conteúdo wireframe

Cada wireframe contém as seguintes informações e uma descrição:

  • Título,  descreve o propósito wireframe, exemplo, “Página inicial do Hotel Cavas”
  • Hierarquia, segue a nomenclatura de  1.0, 1.1, … 1.5 etc, demonstra o nível de herança de uma tela para outra e assunto
  • Como chegar: esta seção descreve como o usuário chega até o target, isto é página destino.
  • Conceito Objetivo, qual é o objetivo ou finalidade é para este página.
  • Conteúdo, descreve todo o conteúdo da página, incluindo qualquer botões ou ícones.
  • Se: Então: indica  um comportamento do usuário e o resultado desse comportamento (por exemplo, o que painel é processado após o ‘Se’ condição é satisfeita).
  • Links de Navegação: descreve todos os links de navegação na página.
  • Condições de erro, muito importante esta seção descreve os erros que podem resultar de um usuário comportamento e que wireframe mensagem que irá receber.

Deixe uma resposta