no botão the future mete a abrir este link: https://www.figma.com/proto/2KZFMqCEdoSsMs6n8RX9xk/BeatDaGame?page-id=4057%3A1473&node-id=4107-17845&viewport=2122%2C568%2C0.38&t=xd4zYNVB9FUsWZhM-1&scaling=min-zoom&content-scaling=fixed&starting-point-node-id=4107%3A17845
15d3039
verified
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Website Services | BEATDAGAME</title> | |
| <meta name="description" content="Discover how BEATDAGAME's website serves as your comprehensive poker rakeback and deals comparison platform."> | |
| <link rel="stylesheet" href="style.css"> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> | |
| </head> | |
| <body class="bg-white min-h-screen"> | |
| <div class="container mx-auto px-4 py-8"> | |
| <div class="flex flex-wrap gap-4 mb-8"> | |
| <a href="https://www.figma.com/proto/2KZFMqCEdoSsMs6n8RX9xk/BeatDaGame?page-id=4057%3A1473&node-id=4107-17845&viewport=2122%2C568%2C0.38&t=xd4zYNVB9FUsWZhM-1&scaling=min-zoom&content-scaling=fixed&starting-point-node-id=4107%3A17845" class="bg-gray-200 hover:bg-gray-300 text-gray-800 font-medium py-2 px-4 rounded-lg transition-all shadow hover:shadow-md active:shadow-sm border border-gray-900"> | |
| The Future | |
| </a> | |
| </div> | |
| <style> | |
| body { | |
| font-family: "Inter", sans-serif; | |
| color: #111; | |
| background: #f8fafc; | |
| } | |
| .page-container { | |
| max-width: 1200px; | |
| margin: 0 auto; | |
| padding: 80px 40px; | |
| background: white; | |
| border-radius: 16px; | |
| box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1); | |
| margin-top: 40px; | |
| margin-bottom: 40px; | |
| } | |
| .page-title { | |
| font-size: 56px; | |
| font-weight: 700; | |
| margin-bottom: 12px; | |
| color: #1e293b; | |
| line-height: 1.2; | |
| } | |
| .page-subtitle { | |
| font-size: 18px; | |
| color: #64748b; | |
| margin-bottom: 60px; | |
| font-weight: 400; | |
| max-width: 800px; | |
| } | |
| /* SECTION */ | |
| .section { | |
| margin-bottom: 80px; | |
| padding-bottom: 40px; | |
| border-bottom: 1px solid #f1f5f9; | |
| } | |
| .section:last-child { | |
| border-bottom: none; | |
| } | |
| .section-title { | |
| font-size: 32px; | |
| font-weight: 700; | |
| margin-bottom: 24px; | |
| padding-bottom: 16px; | |
| border-bottom: 2px solid #e2e8f0; | |
| color: #1e293b; | |
| } | |
| .section-text { | |
| font-size: 18px; | |
| line-height: 1.7; | |
| max-width: 800px; | |
| margin-bottom: 24px; | |
| color: #334155; | |
| } | |
| /* 2-COLUMNS */ | |
| .two-cols { | |
| display: grid; | |
| grid-template-columns: 1.2fr 1fr; | |
| gap: 60px; | |
| margin-top: 40px; | |
| align-items: start; | |
| } | |
| .side-box { | |
| border-left: 4px solid #3b82f6; | |
| padding: 24px; | |
| background: #f8fafc; | |
| border-radius: 12px; | |
| box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05); | |
| position: sticky; | |
| top: 20px; | |
| } | |
| .side-box ul { | |
| list-style: none; | |
| padding-left: 0; | |
| margin: 0; | |
| } | |
| .side-box li { | |
| font-size: 16px; | |
| padding: 4px 0; | |
| } | |
| /* GRID CARDS (3) */ | |
| .card-grid-3 { | |
| display: grid; | |
| grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); | |
| gap: 32px; | |
| margin-top: 48px; | |
| } | |
| .card-3 { | |
| background: white; | |
| border: 1px solid #e2e8f0; | |
| border-radius: 12px; | |
| padding: 32px; | |
| transition: all 0.3s ease; | |
| box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); | |
| } | |
| .card-3:hover { | |
| transform: translateY(-5px); | |
| box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1); | |
| border-color: #93c5fd; | |
| } | |
| .card-3 h3 { | |
| font-size: 20px; | |
| margin-bottom: 12px; | |
| } | |
| /* GRID CARDS (2 columns) */ | |
| .card-grid-2 { | |
| display: grid; | |
| grid-template-columns: repeat(auto-fit, minmax(450px, 1fr)); | |
| gap: 32px; | |
| margin-top: 48px; | |
| } | |
| .card-2 { | |
| background: white; | |
| border: 1px solid #e2e8f0; | |
| border-radius: 12px; | |
| padding: 32px; | |
| transition: all 0.3s ease; | |
| box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); | |
| } | |
| .card-2:hover { | |
| transform: translateY(-5px); | |
| box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1); | |
| border-color: #93c5fd; | |
| } | |
| .card-2 h3 { | |
| font-size: 20px; | |
| margin-bottom: 12px; | |
| } | |
| /* LISTS */ | |
| ul.clean-list { | |
| margin: 10px 0 0 12px; | |
| padding-left: 0; | |
| } | |
| ul.clean-list li { | |
| margin-bottom: 6px; | |
| line-height: 1.5; | |
| } | |
| /* SUMMARY BAR */ | |
| .summary { | |
| margin-top: 48px; | |
| padding: 32px; | |
| background: #f8fafc; | |
| border-left: 4px solid #3b82f6; | |
| border-radius: 12px; | |
| font-size: 18px; | |
| max-width: 900px; | |
| line-height: 1.7; | |
| color: #334155; | |
| box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05); | |
| } | |
| </style> | |
| <script> | |
| feather.replace(); | |
| </script> | |
| <script src="script.js"></script> | |
| </body> | |
| </html> | |
| <div class="flex flex-wrap gap-4 mb-8"> | |
| <a href="/index.html" class="bg-gray-200 hover:bg-gray-300 text-gray-800 font-medium py-2 px-4 rounded-lg transition-all shadow hover:shadow-md active:shadow-sm border border-gray-300"> | |
| ← Back to Home | |
| </a> | |
| <a href="/report.html" class="bg-blue-600 hover:bg-blue-700 text-white font-medium py-2 px-4 rounded-lg transition-all shadow hover:shadow-md active:shadow-sm border border-blue-700"> | |
| 📊 Report | |
| </a> | |
| </div> | |
| <div class="page-container"> | |
| <h1 class="page-title">Website — What We Do</h1> | |
| <p class="page-subtitle">Página 1 — Estado atual</p> | |
| <!-- PAPEL ATUAL --> | |
| <section class="section"> | |
| <h2 class="section-title">O papel atual do website no ecossistema beatdagame</h2> | |
| <div class="two-cols"> | |
| <div> | |
| <p class="section-text"> | |
| Atualmente, o website da beatdagame tem uma função quase exclusivamente | |
| <strong>comercial</strong>. Apresenta um conjunto reduzido de deals, algumas promoções | |
| e um número limitado de artigos de blog mensais. | |
| </p> | |
| <p class="section-text"> | |
| Na prática, funciona sobretudo como um <strong>repositório de ofertas</strong>, cumprindo | |
| a função mínima de disponibilizar informação, mas sem contribuir ativamente para | |
| confiança, autoridade ou retenção. | |
| </p> | |
| </div> | |
| <div class="side-box"> | |
| <ul> | |
| <li>• Repositório de deals</li> | |
| <li>• Conteúdo limitado</li> | |
| <li>• Foco transacional</li> | |
| <li>• Baixo impacto estratégico</li> | |
| </ul> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- O QUE FAZ HOJE --> | |
| <section class="section"> | |
| <h2 class="section-title">O que o website faz hoje</h2> | |
| <div class="card-grid-3"> | |
| <div class="card-3"> | |
| <h3>1. Repositório de deals</h3> | |
| <p> | |
| Lista os principais deals e promoções. Esta é a função principal do website | |
| e o motivo dominante das visitas. | |
| </p> | |
| </div> | |
| <div class="card-3"> | |
| <h3>2. Conteúdo limitado</h3> | |
| <p> | |
| Existem artigos no blog, mas a frequência e profundidade atuais não são suficientes | |
| para atrair tráfego qualificado. | |
| </p> | |
| </div> | |
| <div class="card-3"> | |
| <h3>3. Destino de tráfego externo</h3> | |
| <p> | |
| Recebe tráfego de newsletters, influenciadores e campanhas alternativas, | |
| mas sem estrutura para gerar envolvimento ou confiança. | |
| </p> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- O QUE NÃO FAZ --> | |
| <section class="section"> | |
| <h2 class="section-title">O que o website não faz (e deveria fazer)</h2> | |
| <div class="card-grid-2"> | |
| <div class="card-2"> | |
| <h3>1. Não gera confiança</h3> | |
| <ul class="clean-list"> | |
| <li>ausência de testemunhos;</li> | |
| <li>falta de métricas transparentes (rakeback, histórico, resultados);</li> | |
| <li>pouca prova social;</li> | |
| <li>informação insuficiente sobre fiabilidade.</li> | |
| </ul> | |
| </div> | |
| <div class="card-2"> | |
| <h3>2. Não demonstra autoridade</h3> | |
| <ul class="clean-list"> | |
| <li>conteúdo pouco profundo;</li> | |
| <li>falta de reviews e comparativos;</li> | |
| <li>ausência de análises especializadas;</li> | |
| <li>não diferencia a marca.</li> | |
| </ul> | |
| </div> | |
| <div class="card-2"> | |
| <h3>3. Não atrai tráfego qualificado</h3> | |
| <ul class="clean-list"> | |
| <li>volume de conteúdo insuficiente;</li> | |
| <li>falta de calendário editorial estruturado;</li> | |
| <li>pouca capacidade de captar jogadores experientes.</li> | |
| </ul> | |
| </div> | |
| <div class="card-2"> | |
| <h3>4. Não promove interação</h3> | |
| <ul class="clean-list"> | |
| <li>experiência utilitária e pouco envolvente;</li> | |
| <li>ausência de elementos que motivem exploração ou regresso.</li> | |
| </ul> | |
| </div> | |
| <div class="card-2"> | |
| <h3>5. Não reforça o email marketing</h3> | |
| <ul class="clean-list"> | |
| <li>o destino das newsletters não aprofunda informação;</li> | |
| <li>não aumenta a confiança nem melhora conversão.</li> | |
| </ul> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- PROBLEMAS --> | |
| <section class="section"> | |
| <h2 class="section-title">Problemas identificados</h2> | |
| <ul class="clean-list" style="font-size:18px;"> | |
| <li><strong>Excesso de foco comercial</strong> — apresenta ofertas, mas acrescenta pouco mais.</li> | |
| <li><strong>Arquitetura limitada</strong> — não orienta o utilizador.</li> | |
| <li><strong>Credibilidade insuficiente</strong> — falta clareza e prova social.</li> | |
| <li><strong>SEO pouco desenvolvido</strong> — conteúdo escasso e sem estratégia.</li> | |
| <li><strong>Tracking básico</strong> — limita capacidade de análise.</li> | |
| <li><strong>Interface pouco escalável</strong> — não acompanha a ambição do projeto.</li> | |
| </ul> | |
| </section> | |
| <!-- CONCLUSÃO --> | |
| <section class="section"> | |
| <h2 class="section-title">Conclusão & oportunidade</h2> | |
| <div class="card-grid-3"> | |
| <div class="card-3"> | |
| <h3>1. Reforçar confiança</h3> | |
| <ul class="clean-list"> | |
| <li>métricas transparentes;</li> | |
| <li>testemunhos;</li> | |
| <li>reviews independentes;</li> | |
| <li>histórico claro de resultados.</li> | |
| </ul> | |
| </div> | |
| <div class="card-3"> | |
| <h3>2. Atrair tráfego qualificado</h3> | |
| <ul class="clean-list"> | |
| <li>conteúdo regular e aprofundado;</li> | |
| <li>comparativos e análises;</li> | |
| <li>informação de torneios;</li> | |
| <li>editorial adaptado ao comportamento do jogador.</li> | |
| </ul> | |
| </div> | |
| <div class="card-3"> | |
| <h3>3. Comunicar autoridade</h3> | |
| <ul class="clean-list"> | |
| <li>conhecimento do setor;</li> | |
| <li>rigor na apresentação de informação;</li> | |
| <li>clareza e transparência;</li> | |
| <li>posicionamento consistente.</li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div class="summary"> | |
| O website cumpre hoje a função mínima de apresentar deals, mas não exerce ainda os papéis essenciais | |
| de confiança, geração de tráfego qualificado e afirmação da marca. Estas lacunas representam | |
| a principal oportunidade de evolução. | |
| </div> | |
| </section> | |
| </div> | |