FrontEnd - StarQuiz.md

StarQuiz

Objetivo

O objetivo desse desafio é medir o conhecimento do candidato em relação ao desenvolvimento de aplicativos Web com foco no front-end.

Enredo

Você conhece os personagens de Star Wars?

Sim? Então mostre-nos!

Com esse quiz você terá oportunidade de identificar os principais personagens de Star-wars, marcar pontos e se tornar um expert nesta série de filmes maravilhosa!

Requisitos

Inicio do jogo

• Tela contando ao usuario sobre o jogo;
• Botão para iniciar o mesmo;

Jogando

• O usuário tem dois minutos para acertar o maior número de personagens;
• Listar os personagens, de forma paginada, consumindo a API descrita abaixo;
• A API não disponibiliza imagens dos personagens, para sanar isso deve-se utilizar uma engine de fotos (google ou a que preferir) para mostrar uma miniatura do personagem;
• Não deve exibir o nome do personagem, pois será isso que o jogador deve acertar;
• Abaixo da imagem do personagem, deve-se exibir dois botões:
  • '?': Deve exibir um input para o usuario digitar o nome do personagem;
  • '...': Deve exibir os dados do personagem (exceto o nome) que estão disponiveis na API;

Pontuação

• O usuário deve receber 10 pontos para cada personagem que acertar, se não tiver consultado os detalhes do mesmo;
• O usuário deve receber 5 pontos para cada personagem que acertar e tiver consultado os detalhes do mesmo;
• O usuário poderá errar quantas vezes quiser, sem afetar sua pontuação;
• O usuário não poderá responder mais de uma vez ao mesmo personagem;

Modal de Detalhes

• Na API existem diversos endpoints com informações dos personagens;
• Para exibir os dados nesta modal, serão consultados vaários desses endpoints, portanto deve-se ter atenção a performance (processamento paralelo);

Finalizando

• Depois que o tempo expirar (2 minutos) o usuário naão pode realizar nenhuma acão;
• Exibir uma modal com a pontuação do usuario;
• Formulario para salvar pontuacao: Deve validar o nome (obrigatorio) e o e-mail;
• Armazenar a pontuação no localStorage.

Ranking (PLUS)

• Se sobrar tempo, faça uma listagem dos usuarios e suas pontuaçôes;

Observação

Todos os requisitos acima são sugestões, fique à vontade para alterá-los, o que queremos ver é seu código, linha de raciocínio e criatividade!

API

Não será necessário criar uma API para esse projeto, em vez disso vamos consumir uma pronta: Star Wars API

Tempo para desenvolvimento

• 3 dias após envio do teste

Critérios de avaliação

• Código limpo e testado;
• Pontualidade (prazo);
• Usabilidade;
• Performance;
• Criatividade;
• Features;

Dúvidas:

Qualquer dúvida (técnica/requisito/processo) enviar e-mail para recrutamento@s2it.com.br com o titulo: [DESAFIO STAR QUIZ] DÚVIDAS

StarQuiz-1.png

StarQuiz-2.png

StarQuiz-3.png

StarQuiz-4.png