SlideShare ist ein Scribd-Unternehmen logo
1 von 21
DESENVOLVIMENTO DE SITES
Turma:
Professor:
Aula: Pág: Data:
Anderson
9279
02 12/09/201314-19
@Entendendo a proposta
@Briefing
@Wireframe
@Escolhendo a tecnologia
A empresa Atairu Viagens é uma agência que acaba de
chegar ao mercado. Conta com uma estrutura simples,
pois acaba de inaugurar. Ao pensar o site, o
departamento de comunicação decidiu que as páginas
da internet serviriam como uma grande vitrine para
apresentar a história da empresa, seu endereço,
telefone, áreas de atuação, além de galerias de imagens
e vídeos.
Ao passar a proposta para o diretor da empresa, os
responsáveis pela criação do site argumentaram
bastante com relação à construção das páginas. O
Webdeveloper sugeriu que o site fosse desenvolvido no
Dreamweaver CS5, afinal trata-se da última versão do
aplicativo e responsável por gerar arquivos em HTML
O Web designer, antes de elaborar o layout, solicitou que fosse
levados em consideração o público alvo, linguagem, cores, regra
dos três clicks, entre outros. Estudando com profundidade a
proposta do site, detectaram a necessidade de fazerem um
Briefing. Você sabe do que se trata esse termo?
O Briefing (conjunto de informações) consiste em um
documento que contém todas as informações a respeito
de uma empresa. A seguir vamos relacionar todas as
etapas do planejamento, explicadas de maneiras
simples, a fim de aplicarmos em todos os tipos de
organização.
Todo Briefing parte do pressuposto de resolver algo que
está desajustado, e tem foco em algum objetivo
específico, entre os quais se destacam: comunicação,
fidelização, web, ou inteligência administrativa.
Após definir o objetivo, é levado em consideração o
nome da organização, produtos ou serviços oferecidos,
além dos responsáveis pelos departamento. Neste
momento será observada a estrutura da empresa
(histórico da organização, tipos de materiais ou serviços
oferecidos, solidez da marca, área de atuação,
disposição do produto nas lojas, embalagens, lucros,
vantagens, desvantagens, diferencial com relação à
concorrência e publicidades anteriores).
Conhecer o cliente, antes de tudo é o fator primordial
para o sucesso de qualquer empresa. Todo grande
executivo sabe que o tratamento diferenciado aos seus
consumidores retornará em maior aceitação e
consequentemente em mais lucro. Portanto, nesta parte
do Briefing é importante pensar sobre o público alvo
(gênero, idade, profissão, classe social, escolaridade,
preferências e expectativas).
Outro importante elemento a ser levado em consideração é a
concorrência. Embora o termo pareça pejorativo, é uma prática
decorrente do comércio e diz respeito à oferta de produtos ou
serviços por empresas do mesmo segmento. A competição gerada
pelas organizações acarreta em benefícios aos consumidores, pois
a fim de atingir uma fatia cada vez maior do mercado, utilizam-se
de estratégias, como: preço, qualidade, composição, design,
funcionalidades, entre outros.
De nada adianta uma campanha luxuosa se não for
possível arcar com suas despesas. Logo é necessário
fazer um orçamento bem detalhado de tudo o que será
gasto. Caso uma empresa queira desenvolver um site,
deve levar em consideração o trabalho de quem o
produzirá, mas não deve esquecer os custos de
hospedagem, atualização, e direitos autorais das
imagens.
Definir prazos gera maior eficiência para um projeto,
pois alinha o interesse de todos os envolvidos e limita o
seu tempo de atuação. Quanto mais organizado melhor
o resultado. Por isso, lembre-se de cumprir todas as
etapas dos projetos nos períodos estabelecidos.
Todo projeto inicia a partir de uma ideia. O Wireframe
nada mais é do que colocar no papel tudo o que você
pensou com relação ao projeto do site. Antes de utilizar
um computador, rascunhe e rabisque muito. Fazendo
isso você consegue desenvolver sua criatividade, além
de economizar tempo e recursos quando iniciar a
confecção do site.
Ao elaborar o Wireframe no papel, não é necessário se
preocupar com a aparência do desenho, visto que ele é
um esboço com o objetivo de entender a estrutura e a
disposição do conteúdo do site.
http://iplotz.com/
Com a ideia do design pronta, agora devemos definir
como este site vai ser produzido. O profissional mais
indicado é o Webdeveloper, que vai analisar os recursos
do site e onde ele vai ser hospedado. A partir disso, já é
possível definir a linguagem de programação que será
utilizada.
A linguagem de programação é o ponto menos
questionado pelo cliente, pois dificilmente ele vai
entender do assunto. O cliente apenas questiona o
visual do site, por isso a importância do trabalho em
conjunto. Será que a ideia que o Web designer teve é
compatível com a tecnologia disponível? De que adianta
um site bonito, mas sem funcionalidade?
Por exemplo, se o seu site utiliza a tecnologia PHP, SQL e
procura soluções gratuitas (Ex: servidor de e-mail), o
sistema ideal é o Linux. Caso o seu site seja em ASP ou
.NET e vai utilizar uma base de dados SQL Server ou
Access, o ideal é Windows.
@HTML (Linguagem de Marcação de Hipertexto) É um
editor de páginas para a web. Sua linguagem é
alicerçada por comandos denominados tags,
símbolos, que contém comandos a serem
decodificados pelos navegadores. O criador desta
linguagem foi Tim Berners-Lee, o mesmo
desenvolvedor da WWW.
@ASP (Páginas de servidor ativo) É uma tecnologia que
está relacionada a bancos de dados. Foi desenvolvido
pela Microsoft e é considerada uma linguagem
dinâmica, podendo se utilizar de diversos códigos.
@PHP (Hypertext Preprocessor) É uma linguagem de
programação criada por Rasmus Lerdorf para ser
decodificada pelos navegadores e indicado para
disposição e uso em servidores. Podendo assim como
o ASP, contar com um banco de dados.
@JAVA É uma linguagem que possui um mascote
chamado Duke e foi desenvolvida por Patrick
Naughton e Mike Sheridan. Seus idealizadores não
tinham a intenção de criar uma nova linguagem, mas
queriam antecipar as revoluções que estavam por vir,
incorporando tecnologias aos eletrodomésticos como
controles remotos touchscreen.
Responder na apostila as atividades da página
16, 17 e 19
Desenvolva o seu Wireframe no programa
MSPaint.

