Projeto Final: Trilha 2 Descodificadas 2024

Desafio Final - Portfólio P Code&Design

Bem-vindo ao P Code & Design, um portfólio de Priscilla Trevizan que apresenta projetos de desenvolvimento e design. Aqui, você encontrará uma combinação de projetos de front-end e design UI/UX, além de uma galeria criativa.

Descrição

Este projeto é um site de portfólio que destaca as habilidades de Priscilla Trevizan em desenvolvimento front-end e design UI/UX. O site inclui seções sobre habilidades, projetos de desenvolvimento, galeria de design criativo e uma sessão bônus com um vídeo explicativo sobre o desenvolvimento do site. Foi desenvolvido para atendimento do curso Descodificadas 2024.

Requisitos do Projeto e Como Foram Atendidos

• Logotipo: Incluído no cabeçalho do site.
• Menu: Menu de navegação fixo com links para as seções do site.
• Título destacado sobre o assunto do site com imagem do fundo: Seção principal com título e imagem de fundo.
• Trecho de texto com plano de fundo colorido: Seção de apresentação com plano de fundo colorido.
• Botão com link interno ou externo: Botões nas seções para navegação interna e links externos para projetos. Além de link para página na versão em inglês.
• Imagens com descrições: Projetos e galeria criativa com imagens e descrições e links de acesso para os projetos.
• Vídeo: Sessão bônus com vídeo incorporado.
• Mapa de localização: Mapa interativo usando Leaflet.
• Formulário para coletar cadastro: Formulário de contato com front-end funcional.
• Rodapé com a frase "criado por ": Incluído no rodapé do site.
• Uso de metatags e tags semânticas: O site utiliza metatags para SEO e tags semânticas para melhorar a acessibilidade.
• Menu dropdown ou sidebar: Menu responsivo que se transforma em sidebar em dispositivos móveis.
• Uso de pelo menos um card: Cards usados para apresentar projetos e habilidades.
• Botões de link interno ou externo com efeitos: Botões com transições e animações para navegação.
• Adição de imagens com carrossel: Carrossel de imagem e texto na seção de projetos.
• Uso de grid e flexbox para posicionamento dos elementos do site: Layout do site organizado com grid e flexbox.
• Uso de um iframe: Vídeo incorporado usando iframe na sessão bônus.
• Site responsivo: Uso de media queries para garantir a responsividade do site.
• JavaScript para interatividade: Interatividade adicionada com JavaScript, incluindo envio de mensagens e execução de tarefas.

Funções extras

• Menu mobile:
• Uso de Fontes Customizadas do Google Fonts: A utilização das fontes "IBM Plex Mono" e "Poppins" para uma melhor estética e legibilidade.
• Versão do site em inglês: a página conta com navegação interativa para sua versão em inglês, além do cuidado com canonical link.

Rodando localmente

Clone o projeto

  git clone https://link-para-o-projeto

Entre no diretório do projeto

  cd my-project

Selecione index.html

Utilize Open live Server ou Go Live para visualizar a página

Versão online

Você pode acessar a versão online deste projeto aqui

Agradecimentos à:

• Descodificadas

Contato

Priscilla Trevizan - LinkedIn