Tutorial 8 — A página inicial do jogo e a sua publicação

A página inicial: `site/`

Uma pasta games/<id>/site/ (uma página index.html, imagens) vira a página do jogo neste site e a raiz do seu domínio se você o publicar por conta própria (com o jogo em play/). Exemplos: Rainbow Islands, Sapiens.

com as cores do jogo e as imagens de verdade dele: capturas (bin/jumphp shot), sprites, tiles;
um link grande para o jogo: href="play/";
SEO: <title>, <meta name="description">, Open Graph (og:image de 1200 × 630), um <h1>, alt nas imagens, os dados estruturados VideoGame;
os endereços absolutos se escrevem https://{{DOMAIN}}/…: o site os substitui pelo endereço verdadeiro;
legível no celular (390 pixels de largura, sem rolagem horizontal).

Confira com bin/jumphp build:site <id> e depois bin/jumphp siteshot <id>.

A descrição, em todos os idiomas

O site existe em 14 idiomas (fr en es de it pt nl pl ru uk tr ja zh ko): ele mostra a descrição do jogo no idioma do visitante. Escreva-a em config/game.yaml, no maior número possível deles (pelo menos fr e en):

game:
  description: "Um jogo de quebrar tijolos: 3 vidas, uma parede nova a cada fase."
  descriptions:
    fr: "Un casse-briques : 3 vies, un nouveau mur à chaque niveau."
    en: "A brick breaker: 3 lives, a new wall every level."
    es: "Un rompeladrillos: 3 vidas, un muro nuevo en cada nivel."

Sem tradução no idioma do visitante, a descrição do projeto é exibida.

O site do jogo em outros idiomas

site/index.html é a página no idioma principal do jogo (seu <html lang>). Cada tradução vai em site/<código>/index.html (por exemplo site/en/index.html): a mesma página traduzida, com os caminhos relativos uma pasta acima (../images/…, o jogo em ../play/). Aqui, o visitante vê a página no seu idioma quando ela existe. Cada página lista todos os idiomas (<link rel="alternate" hreflang="…">) e oferece um pequeno menu de idiomas; o sitemap.xml traz um endereço por idioma. Seu Claude sabe fazer isso (AGENTS.md §13 do JumPHP).

A imagem do diretório

assets/thumbnail.png (16:9). Caso contrário, o site usa a imagem og:image da página inicial, depois o ícone do jogo e, na falta dele, fotografa o próprio jogo em um navegador.

O que o site acrescenta a cada jogo

Instalar: cada jogo se instala como um aplicativo (no celular e no computador), com o seu ícone (assets/icon.png);
Compartilhar: a folha de compartilhamento do celular ou as redes sociais no computador;
as notas dos jogadores (de 1 a 5 estrelas, sem conta) e o contador de partidas;
o código-fonte e o editor online;
as versões (🕘): cada commit que mudou o jogo. Os jogadores sempre recebem a última versão publicada; uma antiga pode ser jogada de novo, retomada na sandbox, restaurada (o autor dela: no seu editor, “Enviar para o GitHub”) ou ter um fork feito;
os comentários, a caixa de ideias e os problemas relatados pelos jogadores, com ou sem conta. As mensagens anônimas só aparecem depois de aprovadas por você. O sino 🔔 no alto do site conta as novas mensagens nos seus jogos e as que aguardam a sua aprovação; a página dele (Notificações) lista todas, com os botões ✓ Aprovar, Marcar como resolvido (para um problema) e Excluir.

Publicar

Cada push no branch principal do seu repositório é publicado em até um minuto. No Studio, a página do projeto mostra o estado da publicação, os erros e permite ocultar o jogo do diretório.