Weitere ähnliche Inhalte

Andere mochten auch

Sistemas operacionais cadastro
Sistemas operacionais cadastroSistemas operacionais cadastro
Sistemas operacionais cadastroAnderson Henrique
 
Conhecendo ced@spy
Conhecendo ced@spyConhecendo ced@spy
Conhecendo ced@spyJosue Silva
 
Produção de documentos profissionais 11
Produção de documentos profissionais 11Produção de documentos profissionais 11
Produção de documentos profissionais 11Anderson Henrique
 
Aula de Ambiente Web - 09-10 - Cedaspy
Aula de Ambiente Web - 09-10 - CedaspyAula de Ambiente Web - 09-10 - Cedaspy
Aula de Ambiente Web - 09-10 - CedaspyWillian Profe
 
Aula 2 Sistema operacional - Cedaspy
Aula 2 Sistema operacional - CedaspyAula 2 Sistema operacional - Cedaspy
Aula 2 Sistema operacional - CedaspyRoney Sousa
 
Rede sociais - Aula I - Cedaspy Manaus
Rede sociais -  Aula I - Cedaspy Manaus Rede sociais -  Aula I - Cedaspy Manaus
Rede sociais - Aula I - Cedaspy Manaus Professores Cedaspy
 
Marketing pessoal apresentação
Marketing pessoal   apresentaçãoMarketing pessoal   apresentação
Marketing pessoal apresentaçãoLuis Mazziotti
 

Andere mochten auch (8)

Sistemas operacionais cadastro
Sistemas operacionais cadastroSistemas operacionais cadastro
Sistemas operacionais cadastro
 
Conhecendo ced@spy
Conhecendo ced@spyConhecendo ced@spy
Conhecendo ced@spy
 
Produção de documentos profissionais 11
Produção de documentos profissionais 11Produção de documentos profissionais 11
Produção de documentos profissionais 11
 
Aula de Ambiente Web - 09-10 - Cedaspy
Aula de Ambiente Web - 09-10 - CedaspyAula de Ambiente Web - 09-10 - Cedaspy
Aula de Ambiente Web - 09-10 - Cedaspy
 
Aula 2 Sistema operacional - Cedaspy
Aula 2 Sistema operacional - CedaspyAula 2 Sistema operacional - Cedaspy
Aula 2 Sistema operacional - Cedaspy
 
Cedaspy manaus
Cedaspy manausCedaspy manaus
Cedaspy manaus
 
Rede sociais - Aula I - Cedaspy Manaus
Rede sociais -  Aula I - Cedaspy Manaus Rede sociais -  Aula I - Cedaspy Manaus
Rede sociais - Aula I - Cedaspy Manaus
 
Marketing pessoal apresentação
Marketing pessoal   apresentaçãoMarketing pessoal   apresentação
Marketing pessoal apresentação
 

