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
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