Os primeiros passos do projeto do web site
Quando você compra ou receber brinquedos rotulados como “montagem necessária”, você sabe que está em um para tratar cérebro-torção. A fase de concepção de um site é a sua chance de escrever o manual de instruções para a equipe antes que alguém começa a empurrar pixels ao redor.
Conteúdo
- Criando um mapa do site para um site
- Desenvolvimento wireframes em web design
- Teste de usuário do site
- Montar um plano de conteúdo do site
- Video: apresentação - primeiros passos - contruindo um sistema web no gvinci (parte 1/3)
- Video: construção de website ou loja - o passo-a-passo na criação de um projeto - metropoleweb
- Estabelecer “look and feel” em web design
- Obtendo a entrada de um grupo de foco
Criando um mapa do site para um site
Tal como acontece com a criação de projetos para um novo edifício de escritórios, uma tarefa primordial na fase de projeto para qualquer site, grande ou pequeno, é criar um Mapa do Site, um diagrama que mostra todas as páginas de um site e como eles se interconectam. Sem um mapa do site, você está indo para a frustração. Por um lado, a equipe não terá qualquer direção unificada. Em segundo lugar, sem um plano, você não pode possivelmente antecipar todo o conteúdo, páginas e recursos que precisam para entrar no site.
Desenvolvimento wireframes em web design
Enquanto o mapa do site mostra o site a partir de uma visão panorâmica, não dar-lhe os detalhes que você precisa para projetar e construir cada página. Para isso, você precisa de uma série de wireframes.
Durante a fase de projeto, o arquiteto de informação recolhe contribuições de todos os membros da equipe e constrói um layout diagrama, chamado de wireframe, para cada grande página do site. Como um mapa do site, um wireframe é um diagrama, mas em vez de exibir uma visão zoom-out de todas as páginas do site juntos, um wireframe mostra uma vista detalhada de uma única página da web. Uma estrutura de arame mostra os seguintes elementos:
navegação global esquema (de navegação que aparece em cada página do seu site)
Mídia e de texto pedaços e sua importância em relação ao outro
design de interação (como as pessoas usam os elementos na página, que está documentado com textos explicativos para rotular suas partes)
teste de usuário do site
Testando wireframes com os usuários é um processo iterativo que você começa na fase de projeto e continuar bem para a fase de desenvolvimento. (Euterativa significa fazê-lo uma e outra vez, incorporando o que cada um tente lhe diz. Em termos de testes, isso é algo que você melhor se acostumar com logo de cara.) Teste no início da fase de projeto ajuda você a permanecer na pista, porque você pode rapidamente fazer pequenos ajustes antes de ir demasiado longe no caminho da produção.
Montar um plano de conteúdo do site
De mãos dadas com o desenvolvimento wireframe é descobrir um plano de conteúdo. Afinal, como você pode sugerir que o conteúdo como uma área de notícias em uma página sem saber onde a notícia virá, quão extenso será, e quantas vezes o cliente será capaz de atualizá-lo?
Video: Apresentação - Primeiros passos - Contruindo um sistema web no GVinci (Parte 1/3)
Se o site estará usando um sistema de gerenciamento de conteúdo, ou CMS (Um sistema de banco de dados que abriga todo o seu texto e alimenta-lo para suas páginas), o estrategista de conteúdo define uma lista de todos os tipos de componentes de texto que vão em cada página e estabelece nomes e regras para cada um. Por exemplo, um “título do item” pode ter um certo limite de caracteres e deve usar tampões iniciais.
Por último, durante a fase de projeto, a equipe de conteúdo pensa sobre o tom de escrita que seria mais adequado para o site, dada personalidade da marca da empresa e os objetivos de negócio estabelecidos durante a fase de definição.
Video: Construção de website ou Loja - O Passo-a-Passo na criação de um Projeto - MetropoleWeb
Estabelecer “look and feel” em web design
Após finalizar o mapa do site com o cliente e desenvolver os wireframes para o ponto onde o conteúdo e elementos interativos contidos em cada página são mais ou menos decidida, os designers visuais podem explorar diferentes direções de design para o site. Designers usam os wireframes como o esqueleto subjacente para entender o que de conteúdo e design de interação que eles precisam para dar conta. Eles não simplesmente “cor” no wireframes- eles usá-los como um guia para entender a importância relativa dos itens enquanto eles estão criando seus layouts.
A prática geral é criar um tratamento de design para a página inicial e uma subpage (Qualquer coisa mas a home page). Isso força os designers para descobrir um projeto que pode amarrar o site inteiro juntos e são responsáveis por esquema de navegação do site.
Obtendo a entrada de um grupo de foco
Na maioria das vezes o cliente escolhe o sentido do projeto final, após uma ou duas rodadas de noodling ou “frankensteining” (patching elementos de diferentes desenhos juntos). Para sites de alto perfil, no entanto, é uma boa idéia para obter a entrada de um grupo de foco para ver qual projeto ressoa mais claramente com eles antes de apresentar o projeto para o cliente. Dessa forma, você tem munição cliente feedback quando você apresenta, e pode ajudar a orientar o cliente de forma mais objetiva na direção certa.