Ähnlich wie Desenvolvimento de sites - Escolhendo a tecnologia

Projetos Web - Estratégia de projeto
Projetos Web - Estratégia de projetoProjetos Web - Estratégia de projeto
Projetos Web - Estratégia de projetoOdair Cavichioli
 
Arquitetura de Informação em 7 etapas
Arquitetura de Informação em 7 etapasArquitetura de Informação em 7 etapas
Arquitetura de Informação em 7 etapasAndré Silveira
 
Metodologia De Projetos Para Web(1)
Metodologia De Projetos Para Web(1)Metodologia De Projetos Para Web(1)
Metodologia De Projetos Para Web(1)Rafael Teixeira
 
Desenvolvimento de Sites V.2
Desenvolvimento de Sites V.2Desenvolvimento de Sites V.2
Desenvolvimento de Sites V.2Patricia Mallmann
 
Aprenda a ser um webmaster
Aprenda a ser um webmasterAprenda a ser um webmaster
Aprenda a ser um webmasterJeferson Souza
 
Introdução ao web design
Introdução ao web designIntrodução ao web design
Introdução ao web designCarla Suelen
 
Conteúdo - Web Design Aplicado ao Soft Marketing
Conteúdo - Web Design Aplicado ao Soft MarketingConteúdo - Web Design Aplicado ao Soft Marketing
Conteúdo - Web Design Aplicado ao Soft MarketingPonto Final Design
 
Curitiba treinamentos corporativos
Curitiba treinamentos corporativosCuritiba treinamentos corporativos
Curitiba treinamentos corporativosMultimidia e Arte
 
Agência Web - ADDTECH
Agência Web - ADDTECHAgência Web - ADDTECH
Agência Web - ADDTECH.add
 
Webdesign revisãao 2018-02
Webdesign revisãao 2018-02Webdesign revisãao 2018-02
Webdesign revisãao 2018-02Renato Melo
 
Intranet e Rede Social Corporativa - Intranet Expresso
Intranet e Rede Social Corporativa - Intranet ExpressoIntranet e Rede Social Corporativa - Intranet Expresso
Intranet e Rede Social Corporativa - Intranet ExpressoMMCafe-WEB
 

Ähnlich wie Desenvolvimento de sites - Escolhendo a tecnologia (20)

Projetos Web - Estratégia de projeto
Projetos Web - Estratégia de projetoProjetos Web - Estratégia de projeto
Projetos Web - Estratégia de projeto
 
Arquitetura de Informação em 7 etapas
Arquitetura de Informação em 7 etapasArquitetura de Informação em 7 etapas
Arquitetura de Informação em 7 etapas
 
Metodologia De Projetos Para Web(1)
Metodologia De Projetos Para Web(1)Metodologia De Projetos Para Web(1)
Metodologia De Projetos Para Web(1)
 
Responsive wordpress
Responsive wordpressResponsive wordpress
Responsive wordpress
 
O que é Web Designer?
O que é Web Designer?O que é Web Designer?
O que é Web Designer?
 
Desenvolvimento de Sites V.2
Desenvolvimento de Sites V.2Desenvolvimento de Sites V.2
Desenvolvimento de Sites V.2
 
Aprenda a ser um webmaster
Aprenda a ser um webmasterAprenda a ser um webmaster
Aprenda a ser um webmaster
 
Souza naves
Souza navesSouza naves
Souza naves
 
Cv alexandre rezendedecastro
Cv alexandre rezendedecastroCv alexandre rezendedecastro
Cv alexandre rezendedecastro
 
Introdução ao web design
Introdução ao web designIntrodução ao web design
Introdução ao web design
 
Visita Web
Visita WebVisita Web
Visita Web
 
Conteúdo - Web Design Aplicado ao Soft Marketing
Conteúdo - Web Design Aplicado ao Soft MarketingConteúdo - Web Design Aplicado ao Soft Marketing
Conteúdo - Web Design Aplicado ao Soft Marketing
 
DDD
DDDDDD
DDD
 
Ai1617 ac-tp2-g2-a
Ai1617 ac-tp2-g2-aAi1617 ac-tp2-g2-a
Ai1617 ac-tp2-g2-a
 
Curitiba treinamentos corporativos
Curitiba treinamentos corporativosCuritiba treinamentos corporativos
Curitiba treinamentos corporativos
 
Agência Web - ADDTECH
Agência Web - ADDTECHAgência Web - ADDTECH
Agência Web - ADDTECH
 
Producao para web
Producao para webProducao para web
Producao para web
 
