Do que um sistema de conquistas precisa nas insígnias?
De mais de uma imagem por conquista. O jogador vê a insígnia antes de conquistá-la (bloqueada), às vezes sem saber o que ela é (oculta), e muitas vezes em níveis (bronze, prata, ouro). Cada plataforma também quer o próprio tamanho e formato. Desenhar cada estado à mão multiplica o trabalho por cinco. O criador de insígnias desenha cada conquista uma vez e gera os outros estados a partir desse desenho.
Nosso conjunto de exemplo de um clube de corrida: nove insígnias a partir de uma lista, conquistadas (em cima) e bloqueadas (embaixo). As versões bloqueadas foram feitas a partir dos mesmos desenhos, não desenhadas de novo.
Como eu crio um conjunto de insígnias?
Abra o gerador de logo com IA e escolha Insígnias e depois Um conjunto.
- Liste as conquistas, uma por chip:
primeira corrida, 5 km, 10 km, meia maratona, maratona, madrugador. Um conjunto pode crescer até 36 insígnias. - Escolha a linha de baixo. Nenhum, Nível 1, 2, 3… na ordem da lista, ou Mesmo texto em todas as insígnias (o nome de um clube, um ano). O nome da conquista vai na parte de cima.
- Escolha um visual. Marcante, Linha ou Retrô, mais até 300 caracteres de estilo com as suas palavras e até três cores: "marcante, esportivo, azul-marinho e laranja".
- Envie. O preço de um conjunto novo aparece primeiro no botão.
Para uma insígnia só, um brasão de clube ou um selo "Desde 2024", escolha Uma insígnia e digite você mesmo o centro, a linha de cima e a linha de baixo.
O texto sai escrito do jeito que eu digitei?
As palavras são escritas como parte do desenho, e o desenho é pedido com elas exatamente como foram digitadas. Olhe todas as insígnias antes de baixar, porque uma letra ainda pode sair errada. Linhas curtas ficam mais legíveis: a linha de cima comporta até 40 caracteres e a de baixo até 30, mas duas ou três palavras se encaixam na curva muito melhor do que uma frase. Se uma palavra sair errada, refaça essa insígnia numa rodada com uma observação ("linha de cima: HERÓI DA MEIA MARATONA"), e o resto do conjunto fica como está. Palavras que pedem o logo ou a marca registrada de outra empresa são recusadas antes de qualquer desenho, e nada é cobrado. Afirmações sobre o seu próprio negócio, como "certificado" ou "devolução do dinheiro", são mostradas de volta para você confirmar que são verdadeiras.
Quais versões de cada insígnia eu recebo?
| Versão | Como ela fica | Uso típico |
|---|---|---|
| Conquistada | a insígnia como foi desenhada | conquista desbloqueada |
| Bronze, Prata, Ouro, Platina | o anel e o texto recoloridos no metal, lisos ou com um brilho leve | níveis de uma mesma conquista |
| Bloqueada | uma versão cinza achatada, com um cadeado no anel | ainda não conquistada |
| Oculta | a insígnia cinza esmaecida sob um grande ponto de interrogação | conquista secreta |
Os níveis recolorem formas inteiras do anel conforme a função delas (anel externo, borda, faixa, letras) e mantêm as letras legíveis sobre a faixa. A imagem do centro mantém as cores, então dá para reconhecer a conquista num relance.
Quais arquivos cada plataforma recebe?
| Download | Arquivos |
|---|---|
| Web e app | um SVG por insígnia e versão, PNGs de 64, 128, 256 e 512 px, um sprite.svg e um badges.json que lista todos os arquivos e textos |
| Steam | JPGs de 256 × 256 em achieved/ e unachieved/ (a versão bloqueada), como a Steamworks pede |
| Game Center | PNGs de 1.024 × 1.024 |
| Google Play | PNGs de 512 × 512 com menos de 1 MB (o próprio Google deixa as conquistas bloqueadas em cinza) |
| Twitch | insígnias de inscrito em 18, 36 e 72 px, cada uma com menos de 25 KB |
| Discord | ícones de cargo de 64 × 64 com menos de 256 KB |
| Open Badges | PNGs quadrados de pelo menos 600 px com menos de 256 KB, para credenciais |
| Impressão | PNGs de 300 DPI e SVGs em milímetros, de 2 a 10 cm de largura |
Cada download é gerado nos tamanhos e formatos da plataforma, e os PNGs são comprimidos para ficar dentro do limite de tamanho de arquivo dela. As regras das plataformas mudam; a tabela mostra como elas estavam quando este guia foi escrito.
Como eu mostro as insígnias no meu app?
Use o badges.json do download para web como mapa: cada entrada traz o nome da conquista, os textos de cima e de baixo e o arquivo de cada versão. Mostre o SVG da conquistada quando o jogador já a tiver, e o da bloqueada nos outros casos. Os SVGs continuam nítidos em qualquer densidade de tela. Use os PNGs onde uma engine ou uma loja pedir bitmaps. O texto do anel é fácil de ler a partir de 128 px. Abaixo disso, a insígnia é reconhecida pela imagem e pela cor, então mantenha o centro simples e dê um tema diferente a cada insígnia do conjunto.