SlideShare une entreprise Scribd logo
1  sur  59
FACULDADE MARISTA DO RECIFE
         Altamir da Silva, André Alves, Marcos Spinelli




EDAV - ESQUADRÃO DE DEMONSTRAÇÃO AÉREA
                VIRTUAL
                  “REDESIGN DO SITE”




                Ambiente Web – Dino Lincoln
              Aplicações Gráficas - Dino Lincoln
  Desenvolvimento de Projetos e Aplicações Web – André Melo
        Interface Homen-Máquina – Angélica Martins
             Planejamento Visual – Carlos Moura




                         Recife, 2009
Sumário



Introdução ..........................................................................................................               3

Justificativa .........................................................................................................             4

Objetivos ............................................................................................................              5

Relatório do planejamento .....................................................................................                     6

     Cronograma anterior (Pré-projeto) ................................................................................. 6

      Cronograma EDAV ...................................................................................................... 7

Relatório do Briefing ............................................................................................. 9

Tópicos da Arquitetura .........................................................................................10

       Fluxo de Navegação do Site ....................................................................................... 10

       Fluxo de Navegação do Gerenciamento ....................................................................... 11

Sitemap .............................................................................................................12

Descrição conceitual e justificativa da proposta gráfica .............................................13

Sistema (Product Backlog) ....................................................................................14

       Dead Line................................................................................................................ 14

       Stories.................................................................................................................... 14

       Sprints.................................................................................................................... 14

       Envolvidos............................................................................................................... 14

       Descrição do Projeto ................................................................................................. 14

       Sprint Backlog ......................................................................................................... 15

       Backlog Review (Restrospection) ................................................................................ 36

Justificativa Para: ................................................................................................37

       Cor......................................................................................................................... 37

       Tipografia................................................................................................................ 38

       Imagens ................................................................................................................. 39

       Diagramação ........................................................................................................... 39

       Ícones .................................................................................................................... 39

       Semiótica e Comunicação .......................................................................................... 40

       Conceitos de Usabilidade e Acessibilidade .................................................................... 42

       Modelos Mentais ....................................................................................................... 43

Ferramentas e Tecnologias ...................................................................................44

       Ferramentas Utilizadas.............................................................................................. 45

Testes de Usabilidade ..........................................................................................46

Bibliografia .........................................................................................................47

Anexos ..............................................................................................................48

       I.
Análise de Similares............................................................................................... 48

       II. Estudo Cromático................................................................................................. 58

       II.
Registro de Reuniões ............................................................................................ 59

       III.
Questionários de Usabilidade ................................................................................ 63





                                                               ii
Introdução

   O EDAV (Esquadrão de Demonstração Aérea Virtual) surgiu em 1998 com o intuito de
simular as operações realizadas pelo EDA (Esquadrão de Demonstração Aérea) no
ambiente virtual Flight Simulator. A proposta deste projeto consistiu na elaboração do
redesign do site, tornando-o um ambiente mais agradável e funcional, buscando assim,
suprir as necessidades atuais dos usuários que o frequentam.

   Além de incluir novas funcionalidades, o site ganhou uma maior dinamicidade,
podendo ser facilmente gerenciável e alimentado pelos seus gestores.

   Utilizou-se novas tecnologias para que apresente um melhor desempenho dentro das
expectativas que se tem sobre ele, bem como, sua reestruturação visual para criar uma
maior identidade com o esquadrão.

   Assim, buscamos tornar o site mais completo, organizado e de fácil utilização, tanto
para os usuários quanto para os gestores, trazendo também uma melhoria significativa
no impacto que as pessoas possam vir a ter ao visitá-lo.




                                          3
Justificativa

    Ao longo dos mais de dez anos de existência do EDAV, as necessidades de seus
membros e visitantes sofreram diversas mudanças impulsionadas pelo desenvolvimento
tecnológico, que modificaram a forma de interação com os sites, adicionando opção de
visualização de vídeos em streaming, gerenciamento de conteúdo, proporcionando mais
flexibilidade, usabilidade e desempenho.

   Sendo assim, foi necessário ser feita uma reestruturação tecnológica para suprir as
deficiências encontradas no antigo site, que na época de sua criação original era inviável.
Fazendo assim, uma atualização tecnológica mais que necessária.

   O site foi desenvolvido com base nas propostas do cliente, bem como nas sugestões
do grupo de desenvolvimento, levando a um consenso e harmonia, onde foram propostas
modificações acordadas.

    Foi necessário deixar o site com uma identidade visual mais agradável, para que o
visitante identifique instantaneamente do que se trata o EDAV, e possa melhor se
informar sobre o mesmo, uma vez que o site antigo não oferecia quase nenhuma
funcionalidade, apenas um link para o fórum.

   Este projeto foi desenvolvido de acordo com a necessidade do cumprimento de nota
parcial das disciplinas de ambiente Web, aplicações gráficas, desenvolvimento de
projetos e aplicações Web, interface homem-máquina e planejamento visual. Servindo
assim como processo de aprendizagem e aperfeiçoamento de técnicas, pondo em prática
os conceitos aprendidos em sala de aula, contribuindo para o crescimento profissional e
acadêmico dos membros participantes, uma vez que, o contato com clientes reais é uma
experiência muito enriquecedora.




                                           4
Objetivos

Geral:

  • Reestruturar o site de forma a melhor atender as necessidades dos
administradores e dos visitantes.

Específicos:

   •   Atualizar o fórum para uma versão mais recente.
   •   Instalar um sistema de galeria.
   •   Criar uma relação de identidade maior do site com o EDAV.
   •   Implementar um sistema gerenciável.
   •   Inserir conteúdos requisitados no briefing, não existentes no site antigo.
   •   Criar uma navegação mais intuitiva de acordo com modelos mentais partilhados.




                                         5
Relatório do planejamento

Cronograma anterior (Pré-projeto)
   No cronograma do pré-projeto, foram feitas previsões dos prazos, a serem
cumpridos, expostos no cronograma apresentado abaixo:




    Como alguns dos prazos não condisseram com o real cronograma, não foram
modificadas as mensurações de tempo, pois a metodologia de trabalho adotada foi a
Iterativa, onde as atividades não têm tempos tão definidos e podem sofrer variações de
acordo com a necessidade e demanda. Portanto, a tabela abaixo traz modificações no
que se diz respeito às atividades realizadas e por quem. Uma vez que, algumas das
atividades não foram realizadas por não terem sido mais necessárias.




                                         6
Cronograma EDAV




OBS1 : A criação do Flash foi prejudicada devido ao fato do cliente não ter entregue em
tempo hábil os vídeos para que fosse realizada a sua criação.

Documentação: Foi feita durante todo o processo de desenvolvimento do projeto,
principalmente após a utilização da metodologia SCRUM, onde é necessário que se
registre todas as reuniões e sejam agendadas as tarefas, onde são gerados relatórios de
cada etapa.

Arquitetura: Foi realizada durante o início do projeto, a construção do fluxograma,
sitemap e wireframe, dando base para a fundamentação do layout.

Layout: A parte gráfica do site foi elaborada em sua maior parte no início, mas durante
os sprints foram sendo modificadas, sendo adicionados novos elementos, ícones e novos
temas, assim como o estudo cromático para servir de base para sua construção.




                                          7
CMS: O uso de CMS limitou-se ao fórum e galeria do site, provendo duas ferramentas já
consolidadas no mercado, que oferecem todas as características necessárias para suprir
as necessidades dos visitantes do EDAV.

Implementação: Momento em que foi feita toda a parte de finalização e programação
do site, dando vida ao Layout. Durou a maior parte de todo o processo devido à alta
complexidade dos objetivos a serem atingidos. Foi feita toda uma área de gerenciamento
para uma maior conveniência e praticidade dos admistradores a gerenciar o site, uma
migração do modelo de fórum antigo para uma mais nova, e a instalação de um CMS
para a galeria. Alem disso, foi feito um sistema de busca interno da página, e
arquivamento de notícias em um menu sanfona para um fácil acesso as mesmas.

Testes: Foram realizados testes com alunos de Web e alunos de outros cursos da
faculdade Marista, com intuito de identificar erros e colher sugestões para melhorias no
site.




                                           8
Relatório do Briefing

    O EDAV (Esquadrão de Demonstração Aérea Virtual) é um grupo de simulação virtual,
criado em 1998, com o objetivo de simular o EDA (Esquadrilha da Fumaça).

   O site apresenta como objetivo principal a divulgação do esquadrão, por meio de
notícias, vídeos e fotos de eventos relacionados tanto ao esquadrão quanto à assuntos
pertinentes à aviação. Contém também um fórum que serve como espaço para os
usuários trocarem idéias sobre o EDAV, simuladores de voo e aviação em geral. Fórum
esse que também serve como meio de comunicação dos membros do EDAV, por meio de
uma área restrita.

   Tem o seu público alvo dividido em dois grupos: pessoas que usam simuladores de
voo e os internautas em geral que gostam de aviação e querem saber um pouco mais
sobre o assunto.

    As cores do EDAV são as mesmas da pintura da fuselagem do avião (cores da
bandeira do Brasil). No site não há a necessidade de se prender a essas cores, ficando
livre o uso das demais cores. Todavia é recomendado seu uso, nem que seja em
detalhes, para remeter ao esquadrão.

    O EDAV possuía um site, apesar de estar atualmente usando apenas o fórum. Dentre
o conteúdo que o site apresentava anteriormente está: EDAV (o que é), Fumaceiros
(pilotos), Parceiros, Sala de Imprensa, Fotos, Vídeos, Downloads e Recrutamento além
do fórum. Tendo as seções de fotos e vídeos como as mais importantes e procuradas.
Sendo assim, o cliente deseja uma grande chamada para qualquer atualização dessas
seções, além de pequenas notas das últimas notícias.

    Quanto ao conteúdo, este será todo fornecido pelo cliente, tanto o escrito, quanto as
fotos e vídeos, ficando a nosso encargo apenas a inserção do conteúdo nas páginas.
    Os vídeos serão disponibilizados por meio de sites especializados em hospedagem de
arquivos como o Rapidshare e 4Shared enquanto para as fotos pode ser criada uma
galeria no próprio site sem problemas.

    As tecnologias a serem utilizadas no site ficaram a critério da equipe, porém, como