Webdesign revisãao 2018-02
Webdesign revisãao 2018-02Webdesign revisãao 2018-02
Webdesign revisãao 2018-02
 
CV Alexandre R. de Castro
CV Alexandre R. de CastroCV Alexandre R. de Castro
CV Alexandre R. de Castro
 
Intranet e Rede Social Corporativa - Intranet Expresso
Intranet e Rede Social Corporativa - Intranet ExpressoIntranet e Rede Social Corporativa - Intranet Expresso
Intranet e Rede Social Corporativa - Intranet Expresso
 

Mehr von Anderson Henrique (20)

Sistemas operacionais aulas 14 e 15
Sistemas operacionais aulas 14 e 15Sistemas operacionais aulas 14 e 15
Sistemas operacionais aulas 14 e 15
 
Sistemas operacionais aula 13
Sistemas operacionais aula 13Sistemas operacionais aula 13
Sistemas operacionais aula 13
 
Sistemas operacionais aula 12
Sistemas operacionais aula 12Sistemas operacionais aula 12
Sistemas operacionais aula 12
 
Sistemas operacionais aula 11
Sistemas operacionais aula 11Sistemas operacionais aula 11
Sistemas operacionais aula 11
 
Sistemas operacionais aula 10
Sistemas operacionais aula 10Sistemas operacionais aula 10
Sistemas operacionais aula 10
 
Sistemas operacionais aula 09
Sistemas operacionais aula 09Sistemas operacionais aula 09
Sistemas operacionais aula 09
 
Sistemas operacionais Aula 08
Sistemas operacionais Aula 08Sistemas operacionais Aula 08
Sistemas operacionais Aula 08
 
Sistemas operacionais 07
Sistemas operacionais 07Sistemas operacionais 07
Sistemas operacionais 07
 
Sistemas operacionais 06
Sistemas operacionais 06Sistemas operacionais 06
Sistemas operacionais 06
 
Sistemas operacionais 05
Sistemas operacionais 05Sistemas operacionais 05
Sistemas operacionais 05
 
Sistemas operacionais 04
Sistemas operacionais 04Sistemas operacionais 04
Sistemas operacionais 04
 
Sistemas operacionais 03
Sistemas operacionais 03Sistemas operacionais 03
Sistemas operacionais 03
 
Sistemas Cadastro
Sistemas CadastroSistemas Cadastro
Sistemas Cadastro
 
Sistemas operacionais 02
Sistemas operacionais 02Sistemas operacionais 02
Sistemas operacionais 02
 
Sistemas operacionais
Sistemas operacionaisSistemas operacionais
Sistemas operacionais
 
Php04
Php04Php04
Php04
 
Php03
Php03Php03
Php03
 
Php02
Php02Php02
Php02
 
Php01
Php01Php01
Php01
 
Ambiente web 15
Ambiente web 15Ambiente web 15
Ambiente web 15
 

