Os alunos foram dividios em duplas com objetivo de desenvolver um novo web site para o Reprograme-se que é um programa desenvolvido pela IFES e pela Action (Associação Capixaba de Tecnologia).
- O site deve ter um design e layout intuitivos que permitam aos usuários navegar facilmente;
- O site deve ser responsivo e compatível com os principais navegadores e resoluções de tela;
- O site deve ser desenvolvido usando HTML, CSS e JavaScript, podendo ou não utilizar Bootstrap;
- O site deve respeitar a identidade visual do Reprograme-se, utilizando a paleta de cores e logos presentes na pasta /assets do código base disponível no Repl.it;
- O site deve ter uma área de notícias. Cada notícia terá uma foto de capa, um título, conteúdo textual, data e horário de publicação. Crie alguns exemplos de notícias;
- O site deve ter uma área de calendário e eventos, evidenciando as datas importantes;
- O site deve ter uma área de depoimentos de alunos do Reprograme-se. Cada depoimento deverá conter alguma identificação do aluno e seu relato;
- O site deve ter uma área de dúvidas frequentes (FAQ);
- O site deve ter um formulário de contato em que o usuário poderá enviar dúvidas, sugestões, reclamações ou outros assuntos;
- O site deve ter uma área em destaque para novos alunos se inscreverem no curso;
- O site deve ter uma área em que sejam disponibilizadas informações sobre o curso, evidenciando a grade currícular;
- O site deve ter uma área em que sejam destacadas informações sobre o Ifes e a Action, instituições responsáveis pela realização do programa;
- O site deverá contar com recursos de acessibilidade.
- Dentre as funcionalidades relacionadas à acessibilidade, você deverá desenvolver uma barra de navegação com as seguintes funcionalidades:
- Aumento do tamanho da fonte;
- Redução do tamanho da fonte;
- Ativação/Desativação de modo alto contraste;
As preferências do usuário em relação às funcionalidades de acessibilidade deverão ser armazenadas na Localstorage, permitindo que, em futuros acessos, tais configurações já sejam carregadas automaticamente;
Além das funcionalidades elencadas, a equipe deverá propor outras funcionalidades e conteúdos para o site;
A equipe poderá seguir a sugestão de árvore de diretórios para organização dos arquivos html, css, js e outros;
Página desktop
Página mobile
- Definimos que o site principal seria de página única e que teríamos páginas suplementares para conteúdos específicos, dessa forma não sobrecarregamos a navegação prejudicando a experiência do usuário.
- Criamos arquivos CSS para cada seção do site, facilitando assim o desenvolvimento e manutenção.
- Estabelecemos as cores bases para o projeto, mantendo as cores do Reprograme-se indicadas como principais e utilizando as ferramentas de seleção de cores chegamos a duas variações diferentes de cor para o fundo, uma escura e uma clara. Optamos pela cor clara pois ela passa uma ideia de leveza para página e é suave aos olhos para ser amigável aos interessados.
- Além das opções de acessibilidade do requisito, adicionamos opção de fonte para disléxicos.
- Consideramos que atendemos aos requisitos de acordo como enxergamos eles. Mas tínhamos mais ideias para deixar a página mais bonita e dinâmica, considerando o limite de tempo do projeto e nossos limites de tempo pessoais acreditamos que fizemos um bom trabalho para nossa primeira experiência.
HTML5 | CSS3 | JavaScript | Bootstrap | Trabalho em equipe | GitHub Merge