Introdução ao web design

897 visualizações

Publicada em

0 comentários
1 gostou
Estatísticas
Notas
  • Seja o primeiro a comentar

Sem downloads
Visualizações
Visualizações totais
897
No SlideShare
0
A partir de incorporações
0
Número de incorporações
1
Ações
Compartilhamentos
0
Downloads
46
Comentários
0
Gostaram
1
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

Introdução ao web design

  1. 1. Introdução ao Web Design Prof. Anderson Maia E-mail:tecnologo.maia@gmail.com
  2. 2. Introdução ao Web Design <ul><li>Alguns profissionais, empresas, cursos, matérias de revistas e conversas de botequim associam o design à produção de imagens ou manipulação de um software específico. </li></ul>Obs:A definição do que é design vai muito além do Photoshop.
  3. 3. Introdução ao Web Design <ul><li>Definição: </li></ul><ul><li>O web design é uma extensão da prática do design, </li></ul><ul><li>O foco do projeto é </li></ul>Criação de um projeto visual e funcional(Web Site) e documentos disponíveis no ambiente WEB.
  4. 4. Introdução ao Web Design <ul><li>O Web Design tende à Multidisciplinaridade. </li></ul>Areas como programação, inovação nos recursos dos navegadores que em conjunto com o design gráfico, estão em constante evolução.
  5. 5. Introdução ao Web Design <ul><li>Definição 2 </li></ul><ul><li>A função do design, além da estética, é tornar um produto funcional. É transformar informação em comunicação. </li></ul>Ao contrário do que muitos pensam, a função do design não está vinculada pura e simplesmente à produção de imagens .
  6. 6. Introdução ao Web Design <ul><li>O propósito do Web Design é facilitar a comunicação entre utilizador e conteúdo. </li></ul><ul><li>Desenhar para Web significa desenhar para as pessoas que usam a web e não como achamos que usam. </li></ul>
  7. 7. Introdução ao Web Design <ul><li>Os Web Designs necessitam de capacidades para serem bem sucedidos neste ambiente. </li></ul><ul><li>Deve conhecer perfeitamente os objetivos do site para os poder alcançar. </li></ul><ul><li>Deve ser claro e objectivo que o design vai ter, e manter esse propósito. </li></ul><ul><li>Deve ser simplista, isto é, se um elemento adiciona complexidade mas não valor, então deve ser mudado. </li></ul>
  8. 8. Introdução ao Web Design <ul><li>Mas por onde começar o Projeto </li></ul>É um conjunto de informações .
  9. 9. Introdução ao Web Design <ul><li>O briefing deve buscar um roteiro de ação para criar a solução que o cliente procura, é como mapear o problema, e com estas pistas, ter idéias para criar soluções. </li></ul>
  10. 10. Introdução ao Web Design <ul><li>Exercício para evidenciar a importância de um brief. </li></ul><ul><li>Obs:Equipes de 4 alunos. Só podemos utilizar os matérias encontrados na lixeira da cantina e da sala de aula. </li></ul><ul><li>1ª fase: Cada grupo irá pensar em um abajur feito com a sucata e escrever em um papel como seria a montagem desse abajur (apenas escrever, sem montá–lo). </li></ul><ul><li>2º fase: Na próxima fase trocaremos os projetos. Um grupo diferente irá montar o abajur, sem que quem escreveu o projeto dê qualquer palpite ou ajuda. </li></ul>
  11. 11. Introdução ao Web Design <ul><li>Agora que já estudarmos o briefing devemos ter conhecimentos também sobre como trabalhar a pregnância da forma . </li></ul>
  12. 12. Introdução ao Web Design
  13. 13. Desenvolvimento Projeto Web <ul><li>Planejamento e Estratégia </li></ul><ul><li>Desenvolver uma estratégia que se ajuste às necessidades do desenvolvimento do projeto para Web. </li></ul><ul><li>Coletar e organizar as informações para o projeto . </li></ul>
  14. 14. Desenvolvimento Projeto Web <ul><li>Fatores Primordiais: </li></ul><ul><li>Objetivo do Projeto </li></ul><ul><li>Produto </li></ul><ul><li>Público </li></ul><ul><li>Identidade Visual </li></ul><ul><li>Motivações </li></ul><ul><li>Comunicação </li></ul><ul><li>Etc..... </li></ul>
  15. 15. Desenvolvimento Projeto Web <ul><li>Envolve respostas a algumas perguntas práticas. </li></ul><ul><li>Qual é o público do site? </li></ul><ul><li>O que é preciso comunicar? </li></ul><ul><li>Qual a necessidade ou objetivo do cliente que queremos conquistar? </li></ul><ul><li>Qual o esboço do site? </li></ul><ul><li>Que outros sites são similares ao gosto do cliente? </li></ul>
  16. 16. Desenvolvimento Projeto Web <ul><li>Fases do Desenvolvimento </li></ul><ul><li>Estratégia: </li></ul><ul><li>Os objetivos do site </li></ul><ul><li>As necessidades e gostos da hipotética audiência. </li></ul><ul><li>As formas e fraquezas da empresa concorrente </li></ul><ul><li>As capacidades da própria empresa </li></ul>
  17. 17. Desenvolvimento Projeto Web <ul><li>Como definir uma estratégia? </li></ul>
  18. 18. Desenvolvimento Projeto Web <ul><li>Definir a mensagem a ser transmitida. </li></ul><ul><li>Exemplo: </li></ul>
  19. 19. Desenvolvimento Projeto Web <ul><li>2. Decidir como persuadir a audiência em aceitar essa mensagem. </li></ul><ul><li>Exemplo: decidir em “educar” os utilizadores na inúmeras possibilidades de cada celular, e criar, assim, um ambiente( uma forma de estar) que os utilizadores querem participar. No fundo, tornar a venda mais fácil. </li></ul>
  20. 20. Desenvolvimento Projeto Web <ul><li>3. Escolher um tom </li></ul><ul><li>Serio e formal ou divertido e informal? Visionário ou conservador? Dramático ou prático. </li></ul><ul><li>4 . Identificar o nível de informação e detalhe oferecido no site. </li></ul>
  21. 21. Desenvolvimento Projeto Web <ul><li>Objetivos </li></ul><ul><li>A definição pode ser formal ou informal, mediante a dimensão do projeto. </li></ul><ul><li>Formal – é necessário convocar reuniões com todas as pessoas envolvidas – formando assim uma equipe de concepção. </li></ul><ul><li>Informal – falar com elas individualmente, tendo cuidado, contudo de anotar suas ideias. </li></ul>
  22. 22. Desenvolvimento Projeto Web <ul><li>Exemplo da Empresa Nokia </li></ul><ul><li>Objetivo: Atrair novos Clientes e a possibilidade de compra online. </li></ul>O objetivo pode ser modificado de acordo com o número de utilizadores, no entanto, a definição inicial de um objetivo define de imediato o público alvo, a estratégia e conteúdo dos sites.
  23. 23. Desenvolvimento Projeto Web <ul><li>Objetivos </li></ul><ul><li>1. Qual o seu propósito? </li></ul><ul><li>2. Qual o público-alvo? </li></ul><ul><li>3. Qual o seu objetivo principal? </li></ul><ul><li>4. Que informações disponibilizar? </li></ul><ul><li>5. Quais os sites favoritos do cliente? </li></ul><ul><li>6. Qual o esboço do site? </li></ul>
  24. 24. Desenvolvimento Projeto Web <ul><li>Exercicio: Enumere os textos abaixo de acordo com a pergunta dos objetivos do slide anterior. </li></ul>Para que servirá esta presença na Internet? Para divulgar a empresa? Para vender Produtos ou serviços? Qual o Propósito da empresa? Fidelizar o cliente? Assisti-los no seu problema? Expandir o mercado da empresa? Centralizar os seus recursos? Angariar novos Clientes
  25. 25. Desenvolvimento Projeto Web Informação a respeito de como estruturar o trabalho de modo que ele atenda a expectativa o gosto do cliente . Quais os clientes da empresa? Que idade têm? São pessoas instruídas? Quais são as condições econômicas? São pessoas que dominam as novas tecnologias? Que futuros clientes se pretende alcançar.
  26. 26. Desenvolvimento Projeto Web Produtos e serviços comercializados? Informação técnica sobre os produtos? Recursos de assistência ao cliente? Divulgação empresarial ? Esta etapa é similar a definir os objetivos do site.
  27. 27. Produção Web Site <ul><li>Implementam-se os conceitos e o design através da construção de páginas web utilizando um tipo de linguagem disponível. </li></ul><ul><li>Selecionar tecnologias que melhor se adequam aos objetivos definidos, que se adequam aos recursos disponíveis e capacidade dos utilizadores. </li></ul>
  28. 28. Produção Web Site <ul><li>Especificar qual a forme de produzir: </li></ul><ul><li>A escrita manual do código HTML, por intermédio dos de editores de texto ou editores especializados de código HTML. </li></ul><ul><li>U através de ferramentas para Web que fornecem interfaces gráficas de fácil utilização que exigem muito menos conhecimento sobre linguagem HTML, tais como Dreamweaver da Macromedia(Adobe) ou frontPage(Microsoft). </li></ul>
  29. 29. Produção Web Site <ul><li>Teste e Validação </li></ul><ul><li>Um site envolve a utilização </li></ul><ul><li>De várias aplicações de software, </li></ul><ul><li>Portanto é necessário testar a integração dessas aplicações de modo a assegurar que todos os componentes de software e hardware funcionem em conjunto como se espera. </li></ul>
  30. 30. <ul><li>OBRIGADO PELA ATENÇÃO! </li></ul>
  31. 31. Bibliografia <ul><li>BEAIRD, Jaison. Princípios do Web Design Maravilhoso . São Paulo: Alta Books, 2008. </li></ul><ul><li>ANDERSON, Chris. A cauda longa . Rio de Janeiro: Elsevier, 2006. </li></ul>

×