Desenvolvimento de sites - Escolhendo a tecnologia

  • 1. DESENVOLVIMENTO DE SITES Turma: Professor: Aula: Pág: Data: Anderson 9279 02 12/09/201314-19 @Entendendo a proposta @Briefing @Wireframe @Escolhendo a tecnologia
  • 2. A empresa Atairu Viagens é uma agência que acaba de chegar ao mercado. Conta com uma estrutura simples, pois acaba de inaugurar. Ao pensar o site, o departamento de comunicação decidiu que as páginas da internet serviriam como uma grande vitrine para apresentar a história da empresa, seu endereço, telefone, áreas de atuação, além de galerias de imagens e vídeos.
  • 3. Ao passar a proposta para o diretor da empresa, os responsáveis pela criação do site argumentaram bastante com relação à construção das páginas. O Webdeveloper sugeriu que o site fosse desenvolvido no Dreamweaver CS5, afinal trata-se da última versão do aplicativo e responsável por gerar arquivos em HTML
  • 4. O Web designer, antes de elaborar o layout, solicitou que fosse levados em consideração o público alvo, linguagem, cores, regra dos três clicks, entre outros. Estudando com profundidade a proposta do site, detectaram a necessidade de fazerem um Briefing. Você sabe do que se trata esse termo?
  • 5. O Briefing (conjunto de informações) consiste em um documento que contém todas as informações a respeito de uma empresa. A seguir vamos relacionar todas as etapas do planejamento, explicadas de maneiras simples, a fim de aplicarmos em todos os tipos de organização.
  • 6. Todo Briefing parte do pressuposto de resolver algo que está desajustado, e tem foco em algum objetivo específico, entre os quais se destacam: comunicação, fidelização, web, ou inteligência administrativa.
  • 7. Após definir o objetivo, é levado em consideração o nome da organização, produtos ou serviços oferecidos, além dos responsáveis pelos departamento. Neste momento será observada a estrutura da empresa (histórico da organização, tipos de materiais ou serviços oferecidos, solidez da marca, área de atuação, disposição do produto nas lojas, embalagens, lucros, vantagens, desvantagens, diferencial com relação à concorrência e publicidades anteriores).
  • 8. Conhecer o cliente, antes de tudo é o fator primordial para o sucesso de qualquer empresa. Todo grande executivo sabe que o tratamento diferenciado aos seus consumidores retornará em maior aceitação e consequentemente em mais lucro. Portanto, nesta parte do Briefing é importante pensar sobre o público alvo (gênero, idade, profissão, classe social, escolaridade, preferências e expectativas).
  • 9. Outro importante elemento a ser levado em consideração é a concorrência. Embora o termo pareça pejorativo, é uma prática decorrente do comércio e diz respeito à oferta de produtos ou serviços por empresas do mesmo segmento. A competição gerada pelas organizações acarreta em benefícios aos consumidores, pois a fim de atingir uma fatia cada vez maior do mercado, utilizam-se de estratégias, como: preço, qualidade, composição, design, funcionalidades, entre outros.
  • 10. De nada adianta uma campanha luxuosa se não for possível arcar com suas despesas. Logo é necessário fazer um orçamento bem detalhado de tudo o que será gasto. Caso uma empresa queira desenvolver um site, deve levar em consideração o trabalho de quem o produzirá, mas não deve esquecer os custos de hospedagem, atualização, e direitos autorais das imagens.
  • 11. Definir prazos gera maior eficiência para um projeto, pois alinha o interesse de todos os envolvidos e limita o seu tempo de atuação. Quanto mais organizado melhor o resultado. Por isso, lembre-se de cumprir todas as etapas dos projetos nos períodos estabelecidos.
  • 12. Todo projeto inicia a partir de uma ideia. O Wireframe nada mais é do que colocar no papel tudo o que você pensou com relação ao projeto do site. Antes de utilizar um computador, rascunhe e rabisque muito. Fazendo isso você consegue desenvolver sua criatividade, além de economizar tempo e recursos quando iniciar a confecção do site.
  • 13. Ao elaborar o Wireframe no papel, não é necessário se preocupar com a aparência do desenho, visto que ele é um esboço com o objetivo de entender a estrutura e a disposição do conteúdo do site. http://iplotz.com/
  • 14. Com a ideia do design pronta, agora devemos definir como este site vai ser produzido. O profissional mais indicado é o Webdeveloper, que vai analisar os recursos do site e onde ele vai ser hospedado. A partir disso, já é possível definir a linguagem de programação que será utilizada.
  • 15. A linguagem de programação é o ponto menos questionado pelo cliente, pois dificilmente ele vai entender do assunto. O cliente apenas questiona o visual do site, por isso a importância do trabalho em conjunto. Será que a ideia que o Web designer teve é compatível com a tecnologia disponível? De que adianta um site bonito, mas sem funcionalidade?
  • 16. Por exemplo, se o seu site utiliza a tecnologia PHP, SQL e procura soluções gratuitas (Ex: servidor de e-mail), o sistema ideal é o Linux. Caso o seu site seja em ASP ou .NET e vai utilizar uma base de dados SQL Server ou Access, o ideal é Windows.
  • 17. @HTML (Linguagem de Marcação de Hipertexto) É um editor de páginas para a web. Sua linguagem é alicerçada por comandos denominados tags, símbolos, que contém comandos a serem decodificados pelos navegadores. O criador desta linguagem foi Tim Berners-Lee, o mesmo desenvolvedor da WWW.
  • 18. @ASP (Páginas de servidor ativo) É uma tecnologia que está relacionada a bancos de dados. Foi desenvolvido pela Microsoft e é considerada uma linguagem dinâmica, podendo se utilizar de diversos códigos.
  • 19. @PHP (Hypertext Preprocessor) É uma linguagem de programação criada por Rasmus Lerdorf para ser decodificada pelos navegadores e indicado para disposição e uso em servidores. Podendo assim como o ASP, contar com um banco de dados.
  • 20. @JAVA É uma linguagem que possui um mascote chamado Duke e foi desenvolvida por Patrick Naughton e Mike Sheridan. Seus idealizadores não tinham a intenção de criar uma nova linguagem, mas queriam antecipar as revoluções que estavam por vir, incorporando tecnologias aos eletrodomésticos como controles remotos touchscreen.
  • 21. Responder na apostila as atividades da página 16, 17 e 19 Desenvolva o seu Wireframe no programa MSPaint.