Projeto de Estudo: Dungeon Guides

Acesse o projeto aqui

Projeto de site de catálogo de produtos, destinado à treinamento de HTML e CSS, proposto por Gama Academy (Gama Experience).

Sobre • Proposta • Conteúdo • Autor

🐲 Sobre

O projeto tinha como objetivo a criação de um site estilo catálogo de produtos.

O site deveria incluir:

• Página inicial, com produtos em destaques, com a possibilidade de filtrar os itens
• Página com detalhes de um determinado produto, com fotos, descrição
• Página institucional, estilo "Quem somos"

Todas as páginas precisariam ter responsividade para telas 1280px, 1024px e 375px, e também precisariam ser navegáveis entre si.

Também estava incluso no projeto a necessidade de criar um repositório no GitHub, bem como praticar commitar.

💭 Proposta

O site Dungeon Guides tem como produto o serviço de Mestres de Mesa do RPG Dungeons & Dragons.
Ao acessar o site, você pode procurar por campanhas oficiais para jogar. A disponibilidade delas depende diretamente da disponibilidade dos mestres parceiros, que selecionam as campanhas que têm experiência para narrar. No site, esses mestres são chamados de DG (Dungeon Guide).
Ao encontrar uma campanha que julgue interessante, o cliente pode pedir o orçamento diretamente com o DG, uma vez que o preço depende de condições como quantidade de sessões, tempo de sessões, número de jogadores, entre outros.

🧾 Conteúdo

O site dispõe de:

• Página inicial, com destaques e possibilidade de filtrar as Aventuras (produto) de acordo com o nível máximo de cada.
• Página de Aventuras, onde como padrão deixa todas as aventuras listadas, permitindo aplicar os mesmos filtros presentes na página inicial.
• Página da Aventura, onde pode-se encontrar uma descrição sobre a mesma, com outras ilustrações e a possibilidade de pedir um orçamento. Existem três aventuras com a página disponível.
• Página Sobre, que é dividida em "Sobre o Dungeon Guides", "FAQ" e "Seja um DG!". As duas primeiras partes dispõem de texto genérico.
• _^OPA

No rodapé do site é possível encontrar alguns ícones linkados à redes sociais, as quais não são específicas do Dungeon Guides (com excessão do GitHub), visto que este é um site fantasia. Tais redes sociais são associadas à pessoa que desenvolveu o projeto.

❗ Algumas observações finais sobre o projeto: em alguns momentos foi usada a tag "style" tanto inline quanto no head da página. Fiz isso para evitar ter que criar novos arquivos CSS, que seriam praticamente duplicados para então modificar apenas um seletor.

🧙 Autor

Feito por Stella Leal
💌 Contatos