O que são imagens de tela para celular e como extrair sem dor de cabeça
Imagens de tela para celular são basicamente capturas de tela em alta resolução que parecem estar rodando dentro de um dispositivo móvel real, com moldura do aparelho incluída. Todo mundo que já precisou subir screenshots na App Store ou montar um material visual para um cliente conhece o problema: a captura original sai quadrada, sem contexto, e precisa ser acomodada num mockup realista. Achei que ia levar horas fazendo isso manualmente no Photoshop. O método que eu uso hoje leva cerca de 10 minutos por imagem, se você tiver as ferramentas certas. Vou explicar o caminho prático.
imagens de tela para celular: como gerar no Figma
O Figma é a ferramenta mais usada atualmente pra esse trabalho, e não é só porque é gratuito. Ele tem plugins como Mockuuats Studio que exportam a sua tela direto pro dispositivo escolhido. O fluxo básico é simples: crie um frame com as dimensões corretas do app, importe o plugin, escolha o modelo de celular e pronto. As dimensões padrão mais usadas dependem da plataforma. Para iPhone, o Figma já traz frames prontos de 390x844 pixels (o padrão atual do iOS). Para Android, a referência mais comum é 360x800 dp, que corresponde a telas de 1080x2400 em densidade 3x. Se o seu app tem conteúdo scrollável, considere fazer duas screenshots — uma pra tela inicial e outra pra uma página interna. A Apple e a Google exigem múltiplas imagens mesmo assim.
Um detalhe que muita gente deixa passar: exporte sempre em PNG e nunca em JPG. O JPG compressa as bordas e os textos finos do app ficam com artefato. Isso é especialmente visível quando você aproxima a imagem ou usa em fundos escuros.
O problema real que ninguém conta sobre imagens de tela para celular
Quando você pega screenshots do seu app e coloca num mockup, algo curioso acontece — a interface parece menor do que realmente é. A moldura do celular ocupa tanto espaço na composição que o conteúdo do app perde presença visual. Eu passei semanas sem entender por que os screenshots da App Store estavam com taxa de conversão abaixo da média até perceber que estava subestimando esse efeito. A solução foi mais simples do que eu pensava. Em vez de preencher 100% da moldura, usei frames com margem interna de 40 a 60 pixels. O app parece maior, o fundo ganha espaço, e o resultado visual é mais equilibrado. No Mockuuats Studio, você consegue ajustar essa margem manualmente dentro do componente do dispositivo. Funciona tanto pra iPhone quanto pra modelos Android.
Outro ponto que merece atenção é a consistência entre as screenshots. Eu já vi materiais com dez imagens onde três usavam iPhones, duas Androids e o resto modelos genéricos. Isso quebra a identidade visual e passa uma impressão amadora. Escolha dois modelos no máximo e mantenha o mesmo ângulo — frontais ou levemente inclinados são os mais seguros para apps.
👉 Clique no botão abaixo para saber mais sobre o assunto!
Alternativas ao Figma quando você não quer depender de internet
Se você precisa trabalhar offline ou com volume alto de imagens, o Rotato é uma opção paga que vale o investimento. Ele roda no Mac, permite arrastar e soltar screenshots em dezenas de dispositivos, e exporta em resoluções de até 4K. Um arquivo batch com 20 screenshots leva uns 3 minutos prosseguindo. Para quem não pode pagar software, existem geradores online gratuitos como o Mockup World e o Placeit. O problema deles é que a maioria limita a resolução de exportação a 1920 pixels na largura, o que é suficiente para web mas insuficiente para impressão ou projetos de alta qualidade. Se o seu trabalho exige mais, esses serviços vão te frustrar rapidamente.
Também tem a opção de usar o Canva. Ele tem templates prontos de mocksups de celular e permite arrastar a screenshot direto. A desvantagem é a falta de controle sobre a perspectiva e o ângulo. Os resultados ficam muito uniformes e genéricos — funcionam para redes sociais, mas não passam de referência visual séria.
Pegadinhas que eu aprendi na prática
A primeira pegadinha é a proporção. O iPhone moderno tem tela 19.5:9. Se você fizer uma screenshot na proporção errada e esticar pra caber na moldura, os elementos distorcem. Sempre verifique antes de importar. Uma forma rápida de testar é abrir o frame no Figma e colocar um retângulo de preenchimento sólido — se ele cobrir partes indesejadas ou deixar espaço vazio, a proporção está errada. A segunda pegadinha é o horário. Eu já subi screenshots num mockup de iPhone com as horas marcando 3:47 da manhã porque a captura original era de um app que eu estava testando tarde da noite. Isso pode parecer irrelevante, mas em materiais voltados para empresas, passa uma impressão desleixada. Use timestamps neutros ou sobrescreva a barra de status com um elemento do design system.
Uma terceira coisa importante é o sistema operacional. Se o seu app está disponível tanto na Play Store quanto na App Store, faça screenshots separadas para cada plataforma. Nunca use uma screenshot de Android como se fosse de iPhone — a barra de status, o ícone de sinal e o layout são diferentes o suficiente pra qualquer pessoa que olhar notar a diferença em menos de um segundo.
Quando imagens de tela para celular simplesmente não resolvem
Existem cenários onde mockups visuais não são a resposta certa. Se você está vendendo um app B2B complexo — como um ERP, um sistema de gestão ou uma ferramenta de análise de dados — uma screenshot estática não transmite funcionalidade. Nesse caso, um vídeo de demonstração de 30 segundos performa drasticamente melhor nas lojas de app. Eu já vi casos em que a troca de screenshot por vídeo triplicou a taxa de install. Outro cenário onde mockups falham é quando o design do app é muito minimalista ou usa predominantemente cores claras. Em fundos claros, a moldura do dispositivo desaparece e a imagem perde contexto. Se o seu app tem esse perfil, invista num fundo texturizado ou num ângulo mais fechado que isole o dispositivo do restante da composição.
Por fim, se o objetivo é mostrar o app rodando em múltiplos dispositivos simultaneamente — algo comum em materiais de marketing corporativo — ferramentas como o Figma podem ficar lentas e instáveis com muitos frames abertos. Nesse caso, é mais eficiente exportar cada screenshot individualmente e montar a composição final num editor de imagem dedicado, mesmo que leve mais tempo por unidade. O que funciona melhor na prática é ter um processo padronizado: capture com as dimensões corretas, exporte em PNG, aplique o mockup no ângulo escolhido e revise a consistência de todas as imagens antes de subir. Leva cerca de 15 minutos por lote de dez screenshots, e o resultado final é consistentemente profissional.
