Como fazer screenshots de app store que geram downloads
Abra a App Store, pesquise qualquer coisa e conte quanto tempo você passa em cada resultado. Dois segundos? Menos? Você não está lendo descrição nenhuma. Você está olhando para um ícone, um nome e uma tira de screenshots da largura do seu polegar — e está decidindo ali.
É esse o detalhe do design de screenshots para a app store: é o material que a maioria dos devs indie entrega por último, à meia-noite, direto do simulador — e é justamente ele que decide. A primeira tela da sua página na loja, no celular, é o seu ícone, o seu título e mais ou menos os dois primeiros screenshots. Todo o resto é para quem já está inclinado a dizer sim.
Então vamos desenhar esses cinco quadros direito, com um exemplo real.
Seus screenshots são julgados primeiro em tamanho de miniatura
Aqui está a armadilha. Você desenha em 1290 × 2796 num monitor de 27 polegadas e fica lindo. Aí alguém pesquisa "lista de compras", a sua página aparece nos resultados com três screenshots espremidos numa tira pouco mais larga que um polegar, e aquela sua bela legenda de 48px virou um borrão ilegível.
Eu chamo isso de teste da miniatura, e ele é brutal: reduza o quadro para 1/3 do tamanho e olhe para ele com o braço esticado. Se você não consegue ler a legenda, ela não é uma legenda — é textura.
Na prática, numa tela de 1290 × 2796 isso significa legenda de 96–140px, em negrito, no máximo duas linhas. Parece absurdamente grande dentro do editor. Está certo. Todo conjunto de screenshots que funciona parece ter texto grande demais quando você está com o zoom aberto.
A captura de tela em si não precisa sobreviver à miniatura. Ninguém lê os rótulos da sua interface naquela tira. A tela é prova — ela diz "este é um app de verdade, bem feito" num relance. Quem vende é a legenda.
A legenda vende o benefício; a tela prova
A maioria dos conjuntos ruins de screenshots legenda o recurso. "Listas inteligentes." "Entrada por voz." "Sincronização." Isso são nomes de coisas, e nome nenhum jamais convenceu alguém a instalar nada.
Divida o trabalho:
- Legenda = o resultado que a pessoa quer, nas palavras dela. Curta. Em segunda pessoa, ou sem pessoa nenhuma.
- Tela = evidência de que o app entrega isso.
"Entrada por voz" vira "Adicione leite sem desbloquear o celular." "Sincronização" vira "Duas pessoas, uma lista, zero leite repetido." O mesmo screenshot embaixo. Uma conversão absurdamente diferente.
Uma ideia por quadro. Se a sua legenda precisa de um "e", você tem dois quadros.
Um exemplo na prática: cinco quadros para um app de compras
O app é o Bunch — uma lista de compras compartilhada para casais e colegas de apartamento. Este é exatamente o roteiro de quadros que eu publicaria, na ordem:
| # | Legenda (96–140px) | Tela exibida | Função do quadro |
|---|---|---|---|
| 1 | Duas pessoas. Uma lista. Zero leite repetido. | Lista compartilhada com dois avatares nos itens | O pitch inteiro em sete palavras |
| 2 | Diga "leite de aveia". Já está na lista dela também. | Adição por voz em plena animação, item surgindo | Mata a objeção "dá trabalho adicionar coisa?" |
| 3 | Organizada por corredor, não pelo caos. | Lista agrupada: Hortifrúti / Laticínios / Congelados | O recurso que encanta |
| 4 | Nada esquecido às 18h de uma terça-feira. | Notificação de lembrete ao chegar no mercado | A recompensa emocional |
| 5 | Grátis. Sem precisar criar conta. | Estado vazio com um botão grande de "Começar uma lista" | Remove o último atrito |
Repare que os quadros 1 e 2 fazem o trabalho pesado: o que é o app, e por que ele não dá trabalho. Se a pessoa não deslizar mais nada, ela já recebeu o argumento inteiro. Os quadros 3 a 5 são para quem já está inclinado a dizer sim e procura um motivo para se decidir.
Repare também que o quadro 5 não é um recurso. Ele é um matador de objeções. O espaço de screenshot mais subaproveitado da App Store é o último — ele deveria eliminar um medo ("grátis", "sem conta", "funciona offline") ou mostrar prova social ("4,8★, 12.000 listas compartilhadas este mês").
Regras de layout que valem para o conjunto inteiro
- Legenda em cima, sobre um painel de cor sólida; o aparelho embaixo, sangrando pela borda inferior. Esse é o padrão dominante por um motivo — o olho lê de cima para baixo, e o aparelho cortado sugere "tem mais app aqui dentro".
- Nunca coloque a legenda dentro da tela do celular. Ela é lida como interface, e as pessoas pulam interface.
- Mesmo fundo e mesma tipografia nos cinco quadros. Alterne a cor de destaque se quiser criar ritmo, mas um conjunto que troca de fonte a cada quadro parece cinco apps sem relação entre si. É a mesma disciplina de um brand kit — escolha uma vez, aplique em tudo.
- Contraste: painel escuro + legenda branca, ou uma cor de marca saturada + branco. Legenda cinza-clara sobre painel branco é o erro mais comum que eu vejo, e é o que mais desaparece em tamanho de miniatura.
- Mantenha a legenda dentro de uma margem de segurança de cerca de 8% de cada lado. A interface da loja corta mais do que você imagina.
Montando o conjunto no Ridvay Studio
Você não precisa de cinco arquivos separados nem de uma licença do Figma. O Studio monta o conjunto inteiro como um único design de várias páginas, que você depois edita quadro a quadro.
Cole isto:
Crie um conjunto de screenshots de app store com 5 páginas, 1290x2796, para o "Bunch", um app de lista de compras compartilhada para casais. Fundo azul-marinho escuro, legendas brancas em negrito no topo de cada quadro, um mockup de celular embaixo sangrando pela borda inferior. Legendas na ordem: "Duas pessoas. Uma lista. Zero leite repetido." / "Diga leite de aveia. Já está na lista dela também." / "Organizada por corredor, não pelo caos." / "Nada esquecido às 18h de uma terça-feira." / "Grátis. Sem precisar criar conta."
O que volta não é uma imagem chapada que você precisa gerar de novo toda vez que uma palavra sai errada. São cinco páginas editáveis — a legenda é uma camada de texto de verdade, o painel é uma forma de verdade, o destaque é um valor de cor de verdade. E é aí que está o ponto, porque os próximos trinta minutos são de edição, não de nova geração:
- Clique em cada legenda e aumente o tamanho até uns ~110px. Depois reduza o zoom da tela para 33% e leia de novo. É o teste da miniatura, feito dentro do editor.
- Arraste as suas capturas de tela reais para a camada do mockup no lugar do placeholder. A legenda fica onde está; só a prova muda.
- Troque a cor do painel para o azul da sua marca nas cinco páginas e não mexa na tipografia — consistência no conjunto vale mais do que variedade dentro dele.
- Duplique a página 1 e reescreva só a legenda para testar um segundo ângulo ("Nunca mais mande 'você comprou o leite?'"). Duas versões do quadro 1 são o teste A/B de maior alavancagem da página inteira.
Depois use o redimensionamento em um clique para levar o mesmo conjunto para as telas de 6.9" e do iPad, em vez de refazer tudo, e exporte cada página em PNG.
Monte o conjunto de screenshots do Bunch no Studio →
Quatro erros que custam downloads
Começar pela tela de login. O seu primeiro quadro nunca deveria mostrar uma tela que a pessoa precisa atravessar. Mostre o app fazendo o trabalho dele, já com dados realistas dentro.
Dados de demonstração vazios. "Item 1, Item 2, Item 3" diz para a pessoa que ninguém usa o seu app. Preencha com conteúdo plausível — nomes de produtos reais, preços reais, uma lista do tamanho que uma pessoa de verdade teria.
Pensar só em retrato no último quadro. Se você tem um visual realmente impressionante — um gráfico, um mapa, uma foto de sangria total —, ele é candidato ao quadro que conquista o deslize.
Screenshots que contradizem o app. Se as suas legendas prometem um recurso que só chega dali a duas versões, as avaliações de uma estrela vão dizer exatamente isso. Publique os quadros do app que você tem.
As regras gerais de hierarquia e contraste por trás de tudo isso também merecem ser internalizadas — escrevi sobre elas em princípios de design para quem não é designer, e os screenshots de app são o lugar de maior risco para aplicá-las, porque você tem mais ou menos dois quadros e um deslizar de polegar para defender o seu caso.
Faça o teste da miniatura hoje à noite. Reduza o seu quadro 1 atual para um terço do tamanho, dê uma olhada rápida e pergunte se um estranho saberia o que o seu app faz. Se não saberia, é uma noite de trabalho que separa você de uma taxa de conversão sensivelmente melhor.