|
|
<!DOCTYPE html> |
|
|
<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="/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> |
|
|
|
|
|
|
|
|
<a href="https://www.figma.com/proto/2KZFMqCEdoSsMs6n8RX9xk/BeatDaGame?page-id=4074%3A21644&node-id=4107-17845&viewport=644%2C40%2C0.25&t=2gFKr1EAbI1wJteQ-1&scaling=min-zoom&content-scaling=fixed&starting-point-node-id=4107%3A17845" |
|
|
target="_blank" |
|
|
class="bg-purple-600 hover:bg-purple-700 text-white font-medium py-2 px-4 rounded-lg transition-all |
|
|
shadow hover:shadow-md active:shadow-sm border border-purple-700"> |
|
|
🚀 The Future |
|
|
</a> |
|
|
|
|
|
</div> |
|
|
|
|
|
</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 { |
|
|
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; |
|
|
} |
|
|
.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; |
|
|
} |
|
|
.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; |
|
|
} |
|
|
.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 3px 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; |
|
|
} |
|
|
ul.clean-list { |
|
|
margin: 10px 0 0 12px; |
|
|
padding-left: 0; |
|
|
} |
|
|
ul.clean-list li { |
|
|
margin-bottom: 6px; |
|
|
line-height: 1.5; |
|
|
} |
|
|
.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> |
|
|
|
|
|
<div class="page-container"> |
|
|
|
|
|
<h1 class="page-title">Website — What We Do</h1> |
|
|
<p class="page-subtitle">Página 1 — Estado atual</p> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<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> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<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> |
|
|
|
|
|
|
|
|
|
|
|
<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> |
|
|
|
|
|
|
|
|
|
|
|
<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> |
|
|
|
|
|
|
|
|
<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> |
|
|
|
|
|
</body> |
|
|
</html> |
|
|
|
