Introdução Ao Web Design

Loading...

Flash Player 9 (or above) is needed to view presentations.
We have detected that you do not have it on your computer. To install it, go here.

0 comments

Post a comment

    Post a comment
    Embed Video
    Edit your comment Cancel

    1 Favorite

    Introdução Ao Web Design - Presentation Transcript

    1. Web Design I # 2007-2008 ISMT - Sandra Oliveira
    2. Introdução ao Web Design
      • # Definição
        • O Web Design é uma extensão da prática do design,
        • o foco do projecto é
        • criação de Web sites e documentos disponíveis no ambiente Web
      ISMT - Sandra Oliveira
    3. Introdução ao Web Design
      • # Definições
      • O Wd tende à multidisciplinaridade,
        • a construção de páginas web apoia-se em diversas áreas técnicas, além do design propriamente dito.
      ISMT - Sandra Oliveira Áreas como a programação , inovação nos recursos dos navegadores que em conjunto com o design gráfico , estão em constante evolução.
    4. Introdução ao Web Design
      • # Definição / Wikipédia
      • “ A preocupação fundamental em web design é agregar os conceitos de usabilidade com o planeamento da interface, garantindo que o utilizador final atinja os seus objectivos de forma intuitiva. ”
      • http://pt.wikipedia.org/wiki/Web_design
      ISMT - Sandra Oliveira
    5. Introdução ao Web Design
      • O propósito do Web Design é facilitar a comunicação entre utilizador e conteúdo .
      • Desenhar para a Web significa desenhar para as pessoas que usam a Web e não como achamos que usam
      ISMT - Sandra Oliveira
    6. Introdução ao Web Design
      • As pessoas chegam aos sites de variadas formas:
        • Percorrem as páginas à procura de pistas em vez de as lerem
        • Tiram conclusões rápidas, em vez de avaliaram cuidadosamente.
        • Nem sempre olham para o “quadro geral”
        • Movem-se pelos seus objectivos e não os do cliente.
      ISMT - Sandra Oliveira
    7. Introdução ao Web Design
      • Os Web Designers necessitem de capacidades para serem bem sucedidos neste ambiente.
        • Deve conhecer perfeitamente os objectivos do site para os poder alcançar
        • Deve ser claro o objectivo que o design vai ter, e manter esse propósito
        • Deve ser simplista, isto é, se um elemento adiciona complexidade mas não valor, então deve ser mudado
      ISMT - Sandra Oliveira
    8. Web Design I # 2007-2008 ISMT - Sandra Oliveira
    9. As fases do desenvolvimento ISMT - Sandra Oliveira
    10. As fases do desenvolvimento #1
      • Variam consoante o tipos de site:
        • educação,
        • experiências,
        • entretenimento,
        • actividades comerciais e informação,
        • combinações híbridas dos mesmos,
        • etc.
      ISMT - Sandra Oliveira
    11. As fases do desenvolvimento #1
      • [a estratégia ]
      • Relacionar-se com
        • os objectivos do site,
        • as necessidades e gostos da hipotética audiência,
        • as forças e fraquezas da empresa concorrente
        • as capacidades da própria empresa
      ISMT - Sandra Oliveira
    12. As fases do desenvolvimento #1
      • // Como definir uma estratégia?
      • 1 - Definir a mensagem a passar.
        • Exemplo : para uma empresa de venda de Frutas Exóticas, a mensagem pode residir na ideia: Comer fruta exótica é saudável, excitante e divertido
      ISMT - Sandra Oliveira
    13. As fases do desenvolvimento #1
      • 2 - Decidir como persuadir a audiência em aceitar essa mensagem.
        • Exemplo , decidir em “educar” os utilizadores nas inúmeras possibilidades de cada fruta exótica, e criar, assim, um ambiente (uma forma de estar) que os utilizadores querem participar. No fundo, tornar a compra mais fácil.
      ISMT - Sandra Oliveira
    14. As fases do desenvolvimento #1
      • 3 - Escolher um tom.
        • Sério e formal ou divertido e informal? Visionário ou conservador? Dramático ou prático?
      • 4 - Identificar o nível de informação e detalhe oferecido no site.
      ISMT - Sandra Oliveira
    15. As fases do desenvolvimento #1
      • [o planeamento]
      • Envolve a resposta a algumas perguntas práticas:
        • Qual o público-alvo do site?
        • O que é preciso comunicar?
        • Qual o objectivo ou necessidade do cliente?
      ISMT - Sandra Oliveira
    16. As fases do desenvolvimento #1
        • 4. Quais os sites favoritos do cliente?
        • 5. Qual o esboço do site?
        • 6. Há algum material impresso no qual se pode basear?
        • 7. Que outros sites são similares à intenção e ideia do cliente?
      ISMT - Sandra Oliveira
    17. As fases do desenvolvimento #1
      • Qual o público-alvo do site?
      • Utilizadores
      • Para que os objectivos sejam alcançados, é importante compreender para quem estão orientados e subsequente forma de estruturar o conteúdo
      ISMT - Sandra Oliveira
    18. As fases do desenvolvimento #1
      • Encontrar consenso entre as aptidões dos utilizadores é vital para o sucesso do projecto,
        • é isso importante compreender o que disponibilizar e para quem.
      ISMT - Sandra Oliveira
    19. As fases do desenvolvimento #1
      • Escolher um segmento populacional permitirá focar esforços e atrair esses utilizadores.
      • A - Determinar quem estará interessado no conteúdo a disponibilizar.
        • Exemplo: Venda de Frutos Exóticos online
          • Público-Alvo : Chefes de Restaurantes, Imigrantes, directores de grandes superfícies, cozinheiros experimentais e vegetarianos.
      ISMT - Sandra Oliveira Como?
    20. As fases do desenvolvimento #1
      • B - Determinar qual a capacidade para poder “servir” o público-alvo.
      • Exemplo : O fornecedor da empresa de Fruta exótica é uma pequena quinta com produção limitada,
        • Pensar em excluir como público-alvo compradores de grandes superfícies e grandes restaurantes .
      ISMT - Sandra Oliveira
    21. As fases do desenvolvimento #1
      • C- Determinar, dos restantes grupos definidos como público-alvo, quem tem acesso à Internet.
      ISMT - Sandra Oliveira
    22. As fases do desenvolvimento #1
      • … ainda no planeamento
      • 2 O que é preciso comunicar?
      • 3 Qual o objectivo ou necessidade do cliente?
      • Objectivos de comunicação
        • Entender a posição do cliente perante a concorrência e o mercado ,
        • Delinear o que se pretende com a sua presença na Web.
      ISMT - Sandra Oliveira
    23. As fases do desenvolvimento #1
      • Objectivos_ definição
      • A definição pode ser formal ou informal, consoante a dimensão do projecto.
        • Formal - é necessário convocar reuniões com todas as pessoas envolvidas – formando assim uma equipa de concepção
        • Informal - falar com elas individualmente, tendo o cuidado, contudo de anotar as suas ideias.
      ISMT - Sandra Oliveira
    24. As fases do desenvolvimento #1
      • # Exemplos
      • Site da Levi´s Site da Amazon
      ISMT - Sandra Oliveira
        • intenção disseminar o nome do seu produto.
        • define um tom, um ambiente, um ponto de vista, da mesma forma que um anúncio publicitário (spot) faz na televisão.
        • objectivo principal é vender livros.
        • Não apresentam nenhuma estética ou tentam impressionar
    25. As fases do desenvolvimento #1
      • # Exemplo empresa Fruta Exótica
      • Objectivo : Atrair novos clientes e a possibilidade de compra online
      ISMT - Sandra Oliveira O Objectivo pode ser modificado aquando do estudo do número de utilizadores, no entanto, a definição inicial de um objectivo define de imediato o público-alvo, a estratégia e os conteúdos do site .
    26. As fases do desenvolvimento #1
      • Objectivos_
      • # Qual o seu propósito?
      • Para que servirá esta presença na Internet? Para divulgar a empresa? Para vender produtos ou serviços? Qual o propósito da empresa?
      • # Quais os objectivos principais?
      • Fidelizar o cliente? Assisti-lo nos seus problemas? Expandir o mercada da empresa? Centralizar os seus recursos? Angariar novos clientes?
      ISMT - Sandra Oliveira
    27. As fases do desenvolvimento #1
      • # Qual o público-alvo?
      • 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 pretendem alcançar?
      • # Que informação disponibilizar?
      • Produtos e serviços comercializados? Informação técnica sobre os produtos? Recursos de assistência ao cliente? Divulgação empresarial?
      ISMT - Sandra Oliveira
    28. As fases do desenvolvimento #1
      • 4 Quais os sites favoritos do cliente?
      • - Apresentação de uma lista dos sites favoritos.
      • - Saber quais as razões da escolha
      ISMT - Sandra Oliveira informações a respeito de como estruturar o trabalho de modo que ele atenda às expectativas e o gosto do cliente.
    29. As fases do desenvolvimento #1
      • 5 Qual o esboço do site?
      • Queremos instruir, criar interacção, distribuir informação, adquirir informação ou suportar o comércio online?
      • Esta etapa é similar a definir os objectivos do site,
        • mas tem a ver com os serviços oferecidos do que com o próprio design visual.
      ISMT - Sandra Oliveira
    30. As fases do desenvolvimento #1
      • 6 Presença de impressão
      • se há uma presença impressa, é importante utilizar as ideias para o design do site.
      • Se já existe um logótipo, uma brochura, etc com a qual trabalhar, isto pode ajudar a escolher tipografias e estratégia de cores .
      ISMT - Sandra Oliveira
    31. As fases do desenvolvimento #1
      • 7 Outros Sites
      • é importante fazer uma pesquisa a outros sites antes de começar.
      • Exemplo : criar um catálogo daquilo que gosta e daquilo que não gosta.
        • A maioria dos designers mantém um arquivo de “inspiração” ao qual recorrem quando estão com algum bloqueio ou à procura de ideias
      ISMT - Sandra Oliveira
    32. ISMT - Sandra Oliveira
    33. ISMT - Sandra Oliveira
    34. As fases do desenvolvimento #3 ISMT - Sandra Oliveira
    35. As fases do desenvolvimento #3
      • Especificar qual a forma de produzir:
        • A escrita manual de código HTML, por intermédio de editores de texto ou editores especializados de código HTML.
        • Ou através de ferramentas de autoria para a Web que fornecem interfaces gráficas de fácil utilização que exigem muito menos conhecimentos sobre a linguagem HTML, tais como o Dreamweaver da Macromedia (Adobe) ou FrontPage (Microsoft).
      ISMT - Sandra Oliveira
    36. As fases do desenvolvimento #4 ISMT - Sandra Oliveira
    37. As fases do desenvolvimento #4
      • Multiplicidade de browsers existentes actualmente (Internet Explorer, Netscape, FireFox, etc).
        • Necessário testar o acesso ao site a partir de várias configurações do cliente.
      ISMT - Sandra Oliveira
    38. As fases do desenvolvimento #4
      • Verificar se os requisitos em termos de desempenho são cumpridos.
        • envolve verificar se o sistema suporta o número de utilizadores planeado e se o tempo de resposta é aceitável
      ISMT - Sandra Oliveira
    39. As fases do desenvolvimento #5 ISMT - Sandra Oliveira
    40. As fases do desenvolvimento #5
      • Os servidores permitem registar o número de vezes que a página foi acedida e quais as hiperligações que foram seguidas a partir do site.
        • Esta informação pode igualmente ser utilizada para redefinir os conteúdos e adequá-los ao público-alvo.
      ISMT - Sandra Oliveira
    41. As fases do desenvolvimento #5
      • Questionários
      • Grupo de discussão;
      • Quais as actividades ou informações que gostariam de encontrar no site
      • Classificações de determinadas funções (0 a 5)
      • Como encontrou o site
      ISMT - Sandra Oliveira Como?
    42. As fases do desenvolvimento #5
      • Entrevistas
      • Descrição detalhada por parte dos participantes da razão pela qual visitam o site.
      • Quais as vantagens e desvantagens dos sites concorrentes
      ISMT - Sandra Oliveira

    + sandrafonsosandrafonso, 2 years ago

    custom

    1513 views, 1 favs, 0 embeds more stats

    Introdução ao Web Design e as fases do desenvolvi more

    More info about this document

    © All Rights Reserved

    Go to text version

    • Total Views 1513
      • 1513 on SlideShare
      • 0 from embeds
    • Comments 0
    • Favorites 1
    • Downloads 0
    Most viewed embeds

    more

    All embeds

    less

    Flagged as inappropriate Flag as inappropriate
    Flag as inappropriate

    Select your reason for flagging this presentation as inappropriate. If needed, use the feedback form to let us know more details.

    Cancel
    File a copyright complaint
    Having problems? Go to our helpdesk?

    Categories