requisitado a utilização de um CMS pela cadeira de DPAW, será essa a tecnologia
utilizada na criação do site.

   Há alguns sites similares que o cliente nos passou:
   - Blue Angels (http://www.virtualblueangels.net);
   - Thunder Birds (http://www.virtualthunderbirds.com);
   - Blue Comets (http://bluecomets.winnerbb.com).

   Porém houve o alerta de não usar os sites referidos como modelo de inspiração para
a construção do novo site.

   O entrevistado nesse briefing foi o professor Dino Lincoln (dino@dino.eti.br).




                                           9
Tópicos da Arquitetura

Fluxo de Navegação do Site




Legenda dos    Números
 1- Home       5- EDAV         9- Recrutamento   13-   Notícias Internas
 2- Galeria    6- Fumaceiros   10- Downloads     14-   Profile
 3- Fórum      7- Parceiros    11- Vídeos        15-   Resultado
 4- Notícias   8- Imprensa     12- Busca         16-   Mostra os links das notícias
                                                 que correspondem aos critérios de
                                                 busca

Legenda de Símbolos
      Página

      Múltiplas páginas

      Mostra conteúdo de acordo com um parâmetro

      Fluxo duplo

      Retorno impedido

      Fluxo Único




                                       10
Fluxo de Navegação do Gerenciamento




Legenda dos Números
 1- Home       4- Depoimentos   7- Imprensa       10- Modificar senha
 2- Destaques  5- Fumaceiros    8- Vídeos         11- Usuários
 3- Notícias   6- Home (Site)   9- Recrutamento

Legenda de Símbolos
     Página




                                  11
Sitemap




          12
Descrição conceitual e justificativa da proposta
   gráfica

    A principal idéia do projeto é trazer um redesign do site deixando-o o mais próximo
possível das características do que realmente seria o EDAV, uma simulação ambiente
virtual. Dentro desses parâmetros, inserir o conteúdo de forma organizada, facilitando
assim a associação dos elementos internos, seja imagens ou textos.

   Com base nos estudos feitos em sala de aula, alguns aspectos foram levando em
consideração, como as cores, dentro do padrão criado num estudo cromático (ver anexo
II).

   A questão tipográfica visou a legibilidade, com um bom conforto visual proporcionado
pelo tipo de fonte, contraste e opção de aumentar e diminuir o tamanho, para facilitar
uma boa leitura, tornando-a menos cansativa.

    As imagens utilizadas foram selecionadas para que a harmonia entre as cores fossem
presentes, como também não desviasse do foco, o EDAV.




                                          13
Sistema (Product Backlog)

Dead Line
Retrospection: 07 de Junho de 2009
Entrega da documentação do projeto: 08 de Junho de 2009
Apresentação do projeto: 10 de junho de 2009

Stories
   •   Re-design do site da EDAV
          - Arquitetura da informação
          - Documentação
          - Criação do wireframe
          - Criação do layout
          - Finalização em XHTML e CSS
          - Implementação em PHP
          - Integração com o banco de dados
          - Criação do sistema de gerenciamento do site
          - Atualização do fórum
          - Implementação da galeria
          - Construção dos flash’s
          - Realização de testes

Sprints
    O uso da metodologia de desenvolvimento SCRUM só foi adotada dia 11 de maio, sendo
o planejamento e a arquitetura da informação e parte do wireframe, layout e finalização das
páginas tendo sido feitas antes do primeiro sprint.

   Foram utilizados quatro sprints com duração de uma semana cada, sendo em cada
semana utilizados 6 dias de trabalho.

Envolvidos
   Product Owner: Dino Lincoln

   Scrum Master: Marcos (Sprint 02)
                 André (Sprint 03)
                 Altamir (Sprint 04)

   Scrum Team: Altamir (Designer)
               André (Implementador)
               Marcos (Finalizador)

Descrição do Projeto
   Este projeto tem como objetivo propor melhorias ao site atual da EDAV, através do re-
design da página e uma re-estruturação do conteúdo, trazendo novas funcionalidades e
praticidade ao usuário que acessá-lo.

   Utilizar-se-á novas tecnologias para obter um melhor desempenho e suprir necessidades
atuais, tais como exibição de vídeos em streaming e galeria dinâmica, coisas que a pouco
tempo atrás era inviável. Fazendo assim, uma atualização tecnológica mais que necessária.

    Também, pretende-se deixar o site com uma identidade visual mais agradável, para que
o visitante identifique que se trata do esquadrão virtual EDAV, e possa melhor se informar

                                           14
sobre o mesmo, uma vez que o site atual não oferece quase nenhuma funcionalidade,
apenas um link para o fórum.

Sprint Backlog

Sprint 01

 Nome                     Disponibilidade
                          Horas Semanais          Seg   Ter   Qua       Qui   Sex   Sab
 Altamir da Silva         20 Horas (4 h/d)        x     x     x         x           x
 André Alves              36 Horas (6 h/d)        x     x     x         x     x     x
 Marcos Spinelli          36 Horas (6 h/d)        x     x     x         x     x     x

Stories

» André:
   - Documentação
   - Finalização em XHTML e CSS
   - Implementação em PHP
   - Banco de dados MySQL
   - Sistema de gerenciamento do site
   - Atualização do fórum
   - Implementação da galeria

» Marcos:
   - Documentação
   - Finalização em XHTML e CSS
   - Sistema de gerenciamento do site
   - Atualização do fórum
   - Implementação da galeria

» Altamir:
   - Documentação
   - Desenvolvimento wireframe
   - Desenvolvimento do Layout
   - Tratamento das imagens


Tasks

» André:
   - Migração HTML para PHP (1 hora)
   - Sistema de Depoimentos (3 horas)
   - Sistema de Login (6 horas)
   - Sistema de Notícias (6 horas)
   - Sistema de Recrutamento (2 horas)
   - Sistema de Usuários (3 horas)
   - Instalação e Configuração do Fórum (3 horas)
   - Instalação e Configuração da Galeria (3 horas)
   - Product Backlog (2 horas)
   - Sprint Review (1 horas)
   - Elaboração do Documento de Acompanhamento (1 hora)

» Marcos:
   - Elaboração    do   Product Backlog (2 horas)
   - Elaboração    do   Documento de Acompanhamento (1 hora)
   - Finalização   de   envio de Notícias [Gerenciamento] (2 horas)
   - Finalização   do   Envio de Depoimentos [Gerenciamento] (1 hora)


                                             15
-   Finalização da página de Noticias (3 horas)
   -   Ajustes Padding e Margin (1 hora)
   -   Finalização da página de Recrutamento (4 horas)
   -   Criação de jQuery (3 horas)
   -   Re-Fazer o CSS de Parceiros (2 horas)
   -   Edição da página de Imprensa (1 hora)
   -   Ajustes CSS do formulário (2 horas)
   -   Finalização da página de Downloads (2 horas)
   -   Edição da página de gerenciamento (2 horas)
   -   Finalização da página de fumaceiros (4 horas)
   -   Ajustes dos ícones de Parceiros (2 horas)
   -   Criação das Setas do H1 (1 hora)
   -   Criação do Layout do Gerenciamento (3 horas)

» Altamir:
   - Criação do wireframe (6 horas)
   - Estudo cromático (3 horas)
   - Criar e/ou editar imagens (1 hora)
   - Tratar imagens do EDAV (2 horas)
   - Adequar cores do fórum ao EDAV (1 hora)
   - Editar layout do fórum tendo em vista as cores (3 horas)
   - Gerenciamento (todos)
   - Elaboração do Documento de Acompanhamento (todos)
   - Utilização do Gerenciador Online de Projetos Zoho (todos)

Stand Up

 Altamir
      Ontem                       Hoje                      Amanhã
 Seg                              - Ajuste Wireframe        - Ajuste Wireframe
                                      - home                    - downloads
                                      - edav                    - imprensa
                                      - fumaceiros              - notícias

 Ter     - Ajuste Wireframe       - Tratamento de           - Ajustes do EDAV
             - downloads          imagens                   layout
             - imprensa           - Ajustes do EDAV             - notícias
             - notícias           layout                        - imprensa
                                      - home                    - downloads
                                      - edav
 Qua     - Ajustes do EDAV        - Alterações internas     - Ajustes do EDAV
         layout                                             layout
                                                              - internas
 Qui     - Ajustes do EDAV        - Adequar cores para
         layout                   fórum
             - notícias           - escolha das cores
             - imprensa
             - downloads
 Sex
 Sab                              - cores do layout fórum

 André
      Ontem                       Hoje                      Amanhã
 Seg                              - Product Backlog         - Stand Up
                                  - Sprint Backlog          - Instalação e
                                  - Stand Up                configuração do fórum
                                  - Migrar área             (x)
                                  administrativa de HTML    - Instalação e
                                  para PHP                  configuração da

                                           16
- Programação do          galeria (x)
                                sistema de                - Elaboração do
                                Depoimentos               Documento de
                                                          Acompanhamento
Ter   - Product Backlog         - Stand Up                - Stand Up
      - Sprint Backlog          - Finalização da página   - Programação do
      - Stand Up                de Recrutamento           sistema de Usuário
      - Migrar área             (Gerenciamento)           - Programação do
      administrativa de HTML    - Programação do          sistema de Login (x)
      para PHP                  sistema de
      - Programação do          Recrutamento
      sistema de                - Elaboração do
      Depoimentos               Documento de
                                Acompanhamento
Qua   - Stand Up                - Stand Up                - Stand Up
      - Finalização da página   - Finalização da página   - Re-estruturação do
      de Recrutamento           de Usuário                sistema
      (Gerenciamento)           (Gerenciamento)
      - Programação do          - Programação do
      sistema de                sistema de Usuário
      Recrutamento              - Criação do JQuery
                                para exibir e ocultar
                                conteúdo
                                - Edição gerenciador de
                                depoimentos
                                (Gerenciamento)
Qui   - Stand Up                - Stand Up                - Stand Up
      - Finalização da página   - Re-estruturação do      - Programação do
      de Usuário                sistema                   sistema de Mudança
      (Gerenciamento)           - Implementação do        de Senha
      - Programação do          depoimento na Home
      sistema de Usuário
      - Criação do JQuery
      para exibir e ocultar
      conteúdo
      - Edição gerenciador de
      depoimentos
      (Gerenciamento)
Sex   - Stand Up                - Stand Up                - Stand Up
      - Re-estruturação do      - Finalização da página
      sistema                   de Mudança de Senha
      - Implementação do        (Gerenciamento)
      depoimento na Home        - Programação do
                                sistema de Mudança de
                                Senha (*)
Sab   - Stand Up                - Stand Up                - Stand Up
      - Finalização da página   - Instalação do plugin    - Sprint Backlog
      de Mudança de Senha       do JQuery para manter     - Programação do
      (Gerenciamento)           altura das colunas        sistema de Login
      - Programação do          iguais (Gerenciamento)    - Testes no sistema de
      sistema de Mudança de     - Sprint Review           Mudança de Senha
      Senha

Marcos
     Ontem                      Hoje                      Amanhã
Seg                             - Product Backlog         - Stand Up
                                - Sprint Backlog          - Finalização da página
                                - Stand Up                de Recrutamento
                                - Ajustes Home            - Ajustes Notícias

                                        17
- Finalização de Envio    - Ajustes de Padding e
                                de Notícias               Margin
                                (Gerenciamento)           - Elaboração do
                                - Finalização do Envio    Documento de
                                de Depoimentos            Acompanhamento
                                (Gerenciamento)
                                - Finalização da pagina
                                de Noticias

Ter   - Stand Up                - Stand Up                - Stand Up
      - Ajustes Home            - Finalização da página   - Finalização da página
      - Finalização de Envio    de Recrutamento           de Recrutamento
      de Notícias               - Ajustes Notícias        (Gerenciamento)
      (Gerenciamento)           - Ajustes de Padding e    - Criação do jQuery da
      - Finalização do Envio    Margin                    box
      de Depoimentos            - Elaboração do           - ajustes jQuery
      (Gerenciamento)           Documento de              - Re-Fazer o CSS de
      - Finalização da pagina   Acompanhamento            parceiros
      de Noticias                                         - Ajuste dos icones dos
                                                          Parceiros

Qua   - Stand Up                - Stand Up                - Stand Up
      - Finalização da página   - Finalização da página   - Edição da página de
      de Recrutamento           de Recrutamento           Imprensa
      - Ajustes Notícias        (Gerenciamento)           - Ajustes CSS dos
      - Ajustes de Padding e    - Criação do jQuery da    formulários
      Margin                    box                       - Edição gerenciador
      - Elaboração do           - ajustes jQuery          de depoimentos
      Documento de              - Re-Fazer o CSS de       - Finalização da página
      Acompanhamento            parceiros                 de Downloads
                                - Ajuste dos icones dos   - Elaboração do
                                Parceiros                 Product Backlog

Qui   - Stand Up                - Stand Up                - Stand Up
      - Finalização da página   - Edição da página de     - Finalização da página
      de Recrutamento           Imprensa                  de Usuário
      (Gerenciamento)           - Ajustes CSS dos         (Gerenciamento)
      - Criação do jQuery da    formulários               - Edição da página de
      box                       - Edição gerenciador de   gerenciamento
      - ajustes jQuery          depoimentos               Notícias
      - Re-Fazer o CSS de       - Finalização da página   - Finalização da página
      parceiros                 de Downloads              de Fumaceiros
      - Ajuste dos icones dos   - Elaboração do Product
      Parceiros                 Backlog

Sex   - Stand Up                - Stand Up                - Stand Up
      - Edição da página de     - Finalização da página   - Finalização da página
      Imprensa                  de Usuário                de Fumaceiros
      - Ajustes CSS dos         (Gerenciamento)           - Finalização da página
      formulários               - Edição da página de     de Downloads
      - Edição gerenciador de   gerenciamento Notícias    - Ajustes CSS do
      depoimentos               - Finalização da página   formulário de
      - Finalização da página   de Fumaceiros             Recrutamento
      de Downloads
      - Elaboração do Product
      Backlog

Sab   - Stand Up                - Stand Up                - Stand Up
      - Finalização da página   - Finalização da página   - Sprint Backlog


                                        18
de Usuário                de Fumaceiros             - Ajustes Login de
       (Gerenciamento)           - Finalização da página   Gerenciamento
       - Edição da página de     de Downloads              - Ajustes na página de
       gerenciamento Notícias    - Ajustes CSS do          Recrutamento.
       - Finalização da página   formulário de             - Finalização da página
       de Fumaceiros             Recrutamento              de Downloads
                                 - Sprint Review

Sprint Review

» Altamir:

    A princípio a dificuldade em encontrar um modelo de CMS que adequasse as nossas
necessidades levou a um atraso na elaboração do projeto de certa forma, mas foi
contornado a tempo. Com isso o layout não pode ser repassado com maior tempo, haja
vista a espera em encontrar o melhor CMS. Mesmo neste intervalo existiram idéias e aos
poucos foram tomando forma de acordo com as colocações do “Product Owner”. Enfim,
foi criado o Wireframe e desenvolvido mesmo assim, e sendo alterado a cada novo
encontro.

    A partir daí, o layout também começou a ser encaminhado a sua formatação,
estrutura e cores, com base no que foi respondido no questionário criado para obter
informações sobre o projeto, na arquitetura da informação.

    O layout foi sendo criado e repassado aos poucos para a implementação e
consequentemente a programação. Neste intervalo existiram tratamentos de imagens,
além de criações e edições das mesmas. Adaptação das cores no site do EDAV e também
a escolha para o fórum, com re-criações de imagens com outro aspecto sendo voltado as
cores do EDAV. Todos os trabalhos existentes que envolvem na confecção do layout.
Salientando que no decorrer do projeto foi utilizada uma metodologia na tentativa de
deixar claro cada passo do projeto, bem como delimitar tarefas aos membros e integrar o
grupo, chamada SCRUM.

» André:

   Nesse sprint foram realizadas as seguintes tarefas: Product e Sprint Backlogs,
Finalização da página de Mudança de Senha (Gerenciamento), Finalização da página de
Recrutamento (Gerenciamento), Finalização da página de Usuário (Gerenciamento),
Edição gerenciador de depoimentos (Gerenciamento), Criação do JQuery para exibir e
ocultar conteúdo (Gerenciamento), Instalação do plugin do JQuery para manter altura
das colunas iguais (Gerenciamento), Migrar área administrativa de HTML para PHP,
Programação do sistema de Recrutamento, Programação do sistema de Usuário,
Programação do sistema de Depoimentos, Implementação do depoimento na Home, Re-
estruturação do sistema.

   A re-estruturação do sistema consistiu na separação dos códigos referentes às ações
(adição, edição e eliminação) dos scripts presentes na área de gerenciamento do site.
Visando um melhor desempenho e uma maior facilidade na criação e edição dos códigos.
As ações, antes presentes no próprio arquivo de exibição do formulário, foram divididas
em diferentes arquivos. Trazendo assim os benefícios supracitados.

   Algumas tarefas encontram-se de forma incompleta como: Programação do sistema
de Mudança de Senha (sem testes realizados pela falta do sistema de login),
Programação do sistema de Login (parte de login encontra-se incompleta, sem testes
realizados).

  E algumas tarefas planejadas para esse sprint foram adiadas: Programação e
Implementação do sistema de Notícias (página do sistema encontra-se incompleta),



                                          19
Instalação e configuração do fórum e da galeria (problemas no servidor de hospedagem
impediram a realização das tarefas).

    O atraso em algumas das tarefas deve-se principalmente ao fato da falta de páginas
já completas para serem realizadas a finalização e programação dos sistemas, tendo
assim que demandar certo tempo para a criação e finalização das mesmas, e assim
seguir com o trabalho previsto no Sprint Backlog.

» Marcos:

   Foram realizadas as seguintes tarefas neste primeiro Sprint:
      - Ajustes na Home
      - Finalização de Envio de Notícias (Gerenciamento)
      - Finalização do Envio de Depoimentos (Gerenciamento)
      - Finalização da pagina de Noticias
      - Finalização da página de Recrutamento
      - Ajustes Notícias
      - Ajustes de Padding e Margin
      - Elaboração do Documento de Acompanhamento
      - Finalização da página de Recrutamento (Gerenciamento)
      - Criação do jQuery da box
      - Ajustes jQuery
      - Re-Fazer o CSS de parceiros
      - Ajuste dos icones dos Parceiros
      - Edição da página de Imprensa
      - Ajustes CSS dos formulários
      - Edição gerenciador de depoimentos
      - Finalização da página de Downloads
      - Elaboração do Product Backlog
      - Finalização da página de Usuário (Gerenciamento)
      - Edição da página de gerenciamento Notícias
      - Finalização da página de Fumaceiros
      - Finalização da página de Downloads
      - Ajustes CSS do formulário de Recrutamento

   Algumas atividades não foram registradas no Sprint, pois a metodologia SCRUM
passou a ser utilizada com o projeto já em andamento, quando o código de marcação
HTML, e a base do CSS já estava pronta, assim como algumas páginas já
implementadas. Como o Layout estava atrasado, optei por adiantar o máximo possível
para não ficar ocioso, porém, mesmo assim foi necessário o re-trabalho em algumas
páginas por mudanças do que se havia planejado inicialmente. Alguns ajustes no código
também foram necessários para que houvesse uma melhor integração com o PHP, alem
da correção de bugs aparentes, detectados mesmo sem ter sido feito testes para este
fim.
   Algumas páginas já finalizadas poderão sofrer futuros ajustes em Sprints posteriores
devido a novas idéias ou necessidades para integração com o PHP, e serão feitas
conforme necessário, mesmo que não sejam previstas inicialmente.

SPRINT 02

 Nome                 Disponibilidade
                      Horas Semanais           Seg   Ter    Qua    Qui    Sex     Sab
 Altamir da Silva     20 Horas (4 h/d)         x     x      x      x              x
 André Alves          36 Horas (6 h/d)         x     x      x      x      x       x
 Marcos Spinelli      36 Horas (6 h/d)         x     x      x      x      x       x




                                          20
Stories

» André:
   - Documentação
   - Finalização em XHTML e CSS
   - Implementação em PHP
   - Banco de dados MySQL
   - Sistema de gerenciamento do site

» Marcos:
   - Documentação
   - Finalização em XHTML e CSS
   - Sistema de gerenciamento do site

» Altamir:
   - Alteração de layout
   - Estudo prévio do layout (galeria)
   - Edição de cores

Tasks

» André:
   - Sistema de Fumaceiros (6 horas)
   - Sistema de Login (4 horas)
   - Sistema de Notícias (2 horas)
   - Sistema de Busca (6 horas)
   - Implementação das Notícias na Home (1 hora)
   - Implementação da página de Notícias (2 horas)
   - Implementação da página de Fumaceiros (2 horas)
   - Implementação de Feedbacks (Gerenciamento) (2 horas)
   - Validação do Formulário (6 horas)
   - Teste do sistema de Mudança de Senha (1 hora)
   - Sprint Review (1 hora)
   - Documentação do projeto (2 horas)

» Marcos:
   - Elaboração do Product Backlog (2 horas)
   - Ajustes Login de Gerenciamento (2 horas)
   - Ajustes na página de Recrutamento (1 hora)
   - Ajustes Padding Fumaceiros (1 hora)
   - Finalização da página de Downloads (2 horas)
   - Finalização da Página de Gerenciamento de Destaques (3 horas)
   - CSS do fórum (2 horas)
   - Finalização da página de Vídeos (3 horas)
   - Correção de Bugs Gerais (4 horas)
   - jQuery Lightbox (2 horas)
   - Ajustes sessão de arquivo das páginas: Notícias, Imprensa e Vídeos (3 horas)
   - Ajustes Formulário de Recrutamento (2 horas)
   - Tentativa de por focus no Checkbox via Js no Firefox (2 horas)
   - Finalização da página de resultados de busca (3 horas)
   - Criação do Tema da Tarde (2 horas)
   - Criação do Tema da Noite (2 horas)

» Altamir:
   - Ajustes no Layout do site EDAV (7 horas)
   - Busca do fórum adequado ao site EDAV (2 hora)
   - Busca da galeria adequada ao site EDAV (1 hora)
   - Instalação dos programas para edição do Fórum (30 min)
   - Instalação dos programas para edição do Fórum (30 min)


                                         21
- Edição das cores do Layout (fórum) (6 horas)
  - Edição das cores do Layout (galeria) (2 horas)

Stand Up

Altamir
     Ontem                       Hoje                       Amanhã
Seg                              - Ajuste Layout EDAV       - Ajuste Layout EDAV
                                   - alinhamentos             - alinhamento
                                     - home                     - downloads
                                     - imprensa                 - edav
                                     - notícias                 - fumaceiros

Ter   - Ajustes pags. internas   - Ajustes pags. internas   - Busca do fórum
                                                            - Busca da galeria
                                                            - instalação dos prog.

Qua   - Busca do fórum           - imprevisto               - Busca da galeria
                                                            - instalação dos prog.
Qui   - Busca da galeria         - Estudo das cores
      - instalação dos prog.     (fórum)
                                 - Inserir cores
Sex
Sab                              - Novas cores para
                                 estudo (fórum)
                                 - Estudo das cores
                                 (galeria)
                                 - Inserir cores

André
        Ontem                    Hoje                       Amanhã
Seg     - Stand Up               - Stand Up                 - Stand Up
        - Instalação do plugin   - Sprint Backlog           - Re-estruturação do
        do JQuery para manter    - Programação do           sistema
        altura das colunas       sistema de Login           - Finalização da página
        iguais (Gerenciamento)   - Testes no sistema de     de edição de Usuário
        - Sprint Review          Mudança de Senha           (Gerenciamento)
                                                            - Finalização da página
                                                            de edição de Notícias
                                                            (Gerenciamento)
                                                            - Finalização da página
                                                            de edição de
                                                            Depoimentos
                                                            (Gerenciamento)

Ter     - Stand Up               - Stand Up                 - Stand Up
        - Sprint Backlog         - Re-estruturação do       - Instalação do JQuery
        - Programação do         sistema                    wysiwyg no sistema
        sistema de Login         - Finalização da página    de Notícias
        - Testes no sistema de   de edição de Usuário       - Implementação de
        Mudança de Senha         (Gerenciamento)            Feedbacks
        - Adaptar páginas ao     - Finalização da página    (Gerenciamento)
        Login                    de edição de Notícias
        - Customização do        (Gerenciamento)
        template do Fórum        - Finalização da página
                                 de edição de
                                 Depoimentos
                                 (Gerenciamento)


                                          22
Qua   - Stand Up                - Stand Up                - Stand Up
      - Re-estruturação do      - Instalação do JQuery    - Finalização da página
      sistema                   wysiwyg no sistema de     de Fumaceiros
      - Finalização da página   Notícias                  (Gerenciamento)
      de edição de Usuário      - Implementação de        - Programação do
      (Gerenciamento)           Feedbacks                 sistema de Fumaceiros
      - Finalização da página   (Gerenciamento)           - Implementação das
      de edição de Notícias     - Customização do         Notícias na Home
      (Gerenciamento)           template do Fórum         - Implementação da
      - Finalização da página                             página de Notícias
      de edição de
      Depoimentos
      (Gerenciamento)

Qui   - Stand Up                - Stand Up                - Stand Up
      - Instalação do JQuery    - Finalização da página   - Implementação da
      wysiwyg no sistema de     de Fumaceiros             página de Fumaceiros
      Notícias                  (Gerenciamento)           - Implementação da
      - Implementação de        - Programação do          página de Notícias
      Feedbacks                 sistema de Fumaceiros
      (Gerenciamento)           - Implementação das
      - Customização do         Notícias na Home
      template do Fórum         - Implementação da
                                página de Notícias

Sex   - Stand Up                - Stand Up                - Stand Up
      - Correção de Bugs        - Finalização da página   - Implementação da
      gerais                    de Fumaceiros             página de Fumaceiros
                                (Gerenciamento)           - Implementação da
                                - Programação do          página de Notícias
                                sistema de Fumaceiros
                                - Implementação das
                                Notícias na Home
                                - Implementação da
                                página de Notícias

Sab   - Stand Up                - Stand Up                - Stand Up
      - Finalização da página   - Implementação da        - Sprint Review
      de Fumaceiros             página de Fumaceiros      - Documentação do
      (Gerenciamento)           - Implementação da        Projeto
      - Programação do          página de Notícias        - Validação do lado
      sistema de Fumaceiros     - Otimização do CSS       cliente
      - Implementação das       (Gerenciamento)           - Validação do lado
      Notícias na Home                                    servidor
      - Implementação da
      página de Notícias

Dom   - Stand Up                - Stand Up                - Stand Up
      - Implementação da        - Sprint Review           - Sprint Backlog
      página de Fumaceiros      - Documentação do         - Documentação do
      - Implementação da        Projeto                   Projeto
      página de Notícias        - Validação do lado       - Sistema de busca
      - Otimização do CSS       cliente                   - Continuação da
      (Gerenciamento)           - Validação do lado       validação do lado
                                servidor                  cliente
                                                          - Continuação da
                                                          validação do lado
                                                          servidor



                                        23
Marcos
     Ontem                       Hoje                       Amanhã
Seg - Stand Up                   - Stand Up                 - Stand Up
     - Finalização da página     - Sprint Backlog           - Ajustes Padding
     de Fumaceiros               - Ajustes Login de         Fumaceiros
     - Finalização da página     Gerenciamento              - Finalização da Página
     de Downloads                - Ajustes na página de     de Downloads
     - Ajustes CSS do            Recrutamento
     formulário de
     Recrutamento

Ter   - Stand Up                 - Stand Up                 - Stand Up
      - Sprint Backlog           - Ajustes Padding          - CSS do Fórum
      - Ajustes Login de         Fumaceiros                 - Finalização da Página
      Gerenciamento              - Finalização da Página    de Vídeos
      - Ajustes na página de     de Downloads               - Implementação da
      Recrutamento                                          Página de
                                                            Gerenciamento de
                                                            Destaques

Qua   - Stand Up                 - Stand Up                 - Stand Up
      - Ajustes Padding          - CSS do Fórum             - jQuery Lightbox
      Fumaceiros                 - Finalização da Página    - Ajustes na sessão de
      - Finalização da Página    de Vídeos                  Arquivo das páginas
      de Downloads               - Implementação da         de Notícias, Imprensa
                                 Página de                  e Videos
                                 Gerenciamento de
                                 Destaques (x)

Qui   - Stand Up                 - Stand Up                 - Stand Up
      - CSS do Fórum             - jQuery Lightbox          - Ajustes do
      - Finalização da Página    - Ajustes na sessão de     Formulário de
      de Vídeos                  Arquivo das páginas de     Recrutamento
      - Implementação da         Notícias, Imprensa e       - Tentativa de por
      Página de                  Videos                     focus no Checkbox via
      Gerenciamento de                                      js no Firefox
      Destaques (x)                                         - Finalização da Página
                                                            de Resultado de Busca

Sex   - Stand Up                 - Stand Up                 - Stand Up
      - jQuery Lightbox          - Ajustes do Formulário    - Criação de Tema da
      - Ajustes na sessão de     de Recrutamento            Tarde
      Arquivo das páginas de     - Tentativa de por focus   - Criação de Tema da
      Notícias, Imprensa e       no Checkbox via js no      Noite
      Videos                     Firefox (x)
                                 - Finalização da Página
                                 de Resultado de Busca

Sab   - Stand Up                 - Stand Up                 - Stand Up
      - Ajustes do Formulário    - Criação de Tema da       - Sprint Backlog
      de Recrutamento            Tarde                      - Criação de Tema da
      - Tentativa de por focus   - Criação de Tema da       Noite
      no Checkbox via js no      Noite (x)                  - Implementação da
      Firefox (x)                - Sprint Review            Página de
      - Finalização da Página                               Gerenciamento de
      de Resultado de Busca                                 Destaques




                                         24
Sprint Review

» Altamir:

   O sprint 2 foram feitas de início ajustes no qual faltavam ter no site, com relação ao
layout (PSD) onde consumiu o bom tempo. Foi feita buscas de um fórum, bem como de
uma galeria que estivesse adequada as necessidades e aparência no qual o site EDAV
precisava. Sendo feita essa busca, a parte de sua instalação e um estudo das possíveis
mudanças necessárias que ainda por ventura existiram. Após determinado onde iriam ser
as modificações, o layout foi tomando forma dentro de todo um estudo cromático voltado
ao EDAV e as novas alterações nas cores vieram dentro do fórum. Como não tenho um
conhecimento aprimorado do CSS, tive dificuldades em buscar determinadas cores no
fórum, para serem alteradas, perdendo tempo. Com relação a galeria foi apenas dado
uma vista por cima, não tendo de início um foco para ele. Para atrapalhar o andamento
do projeto, nesta semana existiram quedas de energia e até mesmo a sua falta em
alguns dias na Faculdade, levando a um comprometimento no mesmo.

» André:

   Nesse sprint foram realizadas as seguintes tarefas: Stand Up’s, Sprint Backlog e
Sprint Review, Programação do sistema de Login, Testes no sistema de Mudança de
Senha, Adaptar páginas ao Login, Customização do template do Fórum, Re-estruturação
do sistema, Finalização da página de edição de Usuário (Gerenciamento), Finalização da
página de edição de Notícias (Gerenciamento), Finalização da página de edição de
Depoimentos (Gerenciamento), Instalação do JQuery wysiwyg no sistema de Notícias,
Implementação de Feedbacks (Gerenciamento), Customização do template do Fórum,
Correção de Bugs gerais, Finalização da página de Fumaceiros (Gerenciamento),
Programação do sistema de Fumaceiros, Implementação das Notícias na Home,
Implementação da página de Notícias, Implementação da página de Fumaceiros,
Implementação da página de Notícias, Otimização do CSS (Gerenciamento),
Documentação do Projeto, Validação do lado cliente, Validação do lado servidor.

   Em decorrência de imprevistos ocorridos durante a semana, como a falta de energia,
tanto pela manhã, quanto pela tarde, em dias diversos, e também alguns bugs
ocasionados por razões desconhecidas, as stories previstas para esse sprint não puderam
ser todas cumpridas, ficando assim algumas adiadas para o próximo sprint. Na tentativa
de contornar os problemas causados por esses fatos inesperados, decidi compensar
algum tempo trabalhando também no domingo, mas mesmo assim não foi possível suprir
todo o tempo perdido, ficando assim as partes de validação incompletas e o sistema de
busca totalmente adiado par ao próximo sprint.

   Algumas partes do sistema de gerenciamento deixaram de ser feitas por falta de
conteúdo, tendo os mesmos não sendo sido passado pelo cliente, ficando marcada para a
próxima semana uma reunião para sanar as dúvidas em relação a essas partes. Será
também solicitado ao cliente liberação de espaço no servidor, para serem realizados
testes no próprio servidor.

   Já a re-estruturação realizada nesse sprint, visou uma melhora na manutenção do
código, foram separadas as páginas de adição e edição de conteúdo. Porém a maior
mudança foi mesmo na parte de código. O site antes desenvolvido em PDO, passou a
usar conexões MySQL comuns. A mudança foi feita principalmente, devido ao fato do
servidor não disponibilizar essa tecnologia, e ao tentar contato com o mesmo o problema
não foi sanado.

» Marcos:

Foram realizadas as seguintes tarefas neste segundo Sprint:

                                          25
-   Ajustes Login de Gerenciamento
   -   Ajustes na página de Recrutamento
   -   Ajustes Padding Fumaceitos
   -   Finalização da Página de Downloads
   -   Implementação da Página de Gerenciamento de Destaques
   -   CSS do Fórum
   -   Finalização da Página de Vídeos
   -   Correção e BUGS gerais
   -   jQuery Lightbox
   -   Ajustes na sessão de Arquivo das páginas de Notícias, Imprensa e Videos
   -   Ajustes do Formulário de Recrutamento
   -   Tentativa de por focus no Checkbox via js no Firefox
   -   Finalização da Página de Resultado de Busca
   -   Criação de Tema da Tarde
   -   Criação de Tema da Noite

    Devido a algumas eventualidades, como um bug geral que deu nos computadores em
que trabalhávamos e faltas de energia durante algumas tardes na faculdade, algumas
atividades saíram fora do cronograma planejado para elas, gerando atrasos e metas não
conseguiram ser completamente cumpridas neste sprint, devendo ser contornadas no
próximo sprint. A tentativa de por focus no js no firefox foi infeliz, e depois de inúmeras
tentativas desisti de tentar implementar este feature. As atividades incompletas ou
atrasadas estão marcadas com um xis (x).

SPRINT 03

 Nome                  Disponibilidade
                       Horas Semanais           Seg    Ter     Qua    Qui    Sex    Sab
 Altamir da Silva      20 Horas (4 h/d)         x      x       x      x             x
 André Alves           36 Horas (6 h/d)         x      x       x      x      x      x
 Marcos Spinelli       36 Horas (6 h/d)         x      x       x      x      x      x

Stories

» André:
   - Documentação
   - Finalização em XHTML e CSS
   - Implementação em PHP
   - Banco de dados MySQL
   - Sistema de gerenciamento do site

» Marcos:
   - Documentação
   - Finalização em XHTML e CSS
   - Sistema de gerenciamento do site

» Altamir:
   - Documentação
   - Ajustes layout
   - Edição de cores e imagens

Tasks

» Altamir:
   - Adequação do Layout (fórum) (6 horas)
   - Adequação do Layout (galeria) (6 horas)
   - Edição de pequenos ícones (4 horas)


                                           26
» Andre:
   - Validação do Formulário (3 horas)
   - Sistema de Busca (3 horas)
   - Sistema de Vídeos (5 horas)
   - Sistema de Imprensa (5 horas)
   - Implementação da página de Vídeos (3 horas)
   - Implementação da página de Imprensa (3 horas)
   - Template do Fórum (4 horas)
   - Template da Galeria (3 horas)
   - Sprint Review (1 hora)
   - Documentação do projeto (2 horas)

» Marcos:
   - Elaboração da Documentação do Projeto (2 horas)
   - Elaboração do Product Backlog (2 horas)
   - Criação do Tema Noite (2 horas)
   - Finalização página de Destaques [gerenciamento] (2 horas)
   - Ajustes do Menu Horizontal (1 hora)
   - Finalização da caixa de sing up no gerenciamento (1 hora)
   - Mudança do CSS de gerenciamento (2 horas)
   - Position do logo EDAV (1 hora)
   - Finalização do Lightbox (2 horas)
   - Ajustes CSS da página de busca [manha, tarde e noite] (2 horas)
   - Ajustes da página EDAV (1 hora)
   - Ajustes página Fumaceiros (2 horas)
   - Finalização da página de Parceiros [gerenciamento] (3 horas)
   - Finalização da Página de Imprensa (2 horas)
   - Finalização do Lytebox na página de Fumaceiros (1 hora)
   - Finalização de Acessibilidade [Tamanho de Fonte A+A-] (1 hora)
   - Formulário (Descrição dos campos obrigatórios) (1 hora)
   - Ajustes do tema Manha (1 hora)
   - Ajustes do tema Noite (1 hora)
   - Ajustes do tema Tarde (1 hora)
   - Edição Fundo tema noite (1 hora)
   - Finalização da função de Imprimir página (2 horas)
   - Criação de Hacks para BUGS no IE7 (2 horas)

Stand Up

 Altamir
      Ontem                      Hoje                       Amanhã
 Seg                             - Stand Up                 - Stand Up
                                 - Adequar layout           - Adequar layout
                                   - (fórum)                 - (fórum)

 Ter   - Stand Up                - Stand Up                 - Stand Up
       - Adequar layout          - Adequar layout           - Adequar layout
        - (fórum)                  - (fórum)                 - (galeria)
                                 - Editar cores e imagens
                                   - (fórum/CSS)

 Qua   - Stand Up                - Stand Up                 - Stand Up
       - Adequar layout          - Adequar layout           - Editar cores,
        - (galeria)                - (galeria)              imagens
                                 - Editar cores e imagens     - (fórum e galeria)
                                   - (galeria/CSS)

 Qui   - Stand Up                - Stand Up
       - Editar cores, imagens   - Adequar layout

                                         27
- (fórum e galeria)      - (galeria)
                              - Editar cores e imagens
                                - (galeria/CSS)
                              - Edição de ícones EDAV
Sex

Sab                           - Sprint Backlog
                              - Sprint Review
                              - Complementação
                              escrita do projeto


André
     Ontem                    Hoje                       Amanhã
Seg - Stand Up                - Stand Up                 - Stand Up
     - Sprint Review          - Sprint Backlog           - Sistema de busca
     - Documentação do        - Documentação do          - Validação do lado
     Projeto                  Projeto                    cliente
     - Validação do lado      - Sistema de busca         - Validação do lado
     cliente                  - Validação do lado        servidor
     - Validação do lado      cliente                    - Customização do
     servidor                 - Validação do lado        template do Fórum
                              servidor

Ter   - Stand Up              - Stand Up                 - Stand Up
      - Sprint Backlog        - Sistema de busca         - Documentação do
      - Documentação do       - Validação do lado        Projeto
      Projeto                 cliente                    - Sistema de busca
      - Sistema de busca      - Validação do lado        - Fazer value do
      - Validação do lado     servidor                   campo de busca sumir
      cliente                 - Customização do          - Customização do
      - Validação do lado     template do Fórum          template da galeria
      servidor                                           - Sistema de vídeos
      - Customização do
      template do Fórum
      - Criação do “favico”

Qua   - Stand Up              - Stand Up                 - Stand Up
      - Sistema de busca      - Documentação do          - Sistema de Vídeos
      - Validação do lado     Projeto                    - Implementação da
      cliente                 - Sistema de busca         página de Vídeos
      - Validação do lado     - Value do campo de
      servidor                busca sumir
      - Customização do       - Customização do
      template do Fórum       template da galeria
      - Customização do       - Sistema de Vídeos
      template da Galeria

Qui   - Stand Up              - Stand Up                 - Stand Up
      - Documentação do       - Sistema de Vídeos        - Implementação dos
      Projeto                 - Implementação da         Destaques na Home
      - Sistema de busca      página de Vídeos           - Sistema de Imprensa
      - Value do campo de     - Instalação dos Temas     - Implementação da
      busca sumir             - Função Tamanho da        página de Imprensa
      - Customização do       Fonte
      template da galeria

Sex   - Stand Up              - Stand Up                 - Stand Up
      - Sistema de Vídeos     - Implementação dos        - Funcionalidade de

                                      28
- Implementação da        Destaques na Home          Impressão
      página de Vídeos          - Sistema de Imprensa
      - Instalação dos Temas    - Implementação da
      - Mudança no Tamanho      página de Imprensa
      da Fonte

Sab   - Stand Up                - Stand Up                 - Stand Up
      - Implementação dos       - Sprint Review            - Sprint Backlog
      Destaques na Home         - Javascript para          - Documentação do
      - Sistema de Imprensa     Impressão                  Projeto
      - Implementação da        - CSS para impressão
      página de Imprensa        - Correção de Bugs IE7

Marcos
     Ontem                      Hoje                       Amanhã
Seg - Stand Up                  - Stand Up                 - Stand Up
     - Criação de Tema da       - Sprint Backlog           - Ajustes do Menu
     Tarde                      - Criação de Tema da       Horizontal
     - Criação de Tema da       Noite                      - Finalização da caixa
     Noite (x)                  - Implementação da         de sing up no
     - Sprint Review            Página de                  gerenciamento
                                Gerenciamento de           - Mudança do CSS de
                                Destaques                  gerenciamento
                                - Elaboração da            - Position do logo
                                Documentação do            EDAV
                                Projeto

Ter   - Stand Up                - Stand Up                 - Stand Up
      - Sprint Backlog          - Ajustes do Menu          - Finalização do
      - Criação de Tema da      Horizontal                 Lightbox
      Noite                     - Finalização da caixa     - Ajustes CSS da
      - Implementação da        de sing up no              página de busca
      Página de                 gerenciamento              (manha, tarde e noite)
      Gerenciamento de          - Mudança do CSS de        - Ajustes da página
      Destaques                 gerenciamento              EDAV
      - Elaboração da           - Position do logo EDAV    - Ajustes página
      Documentação do                                      Fumaceiros
      Projeto

Qua   - Stand Up                - Stand Up                 - Stand Up
      - Ajustes do Menu         - Finalização do           - Finalização do
      Horizontal                Lightbox                   Lytebox
      - Finalização da caixa    - Ajustes CSS da página    - Finalização da página
      de sing up no             de busca (manha, tarde     de Parceiros
      gerenciamento             e noite)                   (gerenciamento)
      - Mudança do CSS de       - Ajustes da página        - Finalização da Página
      gerenciamento             EDAV                       de Imprensa
      - Position do logo EDAV   - Ajustes página           - Finalização do
                                Fumaceiros                 Lytebox na página de
                                                           Fumaceiros
                                                           Finalização de -
                                                           Acessibilidade
                                                           (Tamanho de Fonte
                                                           A+A-)

Qui   - Stand Up                - Stand Up                 - Stand Up
      - Finalização do          - Finalização do Lytebox   - Formulário
      Lightbox                  - Finalização da página    (Descrição dos campos
      - Ajustes CSS da página   de Parceiros               obrigatórios)

                                        29
de busca (manha, tarde     (gerenciamento)            - Ajustes do tema
       e noite)                   - Finalização da Página    Manha
       - Ajustes da página        de Imprensa                - Ajustes do tema
       EDAV                       - Finalização do Lytebox   Noite
       - Ajustes página           na página de               - Ajustes do tema
       Fumaceiros                 Fumaceiros                 Tarde
                                  Finalização de -
                                  Acessibilidade
                                  (Tamanho de Fonte
                                  A+A-)

 Sex   - Stand Up                 - Stand Up                 - Stand Up
       - Finalização do Lytebox   - Formulário (Descrição    - Edição Fundo tema
       - Finalização da página    dos campos                 noite
       de Parceiros               obrigatórios)              - Finalização da função
       (gerenciamento)            - Ajustes do tema          de Imprimir página
       - Finalização da Página    Manha                      - Criação de Hacks
       de Imprensa                - Ajustes do tema Noite    para BUGS no IE7
       - Finalização do Lytebox   - Ajustes do tema Tarde
       na página de
       Fumaceiros
       Finalização de -
       Acessibilidade
       (Tamanho de Fonte
       A+A-)

 Sab   - Stand Up                 - Stand Up                 - Stand Up
       - Formulário (Descrição    - Edição Fundo tema        - Sprint Backlog
       dos campos                 noite                      - Finalização da função
       obrigatórios)              - Finalização da função    de Imprimir página (x)
       - Ajustes do tema          de Imprimir página (x)
       Manha                      - Criação de Hacks para
       - Ajustes do tema Noite    BUGS no IE7
       - Ajustes do tema Tarde

Sprint Review

» Altamir:

    Neste sprint todo o tempo gasto foi no fórum e galeria, na tentativa de unir
elementos que assemelhassem entre eles próprios com o site EDAV. Porém existiram
novas dificuldades na sua realização, pois muitas cores passavam pelo CSS, além de
edição de imagens. Foi dado uma pequena complementação a parte escrita do projeto.
Como também foram criados alguns ícones com Zoom, download e impressão.

» Andre:

    Nesse sprint foram realizadas as seguintes tarefas: Stand Up, Sprint Review, Sprint
Backlog, Documentação do Projeto, Validação do lado cliente, Validação do lado servidor,
Sistema de busca, Customização do template do Fórum, Criação do “favico”,
Customização do template da Galeria, Value do campo de busca sumir, Sistema de
Vídeos, Implementação da página de Vídeos, Instalação dos Temas, Mudança no
Tamanho da Fonte, Implementação dos Destaques na Home, Sistema de Imprensa,
Implementação da página de Imprensa, Javascript para Impressão e CSS para
impressão.

   Todas as tarefas previstas para esse sprint no Sprint Backlog foram todas cumpridas,
e para aproveitar o tempo que restou, algumas tarefas adicionais foram sendo feitas,



                                          30
tanto com o intuito de adiantar o trabalho, quanto por decorrência de bugs ou
necessidades que foram surgindo.

» Marcos:

   Foram realizadas as seguintes tarefas no terceiro sprint:
      - Criação do Tema Noite
      - Finalização página de Destaques (gerenciamento)
      - Elaboração da Documentação do Projeto
      - Ajustes do Menu Horizontal
      - Finalização da caixa de sing up no gerenciamento
      - Mudança do CSS de gerenciamento
      - Position do logo EDAV
      - Finalização do Lightbox
      - Ajustes CSS da página de busca (manhã, tarde e noite)
      - Ajustes da página EDAV
      - Ajustes página Fumaceiros
      - Finalização do Lytebox
      - Finalização da página de Parceiros (gerenciamento)
      - Finalização da Página de Imprensa
      - Finalização do Lytebox na página de Fumaceiros
      - Finalização de Acessibilidade (Tamanho de Fonte A+A-)
      - Formulário (Descrição dos campos obrigatórios)
      - Ajustes do tema Manha
      - Ajustes do tema Noite
      - Ajustes do tema Tarde
      - Edição Fundo tema noite
      - FInalização da função de Imprimir página
      - Criação de Hacks para BUGS no IE7

   As tarefas supracitadas foram quase que em sua totalidade cumpridas, com uma
ressalva no Lightbox que por motivos não identificados não funcionou na página, talvez
por incompatibilidade por algum atributo que recebia por herança, ou por conflito com os
outros jQuery’s já presentes, o fato é que desisti de tentar finalizar o Lightbox e optei por
buscar outras alternativas, e a solução foi o uso do Lytebox, que faz a mesma função do
Lightbox, mas não utiliza a biblioteca do jQuery e sim JavaScript puro.

   A função de imprimir apenas o texto da página não foi concluída a tempo, passando
assim para ser feita no próximo sprint.


SPRINT 04

 Nome                Disponibilidade
                     Horas Semanais      Seg     Ter    Qua    Qui     Sex    Sab     Dom
 Altamir da Silva    20 Horas (4 h/d)    x       x      x      x              x
 André Alves         49 Horas (7 h/d)    x       x      x      x       x      x       x
 Marcos Spinelli     49 Horas (7 h/d)    x       x      x      x       x      x       x

Stories
» André:
   - Documentação
   - Implementação em PHP
   - Banco de dados MySQL
   - Sistema de gerenciamento do site
   - Publicação do Site

» Marcos:
   - Documentação

                                            31
- Sistema de gerenciamento do site
   - Publicação do Site

» Altamir:
   - Documentação
   - Ajustes layout
   - Edição de cores e imagens

Tasks
» Altamir:
   - Adequação do Layout (fórum) (6 horas)
   - Adequação do Layout (galeria) (6 horas)
   - Edição de pequenos ícones (4 horas)

» André:
   - Instalação do Fórum (1 hora)
   - Conversão do Fórum (1 hora)
   - Instalação da Galeria (1 hora)
   - Ponte do Fórum e Galeria (1 hora)
   - Finalização das Tooltips (1 hora)
   - Implementação da Página de Vídeos (1 hora)
   - Implementação da Página de Fumaceiros (3 horas)
   - Correção de Bugs (3 horas)
   - Ajustes no Banco (1 hora)
   - Ajustes Gerais (4 horas)
   - Testes de Usabilidade (2 horas)
   - Ajustes pós-teste (3 horas)
   - Sprint Review (1 hora)
   - Retrospection (1 hora)
   - Documentação do projeto (25 horas)

» Marcos:
   - Ajustes Página de Videos (2 horas)
   - Construção do jQuery dos Fumaceiros (8 horas)
   - Arrumação de Bugs dos Fumaceiros (3 horas)
   - Procura de BUGS no IE7 (3 horas)
   - Aplicação de testes de Usabilidade (4 horas)
   - Fechamento da Documentação (25 horas)

Stand Up

 Altamir
      Ontem                      Hoje                       Amanhã
 Seg                             - Stand Up                 - Stand Up
                                 - Adequar layout           - Adequar layout
                                   - (fórum)                 - (fórum)
 Ter    - Stand Up               - Stand Up                 - Stand Up
        - Adequar layout         - Adequar layout           - Adequar layout
         - (fórum)                 - (fórum)                 - (galeria)
                                 - Editar cores e imagens
                                   - (fórum/CSS)

 Qua    - Stand Up               - Stand Up                 - Stand Up
        - Adequar layout         - Adequar layout           - Editar cores,
         - (galeria)               - (galeria)              imagens
                                 - Editar cores e imagens     - (fórum e galeria)
                                   - (galeria/CSS)



                                         32
Qui   - Stand Up                 - Stand Up
      - Editar cores, imagens    - Adequar layout
        - (fórum e galeria)        - (galeria)
                                 - Editar cores e imagens
                                   - (galeria/CSS)
                                 - Edição de ícones EDAV
Sex

Sab                              - Sprint Backlog
                                 - Sprint Review
                                 - Complementação
                                 escrita do projeto

André
        Ontem                    Hoje                       Amanhã
Seg     - Stand Up               - Stand Up                 - Stand Up
        - Sprint Review          - Sprint Backlog           - Documentação do
        - Javascript para        - Documentação do          projeto
        Impressão                projeto                    - Finalização das
        - CSS para impressão     - Implementação da         Tooltips
        - Correção de Bugs IE7   Página de Vídeos           - Ajustes

Ter     - Stand Up               - Stand Up                 - Stand Up
        - Sprint Backlog         - Documentação do           - Documentação do
        - Documentação do        projeto                    projeto
        projeto                  - Finalização das          - Ajustes Gerais
        - Implementação da       Tooltips                   - Ajustes no Banco
        Página de Vídeos         - Ajustes Gerais

Qua     - Stand Up               - Stand Up                 - Stand Up
        - Documentação do         - Documentação do         - Documentação do
        projeto                  projeto                    projeto
        - Finalização das        - Ajustes Gerais           - Implementação da
        Tooltips                 - Ajustes no Banco         Página de Fumaceiros
        - Ajustes Gerais                                    - Instalação do Fórum
                                                            - Conversão do Fórum

Qui     - Stand Up               - Stand Up                 - Stand Up
         - Documentação do       - Documentação do          - Documentação do
        projeto                  projeto                    projeto
        - Ajustes Gerais         - Implementação da         - Instalação da Galeria
        - Ajustes no Banco       Página de Fumaceiros       - Ponte do Fórum e
                                 - Instalação do Fórum      Galeria
                                 - Conversão do Fórum       - Correção de Bugs
                                                            - Inserção de conteúdo
                                                            faltante
                                                            - Testes de
                                                            Usabilidade

Sex     - Stand Up               - Stand Up                 - Stand Up
        - Documentação do        - Documentação do          - Documentação do
        projeto                  projeto                    projeto
        - Implementação da       - Instalação da Galeria    - Ponte do Fórum e
        Página de Fumaceiros     - Ponte do Fórum e         Galeria
        - Instalação do Fórum    Galeria                    - Ajustes pós-teste
        - Conversão do Fórum     - Correção de Bugs
                                 - Inserção de conteúdo
                                 faltante
                                 - Testes de Usabilidade

                                         33
Sab   - Stand Up                - Stand Up                 - Stand Up
      - Documentação do         - Documentação do          - Sprint Review
      projeto                   projeto                    - Retrospection
      - Instalação da Galeria   - Ponte do Fórum e         - Documentação do
      - Ponte do Fórum e        Galeria                    projeto
      Galeria                   - Ajustes pós-teste
      - Correção de Bugs
      - Inserção de conteúdo
      faltante
      - Testes de Usabilidade

Dom   - Stand Up                - Stand Up
      - Documentação do         - Publicação do Site
      projeto                   - Sprint Review
      - Ponte do Fórum e        - Retrospection
      Galeria                   - Documentação do
      - Ajustes pós-teste       projeto

Marcos
     Ontem                      Hoje                       Amanhã
Seg  - Stand Up                 - Stand Up                 - Stand Up
     - Finalização da função    - Sprint Backlog           - Fechamento da
     de Imprimir página         - Ajustes Página de        Documentação
                                Videos                     - Construção do
                                                           jQuery dos Fumaceiros

Ter   - Stand Up                - Stand Up                 - Stand Up
      - Sprint Backlog          - Fechamento da            - Fechamento da
      - Ajustes Página de       Documentação               Documentação
      Videos                    - Construção do jQuery     - Construção do
                                dos Fumaceiros             jQuery do Fumaceitos

Qua   - Stand Up                - Stand Up                 - Stand Up
      - Fechamento da           - Fechamento da            - Fechamento da
      Documentação              Documentação               Documentação
      - Construção do jQuery    - Construção do jQuery     - Arrumação de Bugs
      dos Fumaceiros            do Fumaceitos              dos Fumaceiros

Qui   - Stand Up                - Stand Up                 - Stand Up
      - Fechamento da            - Fechamento da           - Fechamento da
      Documentação              Documentação               Documentação
      - Construção do jQuery    - Arrumação de Bugs        - Procura de Bugs no
      do Fumaceitos             dos Fumaceiros             IE7
                                                           - Aplicação de Testes
                                                           de Usabilidade

Sex   - Stand Up                - Stand Up                 - Stand Up
      - Fechamento da           - Fechamento da            - Sprint Backlog
      Documentação              Documentação               - Fechamento da
      - Arrumação de Bugs       - Procura de Bugs no       Documentação
      dos Fumaceiros            IE7
                                - Aplicação de Testes de
                                Usabilidade

Sab   - Stand Up                - Stand Up                 - Stand Up
      - Fechamento da           - Fechamento da            - Fechamento da
      Documentação              Documentação               Documentação
      - Procura de Bugs no
      IE7

                                        34
- Aplicação de Testes de
        Usabilidade

 Dom    - Stand Up                 - Stand Up
        - Fechamento da            - Sprint Backlog
        Documentação               - Fechamento da
                                   Documentação


Sprint Review

» Altamir:

    Neste final de chegada os mesmo feitos do sprint 3, com menos intensidade, uma vez
que as necessidades foram ficando menores, e como não tenho conhecimento que um
implementador precisa, nem tão pouco de um programador, a minha ajuda fica muito
limitada. Mas o que foi proposto no layout, foram feitos como esperado. O conteúdo foi
efetuado como o esperado, e dentro do prazo solicitado, o que leva a um bom
desempenho no geral. O grupo teve o comprometimento nos seus respectivos limites de
cada membro.

» Andre:

   Nesse sprint foram realizadas as seguintes tarefas: Stand Up, Sprint Backlog,
Documentação do projeto, Retrospection, Implementação da Página de Vídeos,
Finalização das Tooltips, Ajustes Gerais, Ajustes no Banco, Implementação da Página de
Fumaceiros, Instalação do Fórum, Conversão do Fórum, Instalação da Galeria, Ponte do
Fórum e Galeria, Correção de Bugs, Testes de Usabilidade, Ponte do Fórum e Galeria,
Ajustes pós-teste, Publicação do Site.

   Esse foi o último sprint e onde o projeto foi finalizado, teve suas tarefas focadas mais
nas partes de documentação e ajustes no site, ajustes esses tanto pela detecção de bugs
quanto pelas sugestões dos entrevistados nos testes de usabilidade. Foi aqui também
que ocorreram a instalação e configuração tanto do Fórum quanto da Galeria, já no
servidor, onde também foi hospedado o site. Também foram inseridos o conteúdo
fornecido pelo cliente.

   Por ser a finalização do projeto a carga horária foi aumentada, incluímos o domingo
para término do projeto e as horas diárias também sofreram aumento. Aumento esse
possibilitado pelo fato dos professores liberarem as aulas da semana para conclusão do
projeto. Graças a essa adição foi possível terminar o trabalho planejado para todo o
sprint, terminando assim os ciclos do projeto.


» Marcos:

   Foram realizadas as seguintes tarefas no quarto, e último, sprint:
      - Ajustes Página de Videos
      - Construção do jQuery dos Fumaceiros
      - Arrumação de Bugs dos Fumaceiros
      - Procura de BUGS no IE7
      - Aplicação de testes de Usabilidade
      - Fechamento da Documentação

   Todas as tasks para este sprint foram efetuadas de acordo com o tempo previsto,
variando pouco para mais ou para menos.




                                           35
Esse sprint foi mais focado na parte de documentação, onde foram gastos a maior
quantidade de horas e de esforços, para finalizar toda a parte escrita do projeto e
organizar o que já havia sido feito.


Backlog Review (Restrospection)
    Durante toda a realização do projeto com o uso da metodologia SCRUM, cada um dos
membros ficou responsável pela documentação de suas respectivas atividades, que
começaram a ser catalogadas com o projeto já em andamento, pelo fato da metodologia
SCRUM ter sido adotada tardiamente, não por culpa da equipe, mas por ter sido
demonstrada de forma tardia. Como a metodologia em si, adota um modelo de
desenvolvimento Iterativo, muitas das atividades foram reavaliadas pelos membros,
editadas ou até refeitas de acordo com as necessidades iminentes. Foi o que aconteceu
com o Wireframe, que sofreu uma leve modificação, depois que deixou-se de utilizar o
CMS Joomla, mas não o suficiente para caracterizá-lo como o idealizado inicialmente
(antes do Joomla), e o layout, que sofreu severas mudanças durante os 3 primeiros
sprints, e ajustes no quarto e último.

   A parte de finalização e programação sofreram atrasos, devido tanto à atrasos do
membro designado para a função do layout, quanto da migração de layouts de antes e
pós-Joomla. Portanto foi necessário que os outros dois membros (responsáveis pela
Finalização e Programação) participassem ativamente da construção do layout para que
não houvesse mais atrasos, uma vez que muita coisa não podia ser finalizada e nem
programada sem antes um layout, e tudo o que se tinha disponível já havia sido feito.

    Com boa parte do layout feita, o desenvolvimento do site começou a fluir em um bom
ritmo, até a aparição de bugs, que atrasou um pouco mais o projeto, e como já havia um
déficit de atraso por conta do layout, o programador teve que ajudar também na
finalização, já que para programar algumas coisas já deviam estar finalizadas.

   Todo o planejamento que havia sido feito e mensurado no cronograma, ficou irregular
devido aos atrasos, e muitas das mensurações foram adiadas. Para que o projeto fosse
concluído a tempo foi necessário prolongar a carga horária de acordo com a
disponibilidade dos membros, trabalhando da manhã à noite, de Segunda a Sábado, em
um ritmo acelerado.

   O site no presente momento (07/06/2009) encontra-se finalizado, portanto há um
déficit de conteúdo, devido ao cliente não ter entregue a tempo, assim como, algumas
imagens de Wallpapers, Arquivos e os Flash’s que ficariam no topo, sendo então
substituído por uma imagem estática.




                                         36
Justificativa Para:

Cor
   Plano de fundo: Foram inseridos três planos de fundo cujos temas sofrem alterações
de acordo com o horário em que o usuário está acessando.

   O plano de fundo que está como tema da manhã, apresenta nuvens brancas e um
gradiente azul. No tema da tarde, um pôr-do-sol com gradiente de cor laranja claro para
escuro, e por fim, o tema da noite, com um luar e estrelas num gradiente do preto ao
azul escuro, dando uma idéia de crepúsculo.

   Esses são temas idealizados nas passagens naturais que a terra apresenta, bem
como, nos possíveis momentos de vôo. Para representar melhor os temas descritos,
segui abaixo uma imagem ilustrativa.




Cor de fundo:

   Foi criada uma cor de fundo preta com uma opacidade menor, dando uma
transparência à imagem, levando a um jogo visual de luz com o plano de fundo. Além de
dar uma forma aos blocos, o mesmo passa a idéia de que estão flutuando no ar, o que
também traz a sensação de harmonia e equilíbrio entre os elementos presentes. Pode-se
visualizar abaixo essa junção.




  Cor de fonte: Foi utilizada uma cor padrão para todo o projeto, a cor branca, por ser
uma cor contrastante com outras cores mais escuras, e pelo fato do site utilizar um



                                         37
fundo transparente preto, que possibilita pouca passagem de luz, excluindo assim a
utilização das demais cores, contribuindo para um conforto visual.

    Paleta de Cores: As cores apresentam-se combinadas entre si, de forma que essa
junção pudesse instigar o lado explorador do usuário no site através das formas
utilizadas do conteúdo, dos detalhes, enfim, das pequenas criações elaboradas,
ressaltando que as cores estão também embasadas nas cores que compõem o EDAV.

    O tema em mudança pode contribuir positivamente nas pessoas, conseqüentemente o
número de acesso aumentará. São aspectos que alavancam o EDAV como um todo, por
isso faz-se necessário um estudo das cores a utilizar. Com relação as cores da sua
marca, não foi alterada a pedido do cliente.

    De acordo com os três temas (manhã, tarde, noite), foram criadas paletas de cores
diferentes, salientando que se utilizou gradiente, o que apresenta um alto número de
cores. Para que se tenha um entendimento sobre suas cores, a patela constará abaixo
apenas suas cores predominantes.

   Manhã




   Tarde




   Noite




OBS: A cor preta consta uma opacidade de 65% em todo o conteúdo

    Cores do Feedback: Foram utilizadas cores diferentes para representar mensagens
de alerta ou de procedimentos bem sucedidos ao preencher/validar os formulários. Por
isso foram utilizadas as cores vermelha, que estimula a pessoa a agir e demonstra que
algo está errado, e a cor verde que transmite a sensação de raciocínio correto e
segurança, confirmando que o procedimento foi efetuado com sucesso.

Tipografia
   Tipo de fonte: Foi utilizada a fonte “Arial”, por ser uma fonte padrão no Windows,
Mac OSX e Linux, sendo catalogada na W3C como uma das fontes padrões dos principais
browsers do mercado. Por ser ma fonte sem serifa, a visualização da mesma em
monitores fica facilitada, deixando o visitante com visão mais confortável.

   Outro motivo para utilização da fonte arial foi a questão da semiótica e semelhança,
por o logo oficial da EDAV já utilizar esta fonte.

    Família de Fontes: O Font-Family utilizado foi : Arial, Helvetica, sans-serif; que
busca no computador do visitante a fonte Arial e se não for encontrada as sucessivas,
eliminando assim o problema de um reset para a fonte padrão do browser.




                                          38
Tamanho de Fonte: Foram utilizados diversos tamanhos de fonte, com intuito de
hierarquizar os elementos, e organizar a concepção visual, facilitando o entendimento do
conteúdo do site e disposição das informações. Foram utilizados o padrão de 11px para
textos em parágrafos, e 14px e 13px para diferentes tipos de títulos.

Imagens
   O que justifica utilizar as imagens encontradas no site é o fato de trazer o mais
próximo possível o EDAV ao usuário, através de alguns screens do próprio simulador.
Para muitos, uma boa imagem pode ser considerada o cartão de visita para adentrar nas
suas páginas mais internas, como uma chamada a futuras visitas apreciativas.

Diagramação
   A diagramação adotada no projeto foi uma diagramação considerada padrão na
maioria dos sites atuais. É composta por um topo, que contém uma barra com um menu
expresso e uma caixa de busca, e logo abaixo dessa barra um espaço para banners com
animações em flash. Logo em seguida com a mesma largura e completamente junto,
encontra-se o menu, que devido à proximidade e semelhança parece fazer parte do topo
como um único elemento na página.

   Logo abaixo temos um espaço para o conteúdo das páginas do site, conteúdo esse
que pode ser disposto de diversas formas: como um único elemento englobando todo o
conteúdo, duas colunas horizontais ou dividida em boxes, como na Home e na página de
Fumaceiros. Ao final da página encontramos o rodapé, que segue o mesmo estilo do
topo.

   Essa estrutura descrita acima foi desenvolvida para monitores com resolução
800x600, não criando rolagem para visitantes desse padrão. Porém visitantes com
resoluções maiores podem visualizar os elementos dessa estrutura de forma centralizada
na página e perfeitamente alinhados, além de poderem ver partes do fundo ocultas em
resoluções inferiores.

    Na área de gerenciamento o modelo é o mesmo permanecendo o topo, em menor
altura e sem a área destinada ao flash, e o rodapé. O menu passa a fazer parte do
conteúdo da página, que agora encontrasse sempre dividido em duas colunas, sendo a
esquerda destinada ao menu e a direita ao conteúdo em si.

Ícones
   Foram utilizados diversos ícones para que fosse possível ao usuário uma fácil
identificação do conteúdo, servido como suporte para o texto, alem de ser um eyecandy
(beleza aos olhos), que ajuda a compor o layout do site.

   Os ganhos ao usar-se ícones são grandes, pois alem de facilitar nos mapas mentais
ao hierarquizar elementos, ainda embeleza o site e serve como referencia de usabilidade.
   Os ícones substituem a uma unidade de significado (idéia, conceito, ação…) que
representada com texto ocuparia mais espaço. A principal vantagem é que mediante
ícones se podem representar mais unidades utilizando um espaço menor, ou até, reforçar
visualmente o sentido do texto (símbolo).

   Eles fazem parte integral dos elementos do site quanto ao despertar da curiosidade
do usuário servindo de suporte para a definição do elemento ou quando se deseja que o
usuário investigue e descubra por si mesmo o funcionamento da interface, os ícones têm
um grande papel. Todavia, tivemos cuidado ao usar elementos que tivessem um
significado claro, ou fossem já convencionados, já que os ícones são muito subjetivos,
estão sujeitos à interpretação individual e subjetiva de cada pessoa a partir de sua
experiência. Nunca são totalmente claros existe risco de ser mal-entendidos. Por esta
razão, utilizamo-los mais como suporte, do que como substituto ao texto.

                                          39
Abaixo estão listados os ícones utilizados no site com o sua função:

       Cadeado Fechado:                            Placa de Atenção:
       Indica que a sessão de                      Chama a atenção do usuário
       recrutamento está fechada.                  para uma informação.
       Cadeado Aberto:                             Lupa:
       Indica que a sessão de                      Demonstra que o campo é de
       recrutamento está aberta.                   pesquisa.
       Cerquilha:                                  Lápis:
       Indica a posição do Fumaceiro.              Indica que o elemento pode
                                                   ser editado.
       Seta para Baixo:                            X:
       Indica que há um nível abaixo no            Indica que o elemento pode
       menu.                                       ser deletado.
       Seta inclinada:                             Impressora:
       Ajuda a hierarquizar um título.             Indica que o texto pode ser
                                                   impresso.
       Tucano:                                     A+:
       Indica a posição do fumaceiro,              Indica que o tamanho da
       dentro da formação.                         fonte pode ser aumentado.
       Seta Dupla (european quote):                A-:
       Hierarquiza um headline.                    Indica que o tamanho da
                                                   fonte pode ser diminuído.
      Caixa de Interrogação:                       Estrela:
      Abre um tooltip com informações de           Demonstra a patente do
      como proceder.                               piloto.

Semiótica e Comunicação
    Assim que o usuário entra no site, logo na home ele encontra um pequeno
depoimento o informando do que se trata o site, para que ele não tenha dúvidas do que
se trata o conteúdo do site. Todas as informações no menu encontram-se de forma clara,
salvo a parte de fumaceiros (pilotos), termo que pode ser estranho para alguns, mas que
a pedido do cliente não foi mudado. Para contornar esse problema, ao usuário acessar a
página e não ter nenhum fumaceiro selecionado, um pequeno texto lhe explica o
significado do termo e o que ele pode encontrar naquela página. Como abordado por
Krug no seu livro Não me Faça Pensar devido ao grande volume de sites sobre os mais
diversificados assuntos encontrados na internet, os usuários ao entrarem em um site,
sentem-se muito confusos já que podem encontrar qualquer assunto nele. Tendo em
visto isso, faz-se necessário deixar bem claro, logo em sua página inicial, do que se trata
o site.

   A linguagem do site foi passada da forma mais clara possível, para que pessoas que
não possuam conhecimento do assunto tratado possam entender. A parte em que termos
técnicos são realmente utilizados é na parte de Recrutamento, tendo em vista que para
se entrar no EDAV é necessário ter conhecimento técnico prévio. Buscando atingir o
maior número de pessoas buscamos utilizar a linguagem da forma mais simples possível,
para torná-la entendível por todos.

    Outra forma de comunicação presente no site são os feedbacks, presentes tanto no
site como na área de gerenciamento. Qualquer atividade em que seja necessário o uso
do servidor como envio de formulário, login, cadastro e edição de conteúdo, é retornado
ao usuário ou administrador um aviso, informando se a tarefa foi realizada com sucesso
ou não. Buscando assim, evitar que o usuário venha a sentir-se perdido no site.

   O grande desafio que encontramos foi criar uma identificação do site com um
esquadrão de simulação aérea, e para isso foi desenvolvido um layout onde a página
parece flutuar entre as nuvens, trazendo assim uma forte identificação com o elemento

                                           40
“ar”, tão presente na aviação. Para que o usuário tenha uma experiência diferenciada ao
entrar no site foram feitos 3 temas que variam de acordo com o horário de acesso, são
eles:

Manhã: Para representar a manhã, foi criado um fundo azulado, com nuvens e céu
aberto. Fazendo com que o visitante desfrute de uma bela manhã.

Tarde: Para representar uma tarde, foi feito um por do sol, com o céu alaranjado.
Fazendo com que o visitante sinta o entardecer.

Noite: Para representar a noite, foi desenvolvido um fundo com um luar com estrelas,
fazendo com que o visitante sinta-se em um ambiente noturno.

Signos

    Para seguir os conceitos da semiótica o site do EDAV apresenta diversos elementos
referentes aos signos. Foi escolhido fazer um uso maior de símbolos, apresentando
poucos ícones em sua representação.

   Dentre os ícones utilizados, podemos citar a lupa no campo de busca, os vídeos das
simulações presentes no banner em flash no topo, algumas imagens representando os
aviões tanto na pagina do EDAV quanto nas páginas dos fumaceiros, em forma de
miniatura, no favico e wallpapers.

   Como símbolos, podemos encontrar a própria parte escrita do site, que é composta
por palavras que possuem um significado e foram convencionadas tanto pela língua
portuguesa quanto pelos próprios usuários do EDAV como os termos técnicos. Outro
símbolo é o próprio logotipo do esquadrão presente no topo das páginas, para ajudar na
identidade do site.

Lupa: Foi utilizada uma lupa na caixa de busca, um ícone que cria uma identidade visual,
já que por convenção as pessoas identificam o ato de buscar por algo com a imagem de
Sherlock Holmes e sua inseparável lupa.

Cadeados: Na área administrativa, na parte do recrutamento, onde o administrador
pode definir se o recrutamento encontra-se aberto ou fechado, aplicamos o ícone de um
cadeado que dependendo do status do cadastramento encontra-se aberto ou fechado.

Seta: O símbolo dos títulos utiliza uma fonte maior para hierarquizá-los, com ajuda da
seta que serve como destaque para os demais textos.

Seta para baixo: A utilização do ícone de seta para baixo, propõe que há conteúdo
abaixo dele, e ao clicá-lo ele se abre.

Seta Dupla: O uso de setas duplas, também conhecido como European Quote, serve
para destacar os Headlines do restante do texto, hierarquizando-os em relação aos
outros símbolos.

A+ e A-: Os símbolos “A+” e “A-” sugerem ao leitor que se pode alterar o tamanho da
fonte do texto, servido como importante item de acessibilidade.

Impressora: O ícone da impressora demonstra ao usuário que é possível imprimir o
texto contido naquela página.

Placa de Exclamação: A placa com uma exclamação é um símbolo já convencionado
que sugere atenção, fazendo com que o usuário leia a frase que está contida após ele.

  Como a semiótica aborda aspectos filosóficos e lingüísticos estabelecidos pelo
americano Charles S. Pierce e o suíço Ferdinand de Saussure sendo muito útil no estudo

                                          41
Briefing - ADAV
Briefing - ADAV
Briefing - ADAV
Briefing - ADAV
Briefing - ADAV
Briefing - ADAV
Briefing - ADAV
Briefing - ADAV
Briefing - ADAV
Briefing - ADAV
Briefing - ADAV
Briefing - ADAV
Briefing - ADAV
Briefing - ADAV
Briefing - ADAV
Briefing - ADAV
Briefing - ADAV
Briefing - ADAV

Contenu connexe

Tendances

dalai_tfg_domoimersivoarq
dalai_tfg_domoimersivoarqdalai_tfg_domoimersivoarq
dalai_tfg_domoimersivoarqdfelinto
 
Ruby on rails
Ruby on railsRuby on rails
Ruby on railsTiago
 
Apostila cdtc dotproject
Apostila cdtc dotprojectApostila cdtc dotproject
Apostila cdtc dotprojectTiago
 
Screen
ScreenScreen
ScreenTiago
 
As Novas Competências do Profissional de Secretariado - IOB e-Store
As Novas Competências do Profissional de Secretariado - IOB e-StoreAs Novas Competências do Profissional de Secretariado - IOB e-Store
As Novas Competências do Profissional de Secretariado - IOB e-StoreIOB News
 
Drupal
DrupalDrupal
DrupalTiago
 
Selinux
SelinuxSelinux
SelinuxTiago
 
Curso desenho arquitetônico
Curso  desenho arquitetônicoCurso  desenho arquitetônico
Curso desenho arquitetônicoPatricia Bughi
 

Tendances (20)

Caelum html-css-javascript-php
Caelum html-css-javascript-phpCaelum html-css-javascript-php
Caelum html-css-javascript-php
 
Uml
UmlUml
Uml
 
dalai_tfg_domoimersivoarq
dalai_tfg_domoimersivoarqdalai_tfg_domoimersivoarq
dalai_tfg_domoimersivoarq
 
Arduhack rev2
Arduhack rev2Arduhack rev2
Arduhack rev2
 
Sql
SqlSql
Sql
 
Ruby on rails
Ruby on railsRuby on rails
Ruby on rails
 
Apostila cdtc dotproject
Apostila cdtc dotprojectApostila cdtc dotproject
Apostila cdtc dotproject
 
Squid
SquidSquid
Squid
 
Screen
ScreenScreen
Screen
 
Xdmcp
XdmcpXdmcp
Xdmcp
 
As Novas Competências do Profissional de Secretariado - IOB e-Store
As Novas Competências do Profissional de Secretariado - IOB e-StoreAs Novas Competências do Profissional de Secretariado - IOB e-Store
As Novas Competências do Profissional de Secretariado - IOB e-Store
 
Vim
VimVim
Vim
 
Samba
SambaSamba
Samba
 
Qemu
QemuQemu
Qemu
 
Drupal
DrupalDrupal
Drupal
 
LIVRO TFG - KARINA SILVA
LIVRO TFG - KARINA SILVALIVRO TFG - KARINA SILVA
LIVRO TFG - KARINA SILVA
 
Selinux
SelinuxSelinux
Selinux
 
Jspservlets
JspservletsJspservlets
Jspservlets
 
Curso desenho arquitetônico
Curso  desenho arquitetônicoCurso  desenho arquitetônico
Curso desenho arquitetônico
 
J2me
J2meJ2me
J2me
 

En vedette

Modelo briefing web
Modelo briefing webModelo briefing web
Modelo briefing webDavid Campos
 
MODELOS de Briefing - by André Félix
MODELOS de Briefing - by André FélixMODELOS de Briefing - by André Félix
MODELOS de Briefing - by André FélixNeca Boullosa
 
005- Planejamento Estratégico em Redes Sociais e Curadoria de Conteúdo
005- Planejamento Estratégico em Redes Sociais e Curadoria de Conteúdo005- Planejamento Estratégico em Redes Sociais e Curadoria de Conteúdo
005- Planejamento Estratégico em Redes Sociais e Curadoria de ConteúdoMario Diego Oliveira dos Santos
 
GERENCIAMENTO DAS INFORMAÇÕES DO PROJETO EM ESCRITÓRIOS DE ARQUITETURA
GERENCIAMENTO DAS INFORMAÇÕES DO PROJETO EM ESCRITÓRIOS DE ARQUITETURAGERENCIAMENTO DAS INFORMAÇÕES DO PROJETO EM ESCRITÓRIOS DE ARQUITETURA
GERENCIAMENTO DAS INFORMAÇÕES DO PROJETO EM ESCRITÓRIOS DE ARQUITETURAVinicius Volponi
 
Ficha cadastral brookfield pf
Ficha cadastral brookfield pfFicha cadastral brookfield pf
Ficha cadastral brookfield pfHerminio Botelho
 
Briefing by Rafael Sampaio
Briefing by Rafael SampaioBriefing by Rafael Sampaio
Briefing by Rafael SampaioFran Maciel
 
Briefing - Preciso, Claro e Objetivo
Briefing - Preciso, Claro e ObjetivoBriefing - Preciso, Claro e Objetivo
Briefing - Preciso, Claro e ObjetivoKatia Viola
 

En vedette (13)

Modelo briefing web
Modelo briefing webModelo briefing web
Modelo briefing web
 
Modelo de briefing
Modelo de briefingModelo de briefing
Modelo de briefing
 
MODELOS de Briefing - by André Félix
MODELOS de Briefing - by André FélixMODELOS de Briefing - by André Félix
MODELOS de Briefing - by André Félix
 
Definição de briefing
Definição de briefingDefinição de briefing
Definição de briefing
 
005- Planejamento Estratégico em Redes Sociais e Curadoria de Conteúdo
005- Planejamento Estratégico em Redes Sociais e Curadoria de Conteúdo005- Planejamento Estratégico em Redes Sociais e Curadoria de Conteúdo
005- Planejamento Estratégico em Redes Sociais e Curadoria de Conteúdo
 
Modelode briefing
Modelode briefingModelode briefing
Modelode briefing
 
GERENCIAMENTO DAS INFORMAÇÕES DO PROJETO EM ESCRITÓRIOS DE ARQUITETURA
GERENCIAMENTO DAS INFORMAÇÕES DO PROJETO EM ESCRITÓRIOS DE ARQUITETURAGERENCIAMENTO DAS INFORMAÇÕES DO PROJETO EM ESCRITÓRIOS DE ARQUITETURA
GERENCIAMENTO DAS INFORMAÇÕES DO PROJETO EM ESCRITÓRIOS DE ARQUITETURA
 
Ficha cadastral brookfield pf
Ficha cadastral brookfield pfFicha cadastral brookfield pf
Ficha cadastral brookfield pf
 
Modelo Briefing
Modelo BriefingModelo Briefing
Modelo Briefing
 
Briefing by Rafael Sampaio
Briefing by Rafael SampaioBriefing by Rafael Sampaio
Briefing by Rafael Sampaio
 
Briefing
BriefingBriefing
Briefing
 
Tipologia de eventos
Tipologia de eventosTipologia de eventos
Tipologia de eventos
 
Briefing - Preciso, Claro e Objetivo
Briefing - Preciso, Claro e ObjetivoBriefing - Preciso, Claro e Objetivo
Briefing - Preciso, Claro e Objetivo
 

Similaire à Briefing - ADAV

Planejamento_e_Controle_de_Obras_Residen.pdf
Planejamento_e_Controle_de_Obras_Residen.pdfPlanejamento_e_Controle_de_Obras_Residen.pdf
Planejamento_e_Controle_de_Obras_Residen.pdfJenilsonPires1
 
Jspservlets
JspservletsJspservlets
JspservletsTiago
 
Gerenciamento de projetos
Gerenciamento de projetosGerenciamento de projetos
Gerenciamento de projetosTiago
 
Plano do projeto de software SIGEM - Sistema de gestão de materiais
Plano do projeto de software SIGEM - Sistema de gestão de materiaisPlano do projeto de software SIGEM - Sistema de gestão de materiais
Plano do projeto de software SIGEM - Sistema de gestão de materiaisMarcos Pessoa
 
Relatório de Estágio da Graduação
Relatório de Estágio da GraduaçãoRelatório de Estágio da Graduação
Relatório de Estágio da GraduaçãoMaurício Linhares
 
Arquitetura da-informacao-tutorial
Arquitetura da-informacao-tutorialArquitetura da-informacao-tutorial
Arquitetura da-informacao-tutorialMarcvs Villie
 
Inkscape
InkscapeInkscape
InkscapeTiago
 
Postfix
PostfixPostfix
PostfixTiago
 
Nessus
NessusNessus
NessusTiago
 
Monitoramento
MonitoramentoMonitoramento
MonitoramentoTiago
 
Quanta
QuantaQuanta
QuantaTiago
 
Instalacao xoops
Instalacao xoopsInstalacao xoops
Instalacao xoopsTiago
 
plano_de_projeto_controlart_final
plano_de_projeto_controlart_finalplano_de_projeto_controlart_final
plano_de_projeto_controlart_finaluserrx
 
Pascal
PascalPascal
PascalTiago
 
Planejamento em desenvolvimento_de_sistemas
Planejamento em desenvolvimento_de_sistemasPlanejamento em desenvolvimento_de_sistemas
Planejamento em desenvolvimento_de_sistemasTiago
 
Tcl tk
Tcl tkTcl tk
Tcl tkTiago
 

Similaire à Briefing - ADAV (20)

Planejamento_e_Controle_de_Obras_Residen.pdf
Planejamento_e_Controle_de_Obras_Residen.pdfPlanejamento_e_Controle_de_Obras_Residen.pdf
Planejamento_e_Controle_de_Obras_Residen.pdf
 
Jspservlets
JspservletsJspservlets
Jspservlets
 
Gerenciamento de projetos
Gerenciamento de projetosGerenciamento de projetos
Gerenciamento de projetos
 
Plano do projeto de software SIGEM - Sistema de gestão de materiais
Plano do projeto de software SIGEM - Sistema de gestão de materiaisPlano do projeto de software SIGEM - Sistema de gestão de materiais
Plano do projeto de software SIGEM - Sistema de gestão de materiais
 
Relatório de Estágio da Graduação
Relatório de Estágio da GraduaçãoRelatório de Estágio da Graduação
Relatório de Estágio da Graduação
 
Arquitetura da-informacao-tutorial
Arquitetura da-informacao-tutorialArquitetura da-informacao-tutorial
Arquitetura da-informacao-tutorial
 
Dicas para seu próximo site
Dicas para seu próximo siteDicas para seu próximo site
Dicas para seu próximo site
 
Inkscape
InkscapeInkscape
Inkscape
 
Postfix
PostfixPostfix
Postfix
 
Nessus
NessusNessus
Nessus
 
Monitoramento
MonitoramentoMonitoramento
Monitoramento
 
Ltsp
LtspLtsp
Ltsp
 
Plone
PlonePlone
Plone
 
Quanta
QuantaQuanta
Quanta
 
Zope
ZopeZope
Zope
 
Instalacao xoops
Instalacao xoopsInstalacao xoops
Instalacao xoops
 
plano_de_projeto_controlart_final
plano_de_projeto_controlart_finalplano_de_projeto_controlart_final
plano_de_projeto_controlart_final
 
Pascal
PascalPascal
Pascal
 
Planejamento em desenvolvimento_de_sistemas
Planejamento em desenvolvimento_de_sistemasPlanejamento em desenvolvimento_de_sistemas
Planejamento em desenvolvimento_de_sistemas
 
Tcl tk
Tcl tkTcl tk
Tcl tk
 

Plus de m4rkSpinelli

Testes de Usabilidade
Testes de UsabilidadeTestes de Usabilidade
Testes de Usabilidadem4rkSpinelli
 
Interface Homem X Máquina
Interface Homem X MáquinaInterface Homem X Máquina
Interface Homem X Máquinam4rkSpinelli
 
Sistemas de Informação (SAD / OLAP)
Sistemas de Informação (SAD / OLAP)Sistemas de Informação (SAD / OLAP)
Sistemas de Informação (SAD / OLAP)m4rkSpinelli
 
Barreiras Interpessoais à tomada de decisões
Barreiras Interpessoais à tomada de decisõesBarreiras Interpessoais à tomada de decisões
Barreiras Interpessoais à tomada de decisõesm4rkSpinelli
 
Novos Desafios : Utilizando Padrões de e-Business para otimizar o seu negócio
Novos Desafios : Utilizando Padrões de e-Business para otimizar o seu negócioNovos Desafios : Utilizando Padrões de e-Business para otimizar o seu negócio
Novos Desafios : Utilizando Padrões de e-Business para otimizar o seu negóciom4rkSpinelli
 

Plus de m4rkSpinelli (6)

Tipos de Sites
Tipos de SitesTipos de Sites
Tipos de Sites
 
Testes de Usabilidade
Testes de UsabilidadeTestes de Usabilidade
Testes de Usabilidade
 
Interface Homem X Máquina
Interface Homem X MáquinaInterface Homem X Máquina
Interface Homem X Máquina
 
Sistemas de Informação (SAD / OLAP)
Sistemas de Informação (SAD / OLAP)Sistemas de Informação (SAD / OLAP)
Sistemas de Informação (SAD / OLAP)
 
Barreiras Interpessoais à tomada de decisões
Barreiras Interpessoais à tomada de decisõesBarreiras Interpessoais à tomada de decisões
Barreiras Interpessoais à tomada de decisões
 
Novos Desafios : Utilizando Padrões de e-Business para otimizar o seu negócio
Novos Desafios : Utilizando Padrões de e-Business para otimizar o seu negócioNovos Desafios : Utilizando Padrões de e-Business para otimizar o seu negócio
Novos Desafios : Utilizando Padrões de e-Business para otimizar o seu negócio
 

Briefing - ADAV

  • 1. FACULDADE MARISTA DO RECIFE Altamir da Silva, André Alves, Marcos Spinelli EDAV - ESQUADRÃO DE DEMONSTRAÇÃO AÉREA VIRTUAL “REDESIGN DO SITE” Ambiente Web – Dino Lincoln Aplicações Gráficas - Dino Lincoln Desenvolvimento de Projetos e Aplicações Web – André Melo Interface Homen-Máquina – Angélica Martins Planejamento Visual – Carlos Moura Recife, 2009
  • 2. Sumário 
 Introdução .......................................................................................................... 3
 Justificativa ......................................................................................................... 4
 Objetivos ............................................................................................................ 5
 Relatório do planejamento ..................................................................................... 6
 Cronograma anterior (Pré-projeto) ................................................................................. 6
 Cronograma EDAV ...................................................................................................... 7
 Relatório do Briefing ............................................................................................. 9
 Tópicos da Arquitetura .........................................................................................10
 Fluxo de Navegação do Site ....................................................................................... 10
 Fluxo de Navegação do Gerenciamento ....................................................................... 11
 Sitemap .............................................................................................................12
 Descrição conceitual e justificativa da proposta gráfica .............................................13
 Sistema (Product Backlog) ....................................................................................14
 Dead Line................................................................................................................ 14
 Stories.................................................................................................................... 14
 Sprints.................................................................................................................... 14
 Envolvidos............................................................................................................... 14
 Descrição do Projeto ................................................................................................. 14
 Sprint Backlog ......................................................................................................... 15
 Backlog Review (Restrospection) ................................................................................ 36
 Justificativa Para: ................................................................................................37
 Cor......................................................................................................................... 37
 Tipografia................................................................................................................ 38
 Imagens ................................................................................................................. 39
 Diagramação ........................................................................................................... 39
 Ícones .................................................................................................................... 39
 Semiótica e Comunicação .......................................................................................... 40
 Conceitos de Usabilidade e Acessibilidade .................................................................... 42
 Modelos Mentais ....................................................................................................... 43
 Ferramentas e Tecnologias ...................................................................................44
 Ferramentas Utilizadas.............................................................................................. 45
 Testes de Usabilidade ..........................................................................................46
 Bibliografia .........................................................................................................47
 Anexos ..............................................................................................................48
 I.
Análise de Similares............................................................................................... 48
 II. Estudo Cromático................................................................................................. 58
 II.
Registro de Reuniões ............................................................................................ 59
 III.
Questionários de Usabilidade ................................................................................ 63
 ii
  • 3. Introdução O EDAV (Esquadrão de Demonstração Aérea Virtual) surgiu em 1998 com o intuito de simular as operações realizadas pelo EDA (Esquadrão de Demonstração Aérea) no ambiente virtual Flight Simulator. A proposta deste projeto consistiu na elaboração do redesign do site, tornando-o um ambiente mais agradável e funcional, buscando assim, suprir as necessidades atuais dos usuários que o frequentam. Além de incluir novas funcionalidades, o site ganhou uma maior dinamicidade, podendo ser facilmente gerenciável e alimentado pelos seus gestores. Utilizou-se novas tecnologias para que apresente um melhor desempenho dentro das expectativas que se tem sobre ele, bem como, sua reestruturação visual para criar uma maior identidade com o esquadrão. Assim, buscamos tornar o site mais completo, organizado e de fácil utilização, tanto para os usuários quanto para os gestores, trazendo também uma melhoria significativa no impacto que as pessoas possam vir a ter ao visitá-lo. 3
  • 4. Justificativa Ao longo dos mais de dez anos de existência do EDAV, as necessidades de seus membros e visitantes sofreram diversas mudanças impulsionadas pelo desenvolvimento tecnológico, que modificaram a forma de interação com os sites, adicionando opção de visualização de vídeos em streaming, gerenciamento de conteúdo, proporcionando mais flexibilidade, usabilidade e desempenho. Sendo assim, foi necessário ser feita uma reestruturação tecnológica para suprir as deficiências encontradas no antigo site, que na época de sua criação original era inviável. Fazendo assim, uma atualização tecnológica mais que necessária. O site foi desenvolvido com base nas propostas do cliente, bem como nas sugestões do grupo de desenvolvimento, levando a um consenso e harmonia, onde foram propostas modificações acordadas. Foi necessário deixar o site com uma identidade visual mais agradável, para que o visitante identifique instantaneamente do que se trata o EDAV, e possa melhor se informar sobre o mesmo, uma vez que o site antigo não oferecia quase nenhuma funcionalidade, apenas um link para o fórum. Este projeto foi desenvolvido de acordo com a necessidade do cumprimento de nota parcial das disciplinas de ambiente Web, aplicações gráficas, desenvolvimento de projetos e aplicações Web, interface homem-máquina e planejamento visual. Servindo assim como processo de aprendizagem e aperfeiçoamento de técnicas, pondo em prática os conceitos aprendidos em sala de aula, contribuindo para o crescimento profissional e acadêmico dos membros participantes, uma vez que, o contato com clientes reais é uma experiência muito enriquecedora. 4
  • 5. Objetivos Geral: • Reestruturar o site de forma a melhor atender as necessidades dos administradores e dos visitantes. Específicos: • Atualizar o fórum para uma versão mais recente. • Instalar um sistema de galeria. • Criar uma relação de identidade maior do site com o EDAV. • Implementar um sistema gerenciável. • Inserir conteúdos requisitados no briefing, não existentes no site antigo. • Criar uma navegação mais intuitiva de acordo com modelos mentais partilhados. 5
  • 6. Relatório do planejamento Cronograma anterior (Pré-projeto) No cronograma do pré-projeto, foram feitas previsões dos prazos, a serem cumpridos, expostos no cronograma apresentado abaixo: Como alguns dos prazos não condisseram com o real cronograma, não foram modificadas as mensurações de tempo, pois a metodologia de trabalho adotada foi a Iterativa, onde as atividades não têm tempos tão definidos e podem sofrer variações de acordo com a necessidade e demanda. Portanto, a tabela abaixo traz modificações no que se diz respeito às atividades realizadas e por quem. Uma vez que, algumas das atividades não foram realizadas por não terem sido mais necessárias. 6
  • 7. Cronograma EDAV OBS1 : A criação do Flash foi prejudicada devido ao fato do cliente não ter entregue em tempo hábil os vídeos para que fosse realizada a sua criação. Documentação: Foi feita durante todo o processo de desenvolvimento do projeto, principalmente após a utilização da metodologia SCRUM, onde é necessário que se registre todas as reuniões e sejam agendadas as tarefas, onde são gerados relatórios de cada etapa. Arquitetura: Foi realizada durante o início do projeto, a construção do fluxograma, sitemap e wireframe, dando base para a fundamentação do layout. Layout: A parte gráfica do site foi elaborada em sua maior parte no início, mas durante os sprints foram sendo modificadas, sendo adicionados novos elementos, ícones e novos temas, assim como o estudo cromático para servir de base para sua construção. 7
  • 8. CMS: O uso de CMS limitou-se ao fórum e galeria do site, provendo duas ferramentas já consolidadas no mercado, que oferecem todas as características necessárias para suprir as necessidades dos visitantes do EDAV. Implementação: Momento em que foi feita toda a parte de finalização e programação do site, dando vida ao Layout. Durou a maior parte de todo o processo devido à alta complexidade dos objetivos a serem atingidos. Foi feita toda uma área de gerenciamento para uma maior conveniência e praticidade dos admistradores a gerenciar o site, uma migração do modelo de fórum antigo para uma mais nova, e a instalação de um CMS para a galeria. Alem disso, foi feito um sistema de busca interno da página, e arquivamento de notícias em um menu sanfona para um fácil acesso as mesmas. Testes: Foram realizados testes com alunos de Web e alunos de outros cursos da faculdade Marista, com intuito de identificar erros e colher sugestões para melhorias no site. 8
  • 9. Relatório do Briefing O EDAV (Esquadrão de Demonstração Aérea Virtual) é um grupo de simulação virtual, criado em 1998, com o objetivo de simular o EDA (Esquadrilha da Fumaça). O site apresenta como objetivo principal a divulgação do esquadrão, por meio de notícias, vídeos e fotos de eventos relacionados tanto ao esquadrão quanto à assuntos pertinentes à aviação. Contém também um fórum que serve como espaço para os usuários trocarem idéias sobre o EDAV, simuladores de voo e aviação em geral. Fórum esse que também serve como meio de comunicação dos membros do EDAV, por meio de uma área restrita. Tem o seu público alvo dividido em dois grupos: pessoas que usam simuladores de voo e os internautas em geral que gostam de aviação e querem saber um pouco mais sobre o assunto. As cores do EDAV são as mesmas da pintura da fuselagem do avião (cores da bandeira do Brasil). No site não há a necessidade de se prender a essas cores, ficando livre o uso das demais cores. Todavia é recomendado seu uso, nem que seja em detalhes, para remeter ao esquadrão. O EDAV possuía um site, apesar de estar atualmente usando apenas o fórum. Dentre o conteúdo que o site apresentava anteriormente está: EDAV (o que é), Fumaceiros (pilotos), Parceiros, Sala de Imprensa, Fotos, Vídeos, Downloads e Recrutamento além do fórum. Tendo as seções de fotos e vídeos como as mais importantes e procuradas. Sendo assim, o cliente deseja uma grande chamada para qualquer atualização dessas seções, além de pequenas notas das últimas notícias. Quanto ao conteúdo, este será todo fornecido pelo cliente, tanto o escrito, quanto as fotos e vídeos, ficando a nosso encargo apenas a inserção do conteúdo nas páginas. Os vídeos serão disponibilizados por meio de sites especializados em hospedagem de arquivos como o Rapidshare e 4Shared enquanto para as fotos pode ser criada uma galeria no próprio site sem problemas. As tecnologias a serem utilizadas no site ficaram a critério da equipe, porém, como requisitado a utilização de um CMS pela cadeira de DPAW, será essa a tecnologia utilizada na criação do site. Há alguns sites similares que o cliente nos passou: - Blue Angels (http://www.virtualblueangels.net); - Thunder Birds (http://www.virtualthunderbirds.com); - Blue Comets (http://bluecomets.winnerbb.com). Porém houve o alerta de não usar os sites referidos como modelo de inspiração para a construção do novo site. O entrevistado nesse briefing foi o professor Dino Lincoln (dino@dino.eti.br). 9
  • 10. Tópicos da Arquitetura Fluxo de Navegação do Site Legenda dos Números 1- Home 5- EDAV 9- Recrutamento 13- Notícias Internas 2- Galeria 6- Fumaceiros 10- Downloads 14- Profile 3- Fórum 7- Parceiros 11- Vídeos 15- Resultado 4- Notícias 8- Imprensa 12- Busca 16- Mostra os links das notícias que correspondem aos critérios de busca Legenda de Símbolos Página Múltiplas páginas Mostra conteúdo de acordo com um parâmetro Fluxo duplo Retorno impedido Fluxo Único 10
  • 11. Fluxo de Navegação do Gerenciamento Legenda dos Números 1- Home 4- Depoimentos 7- Imprensa 10- Modificar senha 2- Destaques 5- Fumaceiros 8- Vídeos 11- Usuários 3- Notícias 6- Home (Site) 9- Recrutamento Legenda de Símbolos Página 11
  • 12. Sitemap 12
  • 13. Descrição conceitual e justificativa da proposta gráfica A principal idéia do projeto é trazer um redesign do site deixando-o o mais próximo possível das características do que realmente seria o EDAV, uma simulação ambiente virtual. Dentro desses parâmetros, inserir o conteúdo de forma organizada, facilitando assim a associação dos elementos internos, seja imagens ou textos. Com base nos estudos feitos em sala de aula, alguns aspectos foram levando em consideração, como as cores, dentro do padrão criado num estudo cromático (ver anexo II). A questão tipográfica visou a legibilidade, com um bom conforto visual proporcionado pelo tipo de fonte, contraste e opção de aumentar e diminuir o tamanho, para facilitar uma boa leitura, tornando-a menos cansativa. As imagens utilizadas foram selecionadas para que a harmonia entre as cores fossem presentes, como também não desviasse do foco, o EDAV. 13
  • 14. Sistema (Product Backlog) Dead Line Retrospection: 07 de Junho de 2009 Entrega da documentação do projeto: 08 de Junho de 2009 Apresentação do projeto: 10 de junho de 2009 Stories • Re-design do site da EDAV - Arquitetura da informação - Documentação - Criação do wireframe - Criação do layout - Finalização em XHTML e CSS - Implementação em PHP - Integração com o banco de dados - Criação do sistema de gerenciamento do site - Atualização do fórum - Implementação da galeria - Construção dos flash’s - Realização de testes Sprints O uso da metodologia de desenvolvimento SCRUM só foi adotada dia 11 de maio, sendo o planejamento e a arquitetura da informação e parte do wireframe, layout e finalização das páginas tendo sido feitas antes do primeiro sprint. Foram utilizados quatro sprints com duração de uma semana cada, sendo em cada semana utilizados 6 dias de trabalho. Envolvidos Product Owner: Dino Lincoln Scrum Master: Marcos (Sprint 02) André (Sprint 03) Altamir (Sprint 04) Scrum Team: Altamir (Designer) André (Implementador) Marcos (Finalizador) Descrição do Projeto Este projeto tem como objetivo propor melhorias ao site atual da EDAV, através do re- design da página e uma re-estruturação do conteúdo, trazendo novas funcionalidades e praticidade ao usuário que acessá-lo. Utilizar-se-á novas tecnologias para obter um melhor desempenho e suprir necessidades atuais, tais como exibição de vídeos em streaming e galeria dinâmica, coisas que a pouco tempo atrás era inviável. Fazendo assim, uma atualização tecnológica mais que necessária. Também, pretende-se deixar o site com uma identidade visual mais agradável, para que o visitante identifique que se trata do esquadrão virtual EDAV, e possa melhor se informar 14
  • 15. sobre o mesmo, uma vez que o site atual não oferece quase nenhuma funcionalidade, apenas um link para o fórum. Sprint Backlog Sprint 01 Nome Disponibilidade Horas Semanais Seg Ter Qua Qui Sex Sab Altamir da Silva 20 Horas (4 h/d) x x x x x André Alves 36 Horas (6 h/d) x x x x x x Marcos Spinelli 36 Horas (6 h/d) x x x x x x Stories » André: - Documentação - Finalização em XHTML e CSS - Implementação em PHP - Banco de dados MySQL - Sistema de gerenciamento do site - Atualização do fórum - Implementação da galeria » Marcos: - Documentação - Finalização em XHTML e CSS - Sistema de gerenciamento do site - Atualização do fórum - Implementação da galeria » Altamir: - Documentação - Desenvolvimento wireframe - Desenvolvimento do Layout - Tratamento das imagens Tasks » André: - Migração HTML para PHP (1 hora) - Sistema de Depoimentos (3 horas) - Sistema de Login (6 horas) - Sistema de Notícias (6 horas) - Sistema de Recrutamento (2 horas) - Sistema de Usuários (3 horas) - Instalação e Configuração do Fórum (3 horas) - Instalação e Configuração da Galeria (3 horas) - Product Backlog (2 horas) - Sprint Review (1 horas) - Elaboração do Documento de Acompanhamento (1 hora) » Marcos: - Elaboração do Product Backlog (2 horas) - Elaboração do Documento de Acompanhamento (1 hora) - Finalização de envio de Notícias [Gerenciamento] (2 horas) - Finalização do Envio de Depoimentos [Gerenciamento] (1 hora) 15
  • 16. - Finalização da página de Noticias (3 horas) - Ajustes Padding e Margin (1 hora) - Finalização da página de Recrutamento (4 horas) - Criação de jQuery (3 horas) - Re-Fazer o CSS de Parceiros (2 horas) - Edição da página de Imprensa (1 hora) - Ajustes CSS do formulário (2 horas) - Finalização da página de Downloads (2 horas) - Edição da página de gerenciamento (2 horas) - Finalização da página de fumaceiros (4 horas) - Ajustes dos ícones de Parceiros (2 horas) - Criação das Setas do H1 (1 hora) - Criação do Layout do Gerenciamento (3 horas) » Altamir: - Criação do wireframe (6 horas) - Estudo cromático (3 horas) - Criar e/ou editar imagens (1 hora) - Tratar imagens do EDAV (2 horas) - Adequar cores do fórum ao EDAV (1 hora) - Editar layout do fórum tendo em vista as cores (3 horas) - Gerenciamento (todos) - Elaboração do Documento de Acompanhamento (todos) - Utilização do Gerenciador Online de Projetos Zoho (todos) Stand Up Altamir Ontem Hoje Amanhã Seg - Ajuste Wireframe - Ajuste Wireframe - home - downloads - edav - imprensa - fumaceiros - notícias Ter - Ajuste Wireframe - Tratamento de - Ajustes do EDAV - downloads imagens layout - imprensa - Ajustes do EDAV - notícias - notícias layout - imprensa - home - downloads - edav Qua - Ajustes do EDAV - Alterações internas - Ajustes do EDAV layout layout - internas Qui - Ajustes do EDAV - Adequar cores para layout fórum - notícias - escolha das cores - imprensa - downloads Sex Sab - cores do layout fórum André Ontem Hoje Amanhã Seg - Product Backlog - Stand Up - Sprint Backlog - Instalação e - Stand Up configuração do fórum - Migrar área (x) administrativa de HTML - Instalação e para PHP configuração da 16
  • 17. - Programação do galeria (x) sistema de - Elaboração do Depoimentos Documento de Acompanhamento Ter - Product Backlog - Stand Up - Stand Up - Sprint Backlog - Finalização da página - Programação do - Stand Up de Recrutamento sistema de Usuário - Migrar área (Gerenciamento) - Programação do administrativa de HTML - Programação do sistema de Login (x) para PHP sistema de - Programação do Recrutamento sistema de - Elaboração do Depoimentos Documento de Acompanhamento Qua - Stand Up - Stand Up - Stand Up - Finalização da página - Finalização da página - Re-estruturação do de Recrutamento de Usuário sistema (Gerenciamento) (Gerenciamento) - Programação do - Programação do sistema de sistema de Usuário Recrutamento - Criação do JQuery para exibir e ocultar conteúdo - Edição gerenciador de depoimentos (Gerenciamento) Qui - Stand Up - Stand Up - Stand Up - Finalização da página - Re-estruturação do - Programação do de Usuário sistema sistema de Mudança (Gerenciamento) - Implementação do de Senha - Programação do depoimento na Home sistema de Usuário - Criação do JQuery para exibir e ocultar conteúdo - Edição gerenciador de depoimentos (Gerenciamento) Sex - Stand Up - Stand Up - Stand Up - Re-estruturação do - Finalização da página sistema de Mudança de Senha - Implementação do (Gerenciamento) depoimento na Home - Programação do sistema de Mudança de Senha (*) Sab - Stand Up - Stand Up - Stand Up - Finalização da página - Instalação do plugin - Sprint Backlog de Mudança de Senha do JQuery para manter - Programação do (Gerenciamento) altura das colunas sistema de Login - Programação do iguais (Gerenciamento) - Testes no sistema de sistema de Mudança de - Sprint Review Mudança de Senha Senha Marcos Ontem Hoje Amanhã Seg - Product Backlog - Stand Up - Sprint Backlog - Finalização da página - Stand Up de Recrutamento - Ajustes Home - Ajustes Notícias 17
  • 18. - Finalização de Envio - Ajustes de Padding e de Notícias Margin (Gerenciamento) - Elaboração do - Finalização do Envio Documento de de Depoimentos Acompanhamento (Gerenciamento) - Finalização da pagina de Noticias Ter - Stand Up - Stand Up - Stand Up - Ajustes Home - Finalização da página - Finalização da página - Finalização de Envio de Recrutamento de Recrutamento de Notícias - Ajustes Notícias (Gerenciamento) (Gerenciamento) - Ajustes de Padding e - Criação do jQuery da - Finalização do Envio Margin box de Depoimentos - Elaboração do - ajustes jQuery (Gerenciamento) Documento de - Re-Fazer o CSS de - Finalização da pagina Acompanhamento parceiros de Noticias - Ajuste dos icones dos Parceiros Qua - Stand Up - Stand Up - Stand Up - Finalização da página - Finalização da página - Edição da página de de Recrutamento de Recrutamento Imprensa - Ajustes Notícias (Gerenciamento) - Ajustes CSS dos - Ajustes de Padding e - Criação do jQuery da formulários Margin box - Edição gerenciador - Elaboração do - ajustes jQuery de depoimentos Documento de - Re-Fazer o CSS de - Finalização da página Acompanhamento parceiros de Downloads - Ajuste dos icones dos - Elaboração do Parceiros Product Backlog Qui - Stand Up - Stand Up - Stand Up - Finalização da página - Edição da página de - Finalização da página de Recrutamento Imprensa de Usuário (Gerenciamento) - Ajustes CSS dos (Gerenciamento) - Criação do jQuery da formulários - Edição da página de box - Edição gerenciador de gerenciamento - ajustes jQuery depoimentos Notícias - Re-Fazer o CSS de - Finalização da página - Finalização da página parceiros de Downloads de Fumaceiros - Ajuste dos icones dos - Elaboração do Product Parceiros Backlog Sex - Stand Up - Stand Up - Stand Up - Edição da página de - Finalização da página - Finalização da página Imprensa de Usuário de Fumaceiros - Ajustes CSS dos (Gerenciamento) - Finalização da página formulários - Edição da página de de Downloads - Edição gerenciador de gerenciamento Notícias - Ajustes CSS do depoimentos - Finalização da página formulário de - Finalização da página de Fumaceiros Recrutamento de Downloads - Elaboração do Product Backlog Sab - Stand Up - Stand Up - Stand Up - Finalização da página - Finalização da página - Sprint Backlog 18
  • 19. de Usuário de Fumaceiros - Ajustes Login de (Gerenciamento) - Finalização da página Gerenciamento - Edição da página de de Downloads - Ajustes na página de gerenciamento Notícias - Ajustes CSS do Recrutamento. - Finalização da página formulário de - Finalização da página de Fumaceiros Recrutamento de Downloads - Sprint Review Sprint Review » Altamir: A princípio a dificuldade em encontrar um modelo de CMS que adequasse as nossas necessidades levou a um atraso na elaboração do projeto de certa forma, mas foi contornado a tempo. Com isso o layout não pode ser repassado com maior tempo, haja vista a espera em encontrar o melhor CMS. Mesmo neste intervalo existiram idéias e aos poucos foram tomando forma de acordo com as colocações do “Product Owner”. Enfim, foi criado o Wireframe e desenvolvido mesmo assim, e sendo alterado a cada novo encontro. A partir daí, o layout também começou a ser encaminhado a sua formatação, estrutura e cores, com base no que foi respondido no questionário criado para obter informações sobre o projeto, na arquitetura da informação. O layout foi sendo criado e repassado aos poucos para a implementação e consequentemente a programação. Neste intervalo existiram tratamentos de imagens, além de criações e edições das mesmas. Adaptação das cores no site do EDAV e também a escolha para o fórum, com re-criações de imagens com outro aspecto sendo voltado as cores do EDAV. Todos os trabalhos existentes que envolvem na confecção do layout. Salientando que no decorrer do projeto foi utilizada uma metodologia na tentativa de deixar claro cada passo do projeto, bem como delimitar tarefas aos membros e integrar o grupo, chamada SCRUM. » André: Nesse sprint foram realizadas as seguintes tarefas: Product e Sprint Backlogs, Finalização da página de Mudança de Senha (Gerenciamento), Finalização da página de Recrutamento (Gerenciamento), Finalização da página de Usuário (Gerenciamento), Edição gerenciador de depoimentos (Gerenciamento), Criação do JQuery para exibir e ocultar conteúdo (Gerenciamento), Instalação do plugin do JQuery para manter altura das colunas iguais (Gerenciamento), Migrar área administrativa de HTML para PHP, Programação do sistema de Recrutamento, Programação do sistema de Usuário, Programação do sistema de Depoimentos, Implementação do depoimento na Home, Re- estruturação do sistema. A re-estruturação do sistema consistiu na separação dos códigos referentes às ações (adição, edição e eliminação) dos scripts presentes na área de gerenciamento do site. Visando um melhor desempenho e uma maior facilidade na criação e edição dos códigos. As ações, antes presentes no próprio arquivo de exibição do formulário, foram divididas em diferentes arquivos. Trazendo assim os benefícios supracitados. Algumas tarefas encontram-se de forma incompleta como: Programação do sistema de Mudança de Senha (sem testes realizados pela falta do sistema de login), Programação do sistema de Login (parte de login encontra-se incompleta, sem testes realizados). E algumas tarefas planejadas para esse sprint foram adiadas: Programação e Implementação do sistema de Notícias (página do sistema encontra-se incompleta), 19
  • 20. Instalação e configuração do fórum e da galeria (problemas no servidor de hospedagem impediram a realização das tarefas). O atraso em algumas das tarefas deve-se principalmente ao fato da falta de páginas já completas para serem realizadas a finalização e programação dos sistemas, tendo assim que demandar certo tempo para a criação e finalização das mesmas, e assim seguir com o trabalho previsto no Sprint Backlog. » Marcos: Foram realizadas as seguintes tarefas neste primeiro Sprint: - Ajustes na Home - Finalização de Envio de Notícias (Gerenciamento) - Finalização do Envio de Depoimentos (Gerenciamento) - Finalização da pagina de Noticias - Finalização da página de Recrutamento - Ajustes Notícias - Ajustes de Padding e Margin - Elaboração do Documento de Acompanhamento - Finalização da página de Recrutamento (Gerenciamento) - Criação do jQuery da box - Ajustes jQuery - Re-Fazer o CSS de parceiros - Ajuste dos icones dos Parceiros - Edição da página de Imprensa - Ajustes CSS dos formulários - Edição gerenciador de depoimentos - Finalização da página de Downloads - Elaboração do Product Backlog - Finalização da página de Usuário (Gerenciamento) - Edição da página de gerenciamento Notícias - Finalização da página de Fumaceiros - Finalização da página de Downloads - Ajustes CSS do formulário de Recrutamento Algumas atividades não foram registradas no Sprint, pois a metodologia SCRUM passou a ser utilizada com o projeto já em andamento, quando o código de marcação HTML, e a base do CSS já estava pronta, assim como algumas páginas já implementadas. Como o Layout estava atrasado, optei por adiantar o máximo possível para não ficar ocioso, porém, mesmo assim foi necessário o re-trabalho em algumas páginas por mudanças do que se havia planejado inicialmente. Alguns ajustes no código também foram necessários para que houvesse uma melhor integração com o PHP, alem da correção de bugs aparentes, detectados mesmo sem ter sido feito testes para este fim. Algumas páginas já finalizadas poderão sofrer futuros ajustes em Sprints posteriores devido a novas idéias ou necessidades para integração com o PHP, e serão feitas conforme necessário, mesmo que não sejam previstas inicialmente. SPRINT 02 Nome Disponibilidade Horas Semanais Seg Ter Qua Qui Sex Sab Altamir da Silva 20 Horas (4 h/d) x x x x x André Alves 36 Horas (6 h/d) x x x x x x Marcos Spinelli 36 Horas (6 h/d) x x x x x x 20
  • 21. Stories » André: - Documentação - Finalização em XHTML e CSS - Implementação em PHP - Banco de dados MySQL - Sistema de gerenciamento do site » Marcos: - Documentação - Finalização em XHTML e CSS - Sistema de gerenciamento do site » Altamir: - Alteração de layout - Estudo prévio do layout (galeria) - Edição de cores Tasks » André: - Sistema de Fumaceiros (6 horas) - Sistema de Login (4 horas) - Sistema de Notícias (2 horas) - Sistema de Busca (6 horas) - Implementação das Notícias na Home (1 hora) - Implementação da página de Notícias (2 horas) - Implementação da página de Fumaceiros (2 horas) - Implementação de Feedbacks (Gerenciamento) (2 horas) - Validação do Formulário (6 horas) - Teste do sistema de Mudança de Senha (1 hora) - Sprint Review (1 hora) - Documentação do projeto (2 horas) » Marcos: - Elaboração do Product Backlog (2 horas) - Ajustes Login de Gerenciamento (2 horas) - Ajustes na página de Recrutamento (1 hora) - Ajustes Padding Fumaceiros (1 hora) - Finalização da página de Downloads (2 horas) - Finalização da Página de Gerenciamento de Destaques (3 horas) - CSS do fórum (2 horas) - Finalização da página de Vídeos (3 horas) - Correção de Bugs Gerais (4 horas) - jQuery Lightbox (2 horas) - Ajustes sessão de arquivo das páginas: Notícias, Imprensa e Vídeos (3 horas) - Ajustes Formulário de Recrutamento (2 horas) - Tentativa de por focus no Checkbox via Js no Firefox (2 horas) - Finalização da página de resultados de busca (3 horas) - Criação do Tema da Tarde (2 horas) - Criação do Tema da Noite (2 horas) » Altamir: - Ajustes no Layout do site EDAV (7 horas) - Busca do fórum adequado ao site EDAV (2 hora) - Busca da galeria adequada ao site EDAV (1 hora) - Instalação dos programas para edição do Fórum (30 min) - Instalação dos programas para edição do Fórum (30 min) 21
  • 22. - Edição das cores do Layout (fórum) (6 horas) - Edição das cores do Layout (galeria) (2 horas) Stand Up Altamir Ontem Hoje Amanhã Seg - Ajuste Layout EDAV - Ajuste Layout EDAV - alinhamentos - alinhamento - home - downloads - imprensa - edav - notícias - fumaceiros Ter - Ajustes pags. internas - Ajustes pags. internas - Busca do fórum - Busca da galeria - instalação dos prog. Qua - Busca do fórum - imprevisto - Busca da galeria - instalação dos prog. Qui - Busca da galeria - Estudo das cores - instalação dos prog. (fórum) - Inserir cores Sex Sab - Novas cores para estudo (fórum) - Estudo das cores (galeria) - Inserir cores André Ontem Hoje Amanhã Seg - Stand Up - Stand Up - Stand Up - Instalação do plugin - Sprint Backlog - Re-estruturação do do JQuery para manter - Programação do sistema altura das colunas sistema de Login - Finalização da página iguais (Gerenciamento) - Testes no sistema de de edição de Usuário - Sprint Review Mudança de Senha (Gerenciamento) - Finalização da página de edição de Notícias (Gerenciamento) - Finalização da página de edição de Depoimentos (Gerenciamento) Ter - Stand Up - Stand Up - Stand Up - Sprint Backlog - Re-estruturação do - Instalação do JQuery - Programação do sistema wysiwyg no sistema sistema de Login - Finalização da página de Notícias - Testes no sistema de de edição de Usuário - Implementação de Mudança de Senha (Gerenciamento) Feedbacks - Adaptar páginas ao - Finalização da página (Gerenciamento) Login de edição de Notícias - Customização do (Gerenciamento) template do Fórum - Finalização da página de edição de Depoimentos (Gerenciamento) 22
  • 23. Qua - Stand Up - Stand Up - Stand Up - Re-estruturação do - Instalação do JQuery - Finalização da página sistema wysiwyg no sistema de de Fumaceiros - Finalização da página Notícias (Gerenciamento) de edição de Usuário - Implementação de - Programação do (Gerenciamento) Feedbacks sistema de Fumaceiros - Finalização da página (Gerenciamento) - Implementação das de edição de Notícias - Customização do Notícias na Home (Gerenciamento) template do Fórum - Implementação da - Finalização da página página de Notícias de edição de Depoimentos (Gerenciamento) Qui - Stand Up - Stand Up - Stand Up - Instalação do JQuery - Finalização da página - Implementação da wysiwyg no sistema de de Fumaceiros página de Fumaceiros Notícias (Gerenciamento) - Implementação da - Implementação de - Programação do página de Notícias Feedbacks sistema de Fumaceiros (Gerenciamento) - Implementação das - Customização do Notícias na Home template do Fórum - Implementação da página de Notícias Sex - Stand Up - Stand Up - Stand Up - Correção de Bugs - Finalização da página - Implementação da gerais de Fumaceiros página de Fumaceiros (Gerenciamento) - Implementação da - Programação do página de Notícias sistema de Fumaceiros - Implementação das Notícias na Home - Implementação da página de Notícias Sab - Stand Up - Stand Up - Stand Up - Finalização da página - Implementação da - Sprint Review de Fumaceiros página de Fumaceiros - Documentação do (Gerenciamento) - Implementação da Projeto - Programação do página de Notícias - Validação do lado sistema de Fumaceiros - Otimização do CSS cliente - Implementação das (Gerenciamento) - Validação do lado Notícias na Home servidor - Implementação da página de Notícias Dom - Stand Up - Stand Up - Stand Up - Implementação da - Sprint Review - Sprint Backlog página de Fumaceiros - Documentação do - Documentação do - Implementação da Projeto Projeto página de Notícias - Validação do lado - Sistema de busca - Otimização do CSS cliente - Continuação da (Gerenciamento) - Validação do lado validação do lado servidor cliente - Continuação da validação do lado servidor 23
  • 24. Marcos Ontem Hoje Amanhã Seg - Stand Up - Stand Up - Stand Up - Finalização da página - Sprint Backlog - Ajustes Padding de Fumaceiros - Ajustes Login de Fumaceiros - Finalização da página Gerenciamento - Finalização da Página de Downloads - Ajustes na página de de Downloads - Ajustes CSS do Recrutamento formulário de Recrutamento Ter - Stand Up - Stand Up - Stand Up - Sprint Backlog - Ajustes Padding - CSS do Fórum - Ajustes Login de Fumaceiros - Finalização da Página Gerenciamento - Finalização da Página de Vídeos - Ajustes na página de de Downloads - Implementação da Recrutamento Página de Gerenciamento de Destaques Qua - Stand Up - Stand Up - Stand Up - Ajustes Padding - CSS do Fórum - jQuery Lightbox Fumaceiros - Finalização da Página - Ajustes na sessão de - Finalização da Página de Vídeos Arquivo das páginas de Downloads - Implementação da de Notícias, Imprensa Página de e Videos Gerenciamento de Destaques (x) Qui - Stand Up - Stand Up - Stand Up - CSS do Fórum - jQuery Lightbox - Ajustes do - Finalização da Página - Ajustes na sessão de Formulário de de Vídeos Arquivo das páginas de Recrutamento - Implementação da Notícias, Imprensa e - Tentativa de por Página de Videos focus no Checkbox via Gerenciamento de js no Firefox Destaques (x) - Finalização da Página de Resultado de Busca Sex - Stand Up - Stand Up - Stand Up - jQuery Lightbox - Ajustes do Formulário - Criação de Tema da - Ajustes na sessão de de Recrutamento Tarde Arquivo das páginas de - Tentativa de por focus - Criação de Tema da Notícias, Imprensa e no Checkbox via js no Noite Videos Firefox (x) - Finalização da Página de Resultado de Busca Sab - Stand Up - Stand Up - Stand Up - Ajustes do Formulário - Criação de Tema da - Sprint Backlog de Recrutamento Tarde - Criação de Tema da - Tentativa de por focus - Criação de Tema da Noite no Checkbox via js no Noite (x) - Implementação da Firefox (x) - Sprint Review Página de - Finalização da Página Gerenciamento de de Resultado de Busca Destaques 24
  • 25. Sprint Review » Altamir: O sprint 2 foram feitas de início ajustes no qual faltavam ter no site, com relação ao layout (PSD) onde consumiu o bom tempo. Foi feita buscas de um fórum, bem como de uma galeria que estivesse adequada as necessidades e aparência no qual o site EDAV precisava. Sendo feita essa busca, a parte de sua instalação e um estudo das possíveis mudanças necessárias que ainda por ventura existiram. Após determinado onde iriam ser as modificações, o layout foi tomando forma dentro de todo um estudo cromático voltado ao EDAV e as novas alterações nas cores vieram dentro do fórum. Como não tenho um conhecimento aprimorado do CSS, tive dificuldades em buscar determinadas cores no fórum, para serem alteradas, perdendo tempo. Com relação a galeria foi apenas dado uma vista por cima, não tendo de início um foco para ele. Para atrapalhar o andamento do projeto, nesta semana existiram quedas de energia e até mesmo a sua falta em alguns dias na Faculdade, levando a um comprometimento no mesmo. » André: Nesse sprint foram realizadas as seguintes tarefas: Stand Up’s, Sprint Backlog e Sprint Review, Programação do sistema de Login, Testes no sistema de Mudança de Senha, Adaptar páginas ao Login, Customização do template do Fórum, Re-estruturação do sistema, Finalização da página de edição de Usuário (Gerenciamento), Finalização da página de edição de Notícias (Gerenciamento), Finalização da página de edição de Depoimentos (Gerenciamento), Instalação do JQuery wysiwyg no sistema de Notícias, Implementação de Feedbacks (Gerenciamento), Customização do template do Fórum, Correção de Bugs gerais, Finalização da página de Fumaceiros (Gerenciamento), Programação do sistema de Fumaceiros, Implementação das Notícias na Home, Implementação da página de Notícias, Implementação da página de Fumaceiros, Implementação da página de Notícias, Otimização do CSS (Gerenciamento), Documentação do Projeto, Validação do lado cliente, Validação do lado servidor. Em decorrência de imprevistos ocorridos durante a semana, como a falta de energia, tanto pela manhã, quanto pela tarde, em dias diversos, e também alguns bugs ocasionados por razões desconhecidas, as stories previstas para esse sprint não puderam ser todas cumpridas, ficando assim algumas adiadas para o próximo sprint. Na tentativa de contornar os problemas causados por esses fatos inesperados, decidi compensar algum tempo trabalhando também no domingo, mas mesmo assim não foi possível suprir todo o tempo perdido, ficando assim as partes de validação incompletas e o sistema de busca totalmente adiado par ao próximo sprint. Algumas partes do sistema de gerenciamento deixaram de ser feitas por falta de conteúdo, tendo os mesmos não sendo sido passado pelo cliente, ficando marcada para a próxima semana uma reunião para sanar as dúvidas em relação a essas partes. Será também solicitado ao cliente liberação de espaço no servidor, para serem realizados testes no próprio servidor. Já a re-estruturação realizada nesse sprint, visou uma melhora na manutenção do código, foram separadas as páginas de adição e edição de conteúdo. Porém a maior mudança foi mesmo na parte de código. O site antes desenvolvido em PDO, passou a usar conexões MySQL comuns. A mudança foi feita principalmente, devido ao fato do servidor não disponibilizar essa tecnologia, e ao tentar contato com o mesmo o problema não foi sanado. » Marcos: Foram realizadas as seguintes tarefas neste segundo Sprint: 25
  • 26. - Ajustes Login de Gerenciamento - Ajustes na página de Recrutamento - Ajustes Padding Fumaceitos - Finalização da Página de Downloads - Implementação da Página de Gerenciamento de Destaques - CSS do Fórum - Finalização da Página de Vídeos - Correção e BUGS gerais - jQuery Lightbox - Ajustes na sessão de Arquivo das páginas de Notícias, Imprensa e Videos - Ajustes do Formulário de Recrutamento - Tentativa de por focus no Checkbox via js no Firefox - Finalização da Página de Resultado de Busca - Criação de Tema da Tarde - Criação de Tema da Noite Devido a algumas eventualidades, como um bug geral que deu nos computadores em que trabalhávamos e faltas de energia durante algumas tardes na faculdade, algumas atividades saíram fora do cronograma planejado para elas, gerando atrasos e metas não conseguiram ser completamente cumpridas neste sprint, devendo ser contornadas no próximo sprint. A tentativa de por focus no js no firefox foi infeliz, e depois de inúmeras tentativas desisti de tentar implementar este feature. As atividades incompletas ou atrasadas estão marcadas com um xis (x). SPRINT 03 Nome Disponibilidade Horas Semanais Seg Ter Qua Qui Sex Sab Altamir da Silva 20 Horas (4 h/d) x x x x x André Alves 36 Horas (6 h/d) x x x x x x Marcos Spinelli 36 Horas (6 h/d) x x x x x x Stories » André: - Documentação - Finalização em XHTML e CSS - Implementação em PHP - Banco de dados MySQL - Sistema de gerenciamento do site » Marcos: - Documentação - Finalização em XHTML e CSS - Sistema de gerenciamento do site » Altamir: - Documentação - Ajustes layout - Edição de cores e imagens Tasks » Altamir: - Adequação do Layout (fórum) (6 horas) - Adequação do Layout (galeria) (6 horas) - Edição de pequenos ícones (4 horas) 26
  • 27. » Andre: - Validação do Formulário (3 horas) - Sistema de Busca (3 horas) - Sistema de Vídeos (5 horas) - Sistema de Imprensa (5 horas) - Implementação da página de Vídeos (3 horas) - Implementação da página de Imprensa (3 horas) - Template do Fórum (4 horas) - Template da Galeria (3 horas) - Sprint Review (1 hora) - Documentação do projeto (2 horas) » Marcos: - Elaboração da Documentação do Projeto (2 horas) - Elaboração do Product Backlog (2 horas) - Criação do Tema Noite (2 horas) - Finalização página de Destaques [gerenciamento] (2 horas) - Ajustes do Menu Horizontal (1 hora) - Finalização da caixa de sing up no gerenciamento (1 hora) - Mudança do CSS de gerenciamento (2 horas) - Position do logo EDAV (1 hora) - Finalização do Lightbox (2 horas) - Ajustes CSS da página de busca [manha, tarde e noite] (2 horas) - Ajustes da página EDAV (1 hora) - Ajustes página Fumaceiros (2 horas) - Finalização da página de Parceiros [gerenciamento] (3 horas) - Finalização da Página de Imprensa (2 horas) - Finalização do Lytebox na página de Fumaceiros (1 hora) - Finalização de Acessibilidade [Tamanho de Fonte A+A-] (1 hora) - Formulário (Descrição dos campos obrigatórios) (1 hora) - Ajustes do tema Manha (1 hora) - Ajustes do tema Noite (1 hora) - Ajustes do tema Tarde (1 hora) - Edição Fundo tema noite (1 hora) - Finalização da função de Imprimir página (2 horas) - Criação de Hacks para BUGS no IE7 (2 horas) Stand Up Altamir Ontem Hoje Amanhã Seg - Stand Up - Stand Up - Adequar layout - Adequar layout - (fórum) - (fórum) Ter - Stand Up - Stand Up - Stand Up - Adequar layout - Adequar layout - Adequar layout - (fórum) - (fórum) - (galeria) - Editar cores e imagens - (fórum/CSS) Qua - Stand Up - Stand Up - Stand Up - Adequar layout - Adequar layout - Editar cores, - (galeria) - (galeria) imagens - Editar cores e imagens - (fórum e galeria) - (galeria/CSS) Qui - Stand Up - Stand Up - Editar cores, imagens - Adequar layout 27
  • 28. - (fórum e galeria) - (galeria) - Editar cores e imagens - (galeria/CSS) - Edição de ícones EDAV Sex Sab - Sprint Backlog - Sprint Review - Complementação escrita do projeto André Ontem Hoje Amanhã Seg - Stand Up - Stand Up - Stand Up - Sprint Review - Sprint Backlog - Sistema de busca - Documentação do - Documentação do - Validação do lado Projeto Projeto cliente - Validação do lado - Sistema de busca - Validação do lado cliente - Validação do lado servidor - Validação do lado cliente - Customização do servidor - Validação do lado template do Fórum servidor Ter - Stand Up - Stand Up - Stand Up - Sprint Backlog - Sistema de busca - Documentação do - Documentação do - Validação do lado Projeto Projeto cliente - Sistema de busca - Sistema de busca - Validação do lado - Fazer value do - Validação do lado servidor campo de busca sumir cliente - Customização do - Customização do - Validação do lado template do Fórum template da galeria servidor - Sistema de vídeos - Customização do template do Fórum - Criação do “favico” Qua - Stand Up - Stand Up - Stand Up - Sistema de busca - Documentação do - Sistema de Vídeos - Validação do lado Projeto - Implementação da cliente - Sistema de busca página de Vídeos - Validação do lado - Value do campo de servidor busca sumir - Customização do - Customização do template do Fórum template da galeria - Customização do - Sistema de Vídeos template da Galeria Qui - Stand Up - Stand Up - Stand Up - Documentação do - Sistema de Vídeos - Implementação dos Projeto - Implementação da Destaques na Home - Sistema de busca página de Vídeos - Sistema de Imprensa - Value do campo de - Instalação dos Temas - Implementação da busca sumir - Função Tamanho da página de Imprensa - Customização do Fonte template da galeria Sex - Stand Up - Stand Up - Stand Up - Sistema de Vídeos - Implementação dos - Funcionalidade de 28
  • 29. - Implementação da Destaques na Home Impressão página de Vídeos - Sistema de Imprensa - Instalação dos Temas - Implementação da - Mudança no Tamanho página de Imprensa da Fonte Sab - Stand Up - Stand Up - Stand Up - Implementação dos - Sprint Review - Sprint Backlog Destaques na Home - Javascript para - Documentação do - Sistema de Imprensa Impressão Projeto - Implementação da - CSS para impressão página de Imprensa - Correção de Bugs IE7 Marcos Ontem Hoje Amanhã Seg - Stand Up - Stand Up - Stand Up - Criação de Tema da - Sprint Backlog - Ajustes do Menu Tarde - Criação de Tema da Horizontal - Criação de Tema da Noite - Finalização da caixa Noite (x) - Implementação da de sing up no - Sprint Review Página de gerenciamento Gerenciamento de - Mudança do CSS de Destaques gerenciamento - Elaboração da - Position do logo Documentação do EDAV Projeto Ter - Stand Up - Stand Up - Stand Up - Sprint Backlog - Ajustes do Menu - Finalização do - Criação de Tema da Horizontal Lightbox Noite - Finalização da caixa - Ajustes CSS da - Implementação da de sing up no página de busca Página de gerenciamento (manha, tarde e noite) Gerenciamento de - Mudança do CSS de - Ajustes da página Destaques gerenciamento EDAV - Elaboração da - Position do logo EDAV - Ajustes página Documentação do Fumaceiros Projeto Qua - Stand Up - Stand Up - Stand Up - Ajustes do Menu - Finalização do - Finalização do Horizontal Lightbox Lytebox - Finalização da caixa - Ajustes CSS da página - Finalização da página de sing up no de busca (manha, tarde de Parceiros gerenciamento e noite) (gerenciamento) - Mudança do CSS de - Ajustes da página - Finalização da Página gerenciamento EDAV de Imprensa - Position do logo EDAV - Ajustes página - Finalização do Fumaceiros Lytebox na página de Fumaceiros Finalização de - Acessibilidade (Tamanho de Fonte A+A-) Qui - Stand Up - Stand Up - Stand Up - Finalização do - Finalização do Lytebox - Formulário Lightbox - Finalização da página (Descrição dos campos - Ajustes CSS da página de Parceiros obrigatórios) 29
  • 30. de busca (manha, tarde (gerenciamento) - Ajustes do tema e noite) - Finalização da Página Manha - Ajustes da página de Imprensa - Ajustes do tema EDAV - Finalização do Lytebox Noite - Ajustes página na página de - Ajustes do tema Fumaceiros Fumaceiros Tarde Finalização de - Acessibilidade (Tamanho de Fonte A+A-) Sex - Stand Up - Stand Up - Stand Up - Finalização do Lytebox - Formulário (Descrição - Edição Fundo tema - Finalização da página dos campos noite de Parceiros obrigatórios) - Finalização da função (gerenciamento) - Ajustes do tema de Imprimir página - Finalização da Página Manha - Criação de Hacks de Imprensa - Ajustes do tema Noite para BUGS no IE7 - Finalização do Lytebox - Ajustes do tema Tarde na página de Fumaceiros Finalização de - Acessibilidade (Tamanho de Fonte A+A-) Sab - Stand Up - Stand Up - Stand Up - Formulário (Descrição - Edição Fundo tema - Sprint Backlog dos campos noite - Finalização da função obrigatórios) - Finalização da função de Imprimir página (x) - Ajustes do tema de Imprimir página (x) Manha - Criação de Hacks para - Ajustes do tema Noite BUGS no IE7 - Ajustes do tema Tarde Sprint Review » Altamir: Neste sprint todo o tempo gasto foi no fórum e galeria, na tentativa de unir elementos que assemelhassem entre eles próprios com o site EDAV. Porém existiram novas dificuldades na sua realização, pois muitas cores passavam pelo CSS, além de edição de imagens. Foi dado uma pequena complementação a parte escrita do projeto. Como também foram criados alguns ícones com Zoom, download e impressão. » Andre: Nesse sprint foram realizadas as seguintes tarefas: Stand Up, Sprint Review, Sprint Backlog, Documentação do Projeto, Validação do lado cliente, Validação do lado servidor, Sistema de busca, Customização do template do Fórum, Criação do “favico”, Customização do template da Galeria, Value do campo de busca sumir, Sistema de Vídeos, Implementação da página de Vídeos, Instalação dos Temas, Mudança no Tamanho da Fonte, Implementação dos Destaques na Home, Sistema de Imprensa, Implementação da página de Imprensa, Javascript para Impressão e CSS para impressão. Todas as tarefas previstas para esse sprint no Sprint Backlog foram todas cumpridas, e para aproveitar o tempo que restou, algumas tarefas adicionais foram sendo feitas, 30
  • 31. tanto com o intuito de adiantar o trabalho, quanto por decorrência de bugs ou necessidades que foram surgindo. » Marcos: Foram realizadas as seguintes tarefas no terceiro sprint: - Criação do Tema Noite - Finalização página de Destaques (gerenciamento) - Elaboração da Documentação do Projeto - Ajustes do Menu Horizontal - Finalização da caixa de sing up no gerenciamento - Mudança do CSS de gerenciamento - Position do logo EDAV - Finalização do Lightbox - Ajustes CSS da página de busca (manhã, tarde e noite) - Ajustes da página EDAV - Ajustes página Fumaceiros - Finalização do Lytebox - Finalização da página de Parceiros (gerenciamento) - Finalização da Página de Imprensa - Finalização do Lytebox na página de Fumaceiros - Finalização de Acessibilidade (Tamanho de Fonte A+A-) - Formulário (Descrição dos campos obrigatórios) - Ajustes do tema Manha - Ajustes do tema Noite - Ajustes do tema Tarde - Edição Fundo tema noite - FInalização da função de Imprimir página - Criação de Hacks para BUGS no IE7 As tarefas supracitadas foram quase que em sua totalidade cumpridas, com uma ressalva no Lightbox que por motivos não identificados não funcionou na página, talvez por incompatibilidade por algum atributo que recebia por herança, ou por conflito com os outros jQuery’s já presentes, o fato é que desisti de tentar finalizar o Lightbox e optei por buscar outras alternativas, e a solução foi o uso do Lytebox, que faz a mesma função do Lightbox, mas não utiliza a biblioteca do jQuery e sim JavaScript puro. A função de imprimir apenas o texto da página não foi concluída a tempo, passando assim para ser feita no próximo sprint. SPRINT 04 Nome Disponibilidade Horas Semanais Seg Ter Qua Qui Sex Sab Dom Altamir da Silva 20 Horas (4 h/d) x x x x x André Alves 49 Horas (7 h/d) x x x x x x x Marcos Spinelli 49 Horas (7 h/d) x x x x x x x Stories » André: - Documentação - Implementação em PHP - Banco de dados MySQL - Sistema de gerenciamento do site - Publicação do Site » Marcos: - Documentação 31
  • 32. - Sistema de gerenciamento do site - Publicação do Site » Altamir: - Documentação - Ajustes layout - Edição de cores e imagens Tasks » Altamir: - Adequação do Layout (fórum) (6 horas) - Adequação do Layout (galeria) (6 horas) - Edição de pequenos ícones (4 horas) » André: - Instalação do Fórum (1 hora) - Conversão do Fórum (1 hora) - Instalação da Galeria (1 hora) - Ponte do Fórum e Galeria (1 hora) - Finalização das Tooltips (1 hora) - Implementação da Página de Vídeos (1 hora) - Implementação da Página de Fumaceiros (3 horas) - Correção de Bugs (3 horas) - Ajustes no Banco (1 hora) - Ajustes Gerais (4 horas) - Testes de Usabilidade (2 horas) - Ajustes pós-teste (3 horas) - Sprint Review (1 hora) - Retrospection (1 hora) - Documentação do projeto (25 horas) » Marcos: - Ajustes Página de Videos (2 horas) - Construção do jQuery dos Fumaceiros (8 horas) - Arrumação de Bugs dos Fumaceiros (3 horas) - Procura de BUGS no IE7 (3 horas) - Aplicação de testes de Usabilidade (4 horas) - Fechamento da Documentação (25 horas) Stand Up Altamir Ontem Hoje Amanhã Seg - Stand Up - Stand Up - Adequar layout - Adequar layout - (fórum) - (fórum) Ter - Stand Up - Stand Up - Stand Up - Adequar layout - Adequar layout - Adequar layout - (fórum) - (fórum) - (galeria) - Editar cores e imagens - (fórum/CSS) Qua - Stand Up - Stand Up - Stand Up - Adequar layout - Adequar layout - Editar cores, - (galeria) - (galeria) imagens - Editar cores e imagens - (fórum e galeria) - (galeria/CSS) 32
  • 33. Qui - Stand Up - Stand Up - Editar cores, imagens - Adequar layout - (fórum e galeria) - (galeria) - Editar cores e imagens - (galeria/CSS) - Edição de ícones EDAV Sex Sab - Sprint Backlog - Sprint Review - Complementação escrita do projeto André Ontem Hoje Amanhã Seg - Stand Up - Stand Up - Stand Up - Sprint Review - Sprint Backlog - Documentação do - Javascript para - Documentação do projeto Impressão projeto - Finalização das - CSS para impressão - Implementação da Tooltips - Correção de Bugs IE7 Página de Vídeos - Ajustes Ter - Stand Up - Stand Up - Stand Up - Sprint Backlog - Documentação do - Documentação do - Documentação do projeto projeto projeto - Finalização das - Ajustes Gerais - Implementação da Tooltips - Ajustes no Banco Página de Vídeos - Ajustes Gerais Qua - Stand Up - Stand Up - Stand Up - Documentação do - Documentação do - Documentação do projeto projeto projeto - Finalização das - Ajustes Gerais - Implementação da Tooltips - Ajustes no Banco Página de Fumaceiros - Ajustes Gerais - Instalação do Fórum - Conversão do Fórum Qui - Stand Up - Stand Up - Stand Up - Documentação do - Documentação do - Documentação do projeto projeto projeto - Ajustes Gerais - Implementação da - Instalação da Galeria - Ajustes no Banco Página de Fumaceiros - Ponte do Fórum e - Instalação do Fórum Galeria - Conversão do Fórum - Correção de Bugs - Inserção de conteúdo faltante - Testes de Usabilidade Sex - Stand Up - Stand Up - Stand Up - Documentação do - Documentação do - Documentação do projeto projeto projeto - Implementação da - Instalação da Galeria - Ponte do Fórum e Página de Fumaceiros - Ponte do Fórum e Galeria - Instalação do Fórum Galeria - Ajustes pós-teste - Conversão do Fórum - Correção de Bugs - Inserção de conteúdo faltante - Testes de Usabilidade 33
  • 34. Sab - Stand Up - Stand Up - Stand Up - Documentação do - Documentação do - Sprint Review projeto projeto - Retrospection - Instalação da Galeria - Ponte do Fórum e - Documentação do - Ponte do Fórum e Galeria projeto Galeria - Ajustes pós-teste - Correção de Bugs - Inserção de conteúdo faltante - Testes de Usabilidade Dom - Stand Up - Stand Up - Documentação do - Publicação do Site projeto - Sprint Review - Ponte do Fórum e - Retrospection Galeria - Documentação do - Ajustes pós-teste projeto Marcos Ontem Hoje Amanhã Seg - Stand Up - Stand Up - Stand Up - Finalização da função - Sprint Backlog - Fechamento da de Imprimir página - Ajustes Página de Documentação Videos - Construção do jQuery dos Fumaceiros Ter - Stand Up - Stand Up - Stand Up - Sprint Backlog - Fechamento da - Fechamento da - Ajustes Página de Documentação Documentação Videos - Construção do jQuery - Construção do dos Fumaceiros jQuery do Fumaceitos Qua - Stand Up - Stand Up - Stand Up - Fechamento da - Fechamento da - Fechamento da Documentação Documentação Documentação - Construção do jQuery - Construção do jQuery - Arrumação de Bugs dos Fumaceiros do Fumaceitos dos Fumaceiros Qui - Stand Up - Stand Up - Stand Up - Fechamento da - Fechamento da - Fechamento da Documentação Documentação Documentação - Construção do jQuery - Arrumação de Bugs - Procura de Bugs no do Fumaceitos dos Fumaceiros IE7 - Aplicação de Testes de Usabilidade Sex - Stand Up - Stand Up - Stand Up - Fechamento da - Fechamento da - Sprint Backlog Documentação Documentação - Fechamento da - Arrumação de Bugs - Procura de Bugs no Documentação dos Fumaceiros IE7 - Aplicação de Testes de Usabilidade Sab - Stand Up - Stand Up - Stand Up - Fechamento da - Fechamento da - Fechamento da Documentação Documentação Documentação - Procura de Bugs no IE7 34
  • 35. - Aplicação de Testes de Usabilidade Dom - Stand Up - Stand Up - Fechamento da - Sprint Backlog Documentação - Fechamento da Documentação Sprint Review » Altamir: Neste final de chegada os mesmo feitos do sprint 3, com menos intensidade, uma vez que as necessidades foram ficando menores, e como não tenho conhecimento que um implementador precisa, nem tão pouco de um programador, a minha ajuda fica muito limitada. Mas o que foi proposto no layout, foram feitos como esperado. O conteúdo foi efetuado como o esperado, e dentro do prazo solicitado, o que leva a um bom desempenho no geral. O grupo teve o comprometimento nos seus respectivos limites de cada membro. » Andre: Nesse sprint foram realizadas as seguintes tarefas: Stand Up, Sprint Backlog, Documentação do projeto, Retrospection, Implementação da Página de Vídeos, Finalização das Tooltips, Ajustes Gerais, Ajustes no Banco, Implementação da Página de Fumaceiros, Instalação do Fórum, Conversão do Fórum, Instalação da Galeria, Ponte do Fórum e Galeria, Correção de Bugs, Testes de Usabilidade, Ponte do Fórum e Galeria, Ajustes pós-teste, Publicação do Site. Esse foi o último sprint e onde o projeto foi finalizado, teve suas tarefas focadas mais nas partes de documentação e ajustes no site, ajustes esses tanto pela detecção de bugs quanto pelas sugestões dos entrevistados nos testes de usabilidade. Foi aqui também que ocorreram a instalação e configuração tanto do Fórum quanto da Galeria, já no servidor, onde também foi hospedado o site. Também foram inseridos o conteúdo fornecido pelo cliente. Por ser a finalização do projeto a carga horária foi aumentada, incluímos o domingo para término do projeto e as horas diárias também sofreram aumento. Aumento esse possibilitado pelo fato dos professores liberarem as aulas da semana para conclusão do projeto. Graças a essa adição foi possível terminar o trabalho planejado para todo o sprint, terminando assim os ciclos do projeto. » Marcos: Foram realizadas as seguintes tarefas no quarto, e último, sprint: - Ajustes Página de Videos - Construção do jQuery dos Fumaceiros - Arrumação de Bugs dos Fumaceiros - Procura de BUGS no IE7 - Aplicação de testes de Usabilidade - Fechamento da Documentação Todas as tasks para este sprint foram efetuadas de acordo com o tempo previsto, variando pouco para mais ou para menos. 35
  • 36. Esse sprint foi mais focado na parte de documentação, onde foram gastos a maior quantidade de horas e de esforços, para finalizar toda a parte escrita do projeto e organizar o que já havia sido feito. Backlog Review (Restrospection) Durante toda a realização do projeto com o uso da metodologia SCRUM, cada um dos membros ficou responsável pela documentação de suas respectivas atividades, que começaram a ser catalogadas com o projeto já em andamento, pelo fato da metodologia SCRUM ter sido adotada tardiamente, não por culpa da equipe, mas por ter sido demonstrada de forma tardia. Como a metodologia em si, adota um modelo de desenvolvimento Iterativo, muitas das atividades foram reavaliadas pelos membros, editadas ou até refeitas de acordo com as necessidades iminentes. Foi o que aconteceu com o Wireframe, que sofreu uma leve modificação, depois que deixou-se de utilizar o CMS Joomla, mas não o suficiente para caracterizá-lo como o idealizado inicialmente (antes do Joomla), e o layout, que sofreu severas mudanças durante os 3 primeiros sprints, e ajustes no quarto e último. A parte de finalização e programação sofreram atrasos, devido tanto à atrasos do membro designado para a função do layout, quanto da migração de layouts de antes e pós-Joomla. Portanto foi necessário que os outros dois membros (responsáveis pela Finalização e Programação) participassem ativamente da construção do layout para que não houvesse mais atrasos, uma vez que muita coisa não podia ser finalizada e nem programada sem antes um layout, e tudo o que se tinha disponível já havia sido feito. Com boa parte do layout feita, o desenvolvimento do site começou a fluir em um bom ritmo, até a aparição de bugs, que atrasou um pouco mais o projeto, e como já havia um déficit de atraso por conta do layout, o programador teve que ajudar também na finalização, já que para programar algumas coisas já deviam estar finalizadas. Todo o planejamento que havia sido feito e mensurado no cronograma, ficou irregular devido aos atrasos, e muitas das mensurações foram adiadas. Para que o projeto fosse concluído a tempo foi necessário prolongar a carga horária de acordo com a disponibilidade dos membros, trabalhando da manhã à noite, de Segunda a Sábado, em um ritmo acelerado. O site no presente momento (07/06/2009) encontra-se finalizado, portanto há um déficit de conteúdo, devido ao cliente não ter entregue a tempo, assim como, algumas imagens de Wallpapers, Arquivos e os Flash’s que ficariam no topo, sendo então substituído por uma imagem estática. 36
  • 37. Justificativa Para: Cor Plano de fundo: Foram inseridos três planos de fundo cujos temas sofrem alterações de acordo com o horário em que o usuário está acessando. O plano de fundo que está como tema da manhã, apresenta nuvens brancas e um gradiente azul. No tema da tarde, um pôr-do-sol com gradiente de cor laranja claro para escuro, e por fim, o tema da noite, com um luar e estrelas num gradiente do preto ao azul escuro, dando uma idéia de crepúsculo. Esses são temas idealizados nas passagens naturais que a terra apresenta, bem como, nos possíveis momentos de vôo. Para representar melhor os temas descritos, segui abaixo uma imagem ilustrativa. Cor de fundo: Foi criada uma cor de fundo preta com uma opacidade menor, dando uma transparência à imagem, levando a um jogo visual de luz com o plano de fundo. Além de dar uma forma aos blocos, o mesmo passa a idéia de que estão flutuando no ar, o que também traz a sensação de harmonia e equilíbrio entre os elementos presentes. Pode-se visualizar abaixo essa junção. Cor de fonte: Foi utilizada uma cor padrão para todo o projeto, a cor branca, por ser uma cor contrastante com outras cores mais escuras, e pelo fato do site utilizar um 37
  • 38. fundo transparente preto, que possibilita pouca passagem de luz, excluindo assim a utilização das demais cores, contribuindo para um conforto visual. Paleta de Cores: As cores apresentam-se combinadas entre si, de forma que essa junção pudesse instigar o lado explorador do usuário no site através das formas utilizadas do conteúdo, dos detalhes, enfim, das pequenas criações elaboradas, ressaltando que as cores estão também embasadas nas cores que compõem o EDAV. O tema em mudança pode contribuir positivamente nas pessoas, conseqüentemente o número de acesso aumentará. São aspectos que alavancam o EDAV como um todo, por isso faz-se necessário um estudo das cores a utilizar. Com relação as cores da sua marca, não foi alterada a pedido do cliente. De acordo com os três temas (manhã, tarde, noite), foram criadas paletas de cores diferentes, salientando que se utilizou gradiente, o que apresenta um alto número de cores. Para que se tenha um entendimento sobre suas cores, a patela constará abaixo apenas suas cores predominantes. Manhã Tarde Noite OBS: A cor preta consta uma opacidade de 65% em todo o conteúdo Cores do Feedback: Foram utilizadas cores diferentes para representar mensagens de alerta ou de procedimentos bem sucedidos ao preencher/validar os formulários. Por isso foram utilizadas as cores vermelha, que estimula a pessoa a agir e demonstra que algo está errado, e a cor verde que transmite a sensação de raciocínio correto e segurança, confirmando que o procedimento foi efetuado com sucesso. Tipografia Tipo de fonte: Foi utilizada a fonte “Arial”, por ser uma fonte padrão no Windows, Mac OSX e Linux, sendo catalogada na W3C como uma das fontes padrões dos principais browsers do mercado. Por ser ma fonte sem serifa, a visualização da mesma em monitores fica facilitada, deixando o visitante com visão mais confortável. Outro motivo para utilização da fonte arial foi a questão da semiótica e semelhança, por o logo oficial da EDAV já utilizar esta fonte. Família de Fontes: O Font-Family utilizado foi : Arial, Helvetica, sans-serif; que busca no computador do visitante a fonte Arial e se não for encontrada as sucessivas, eliminando assim o problema de um reset para a fonte padrão do browser. 38
  • 39. Tamanho de Fonte: Foram utilizados diversos tamanhos de fonte, com intuito de hierarquizar os elementos, e organizar a concepção visual, facilitando o entendimento do conteúdo do site e disposição das informações. Foram utilizados o padrão de 11px para textos em parágrafos, e 14px e 13px para diferentes tipos de títulos. Imagens O que justifica utilizar as imagens encontradas no site é o fato de trazer o mais próximo possível o EDAV ao usuário, através de alguns screens do próprio simulador. Para muitos, uma boa imagem pode ser considerada o cartão de visita para adentrar nas suas páginas mais internas, como uma chamada a futuras visitas apreciativas. Diagramação A diagramação adotada no projeto foi uma diagramação considerada padrão na maioria dos sites atuais. É composta por um topo, que contém uma barra com um menu expresso e uma caixa de busca, e logo abaixo dessa barra um espaço para banners com animações em flash. Logo em seguida com a mesma largura e completamente junto, encontra-se o menu, que devido à proximidade e semelhança parece fazer parte do topo como um único elemento na página. Logo abaixo temos um espaço para o conteúdo das páginas do site, conteúdo esse que pode ser disposto de diversas formas: como um único elemento englobando todo o conteúdo, duas colunas horizontais ou dividida em boxes, como na Home e na página de Fumaceiros. Ao final da página encontramos o rodapé, que segue o mesmo estilo do topo. Essa estrutura descrita acima foi desenvolvida para monitores com resolução 800x600, não criando rolagem para visitantes desse padrão. Porém visitantes com resoluções maiores podem visualizar os elementos dessa estrutura de forma centralizada na página e perfeitamente alinhados, além de poderem ver partes do fundo ocultas em resoluções inferiores. Na área de gerenciamento o modelo é o mesmo permanecendo o topo, em menor altura e sem a área destinada ao flash, e o rodapé. O menu passa a fazer parte do conteúdo da página, que agora encontrasse sempre dividido em duas colunas, sendo a esquerda destinada ao menu e a direita ao conteúdo em si. Ícones Foram utilizados diversos ícones para que fosse possível ao usuário uma fácil identificação do conteúdo, servido como suporte para o texto, alem de ser um eyecandy (beleza aos olhos), que ajuda a compor o layout do site. Os ganhos ao usar-se ícones são grandes, pois alem de facilitar nos mapas mentais ao hierarquizar elementos, ainda embeleza o site e serve como referencia de usabilidade. Os ícones substituem a uma unidade de significado (idéia, conceito, ação…) que representada com texto ocuparia mais espaço. A principal vantagem é que mediante ícones se podem representar mais unidades utilizando um espaço menor, ou até, reforçar visualmente o sentido do texto (símbolo). Eles fazem parte integral dos elementos do site quanto ao despertar da curiosidade do usuário servindo de suporte para a definição do elemento ou quando se deseja que o usuário investigue e descubra por si mesmo o funcionamento da interface, os ícones têm um grande papel. Todavia, tivemos cuidado ao usar elementos que tivessem um significado claro, ou fossem já convencionados, já que os ícones são muito subjetivos, estão sujeitos à interpretação individual e subjetiva de cada pessoa a partir de sua experiência. Nunca são totalmente claros existe risco de ser mal-entendidos. Por esta razão, utilizamo-los mais como suporte, do que como substituto ao texto. 39
  • 40. Abaixo estão listados os ícones utilizados no site com o sua função: Cadeado Fechado: Placa de Atenção: Indica que a sessão de Chama a atenção do usuário recrutamento está fechada. para uma informação. Cadeado Aberto: Lupa: Indica que a sessão de Demonstra que o campo é de recrutamento está aberta. pesquisa. Cerquilha: Lápis: Indica a posição do Fumaceiro. Indica que o elemento pode ser editado. Seta para Baixo: X: Indica que há um nível abaixo no Indica que o elemento pode menu. ser deletado. Seta inclinada: Impressora: Ajuda a hierarquizar um título. Indica que o texto pode ser impresso. Tucano: A+: Indica a posição do fumaceiro, Indica que o tamanho da dentro da formação. fonte pode ser aumentado. Seta Dupla (european quote): A-: Hierarquiza um headline. Indica que o tamanho da fonte pode ser diminuído. Caixa de Interrogação: Estrela: Abre um tooltip com informações de Demonstra a patente do como proceder. piloto. Semiótica e Comunicação Assim que o usuário entra no site, logo na home ele encontra um pequeno depoimento o informando do que se trata o site, para que ele não tenha dúvidas do que se trata o conteúdo do site. Todas as informações no menu encontram-se de forma clara, salvo a parte de fumaceiros (pilotos), termo que pode ser estranho para alguns, mas que a pedido do cliente não foi mudado. Para contornar esse problema, ao usuário acessar a página e não ter nenhum fumaceiro selecionado, um pequeno texto lhe explica o significado do termo e o que ele pode encontrar naquela página. Como abordado por Krug no seu livro Não me Faça Pensar devido ao grande volume de sites sobre os mais diversificados assuntos encontrados na internet, os usuários ao entrarem em um site, sentem-se muito confusos já que podem encontrar qualquer assunto nele. Tendo em visto isso, faz-se necessário deixar bem claro, logo em sua página inicial, do que se trata o site. A linguagem do site foi passada da forma mais clara possível, para que pessoas que não possuam conhecimento do assunto tratado possam entender. A parte em que termos técnicos são realmente utilizados é na parte de Recrutamento, tendo em vista que para se entrar no EDAV é necessário ter conhecimento técnico prévio. Buscando atingir o maior número de pessoas buscamos utilizar a linguagem da forma mais simples possível, para torná-la entendível por todos. Outra forma de comunicação presente no site são os feedbacks, presentes tanto no site como na área de gerenciamento. Qualquer atividade em que seja necessário o uso do servidor como envio de formulário, login, cadastro e edição de conteúdo, é retornado ao usuário ou administrador um aviso, informando se a tarefa foi realizada com sucesso ou não. Buscando assim, evitar que o usuário venha a sentir-se perdido no site. O grande desafio que encontramos foi criar uma identificação do site com um esquadrão de simulação aérea, e para isso foi desenvolvido um layout onde a página parece flutuar entre as nuvens, trazendo assim uma forte identificação com o elemento 40
  • 41. “ar”, tão presente na aviação. Para que o usuário tenha uma experiência diferenciada ao entrar no site foram feitos 3 temas que variam de acordo com o horário de acesso, são eles: Manhã: Para representar a manhã, foi criado um fundo azulado, com nuvens e céu aberto. Fazendo com que o visitante desfrute de uma bela manhã. Tarde: Para representar uma tarde, foi feito um por do sol, com o céu alaranjado. Fazendo com que o visitante sinta o entardecer. Noite: Para representar a noite, foi desenvolvido um fundo com um luar com estrelas, fazendo com que o visitante sinta-se em um ambiente noturno. Signos Para seguir os conceitos da semiótica o site do EDAV apresenta diversos elementos referentes aos signos. Foi escolhido fazer um uso maior de símbolos, apresentando poucos ícones em sua representação. Dentre os ícones utilizados, podemos citar a lupa no campo de busca, os vídeos das simulações presentes no banner em flash no topo, algumas imagens representando os aviões tanto na pagina do EDAV quanto nas páginas dos fumaceiros, em forma de miniatura, no favico e wallpapers. Como símbolos, podemos encontrar a própria parte escrita do site, que é composta por palavras que possuem um significado e foram convencionadas tanto pela língua portuguesa quanto pelos próprios usuários do EDAV como os termos técnicos. Outro símbolo é o próprio logotipo do esquadrão presente no topo das páginas, para ajudar na identidade do site. Lupa: Foi utilizada uma lupa na caixa de busca, um ícone que cria uma identidade visual, já que por convenção as pessoas identificam o ato de buscar por algo com a imagem de Sherlock Holmes e sua inseparável lupa. Cadeados: Na área administrativa, na parte do recrutamento, onde o administrador pode definir se o recrutamento encontra-se aberto ou fechado, aplicamos o ícone de um cadeado que dependendo do status do cadastramento encontra-se aberto ou fechado. Seta: O símbolo dos títulos utiliza uma fonte maior para hierarquizá-los, com ajuda da seta que serve como destaque para os demais textos. Seta para baixo: A utilização do ícone de seta para baixo, propõe que há conteúdo abaixo dele, e ao clicá-lo ele se abre. Seta Dupla: O uso de setas duplas, também conhecido como European Quote, serve para destacar os Headlines do restante do texto, hierarquizando-os em relação aos outros símbolos. A+ e A-: Os símbolos “A+” e “A-” sugerem ao leitor que se pode alterar o tamanho da fonte do texto, servido como importante item de acessibilidade. Impressora: O ícone da impressora demonstra ao usuário que é possível imprimir o texto contido naquela página. Placa de Exclamação: A placa com uma exclamação é um símbolo já convencionado que sugere atenção, fazendo com que o usuário leia a frase que está contida após ele. Como a semiótica aborda aspectos filosóficos e lingüísticos estabelecidos pelo americano Charles S. Pierce e o suíço Ferdinand de Saussure sendo muito útil no estudo 41