Um site pessoal para a criadora de conteúdo "TastyMysti", focado em games e reflexões. O site serve como um hub central para conectar fãs e seguidores com todo o conteúdo e presença social da criadora.
O site TastyMysti é uma landing page moderna e responsiva que apresenta o trabalho da criadora de conteúdo Mysti. Com um design elegante e minimalista, o site oferece uma experiência imersiva aos visitantes, começando com um hero section dinâmico com vídeo de fundo.
- Design responsivo e moderno
- Hero section com vídeo de background
- Seções organizadas para Sobre, Vídeos, Social e Parceiros
- Integração com API do YouTube para últimos vídeos
- Sistema de fallback para vídeos quando a API falha
- Menu mobile adaptativo com controle de scroll
- Otimização para SEO com meta tags OGP e Twitter Cards
- Design de cards para parceiros/collabs
- Pré-carregamento de recursos críticos
- HTML5 semântico
- CSS3 (Grid, Flexbox, Variáveis CSS)
- JavaScript (ES6+)
- Font Awesome para ícones
- API YouTube (com fallback local)
- Design responsivo (mobile-first)
mysti-website/
│
├── index.html
├── src/
│ ├── css/
│ │ ├── reset.css
│ │ ├── main.css
│ │ └── responsive.css
│ ├── js/
│ │ ├── main.js (contém lógica de API YouTube e fallback)
│ │ └── mobile-navbar.js (controle de menu mobile)
│ └── media/
│ ├── mysti_logo.png
│ ├── person_mysti.webp
│ ├── bgc.mp4
│ ├── avatar-*.webp (imagens de parceiros)
│ └── zw4-github.webp
-
Clone o repositório:
git clone https://github.com/seu-usuario/mysti-website.git
-
Navegue até o diretório do projeto:
cd mysti-website -
Abra o arquivo index.html em seu navegador ou use um servidor local para desenvolvimento. Para desenvolvimento, recomenda-se:
python -m http.server 8000
- Vídeo de background licenciado do Pexels
- Ícones via Font Awesome CDN
- Sistema de fallback para quando a API do YouTube não está disponível
- YouTube: @TastyMysti
- Twitch: mysti0107
- Twitter: @TastyMysti
- Instagram: @tasty_mysti
O site inclui uma seção dedicada para parceiros e colaboradores, com:
- Editora oficial do canal
- Colaboradores frequentes
- Desenvolvedor do site
Este projeto está sob a licença MIT. Veja o arquivo LICENSE para mais detalhes.
- Mysti - @tasty_mysti
- Link do Projeto: https://tastymysti.vercel.app/
Este projeto foi desenvolvido com dedicação por Brian Muniz.
- Integração com API YouTube
- Sistema de fallback robusto
- Design responsivo mobile-first
- Otimização de performance
- Semântica HTML avançada
- Controle de scroll em menus mobile
Se você tiver alguma sugestão ou quiser contribuir com o projeto, não hesite em entrar em contato!