Blizzard
O tema é uma landing page da empresa blizzard, nessa página o dev deverá construir um menu de navegação, a seção banner hero com a funcionalidade de alterar o jogo destaque(Diablo, HearthStone e World of Warcraft), a listagem dos principais jogos da empresa e um rodapé contendo informações sobre o download do app battle.net.
Você pode usar qualquer ferramenta(linguagem de programação, stack, lib) para ajudá-lo a completar o desafio, não será avaliado o código, mas sim a fidelidade ao layout e a implementação das funcionalidades solicitadas. Então, se você tem algo que gostaria de praticar, sinta-se à vontade.
Para deixar o desafio mais justo o layout e os requisitos foram separados em três níveis de dificuldade(fácil, médio e difícil). Ao selecionar uma dificuldade você deverá considerar a implementação dos requisitos das dificuldades anteriores, ou seja, se optar pela dificuldade média, deverá levar em conta todos os requisitos da dificuldade fácil e caso prefira a dificuldade difícil, deverá levar em conta todos os requisitos da dificuldade fácil e médio.
Agora veja os requisitos de cada dificuldade:
Nível Fácil:
- Criar as seções: Menu, Banner hero, Footer.
- O texto e o ícone do botão “Baixar jogo” devem ser alterados conforme o sistema operacional do usuário que estiver acessando a página. (material de apoio) (componente no figma)
- Aplicar efeito de hover nas opções do menu de navegação.
- Aplicar responsividade para as seguintes resoluções: 1920px, 1440px, 768px e 375px.
Nível Médio:
- Todos os requisitos do nivel fácil.
- Criar as seções: Menu, Banner hero, Jogos Exclusivo, Footer.
- Buscar a lista de jogos via api. (acessar endpoint)
- Aplicar efeito de hover nas imagens dos jogos da seção Jogos Exclusivos.
- Alterar as informações da seção Banner Hero ao selecionar uma opção no menu lateral. Os jogos disponíveis são Diablo, HearthStone e World of Warcraft. (componente no figma)
Nível Difícil
- Todos os requisitos do nivel fácil e médio.
- Ao clicar no botão Logar do menu de navegação, deverá ser exibido o modal de login. (componente no figma)
- Criar componente de dropdown para as opções Jogos e Esportes do menu de navegação. (componente no figma)
- Deverá ser executado um gif do jogo quando ocorrer o evento de hover ou click na capa do trailer. (baixar gifs)
Com o objetivo de gerar menos dúvidas, foi gerado um protótipo navegável, nele você pode testar o menu dropdown, modal de login, evento para alterar o jogo destaque e o efeito de hover no trailer do jogo, clique aqui para visualiza-lo.
Foi criado um repositório template no github com os assets e um README de base, clique aqui para usar esse template.