--- title: "Vídeo de lançamento: vídeo promocional do seu produto" description: "Vídeos de lançamento e vídeos de produto para SaaS e apps, feitos com a sua interface real: roteiro, motion em código, som, legendas e versões por rede." url: "https://dardo.studio/pt/servicos/videos-de-lancamento/" language: "pt" translations: {"en":"https://dardo.studio/en/services/product-launch-videos/","es":"https://dardo.studio/es/servicios/videos-de-lanzamiento/"} updated: "2026-10-29T12:00:00Z" --- # Vídeos de lançamento feitos com a interface real do seu produto Um vídeo de lançamento é um comercial curto que mostra o que um produto novo faz nos poucos segundos que um visitante ou um feed oferece. A Dardo faz esses vídeos com a própria interface do produto: telas reais transformadas em motion graphics com código ou gravadas do produto ao vivo, com som, legendas e um corte para cada lugar onde o vídeo vai passar, do post de lançamento e da landing page às redes sociais e aos anúncios. Por [Nicolás Cerón](https://dardo.studio/pt/nicolas-ceron/) · Atualizado em 29 de out. de 2026 · 11 min de leitura [Pedir uma proposta](https://dardo.studio/pt/contato/?service=product-launch-videos) · [Fale com a gente no WhatsApp](https://wa.me/573132340197?text=Oi%2C%20Dardo!%20Gostaria%20de%20receber%20uma%20proposta%20para%3A%20V%C3%ADdeos%20de%20lan%C3%A7amento%20feitos%20com%20a%20interface%20real%20do%20seu%20produto) ## O que inclui um projeto de vídeo de lançamento Um projeto de vídeo de lançamento cobre a história, o movimento e todos os arquivos de que o lançamento precisa. A proposta diz o que está no escopo e quem fornece telas, textos, acesso a um ambiente de homologação e aprovações. - Roteiro e storyboard escritos a partir das telas e estados reais do seu produto - Motion graphics feitos em código com a sua interface, ou gravados do produto ao vivo - Tipografia e textos na tela da sua marca, legíveis sem som - Som: música e efeitos, e locução quando a história pede - Um master, mais cortes por formato, duração e idioma - Legendas, imagens de capa e notas de exportação para o site, as redes, os anúncios e as lojas de apps ## Por que fazer o vídeo com a interface real do seu produto Um vídeo de lançamento faz uma promessa sobre o produto, então o material mais seguro é o próprio produto. Quando o vídeo mostra as telas que as pessoas vão usar, a primeira sessão confirma o anúncio em vez de contradizê-lo, e as cores, a tipografia e o movimento já são da sua marca. As lojas de apps pedem o mesmo. As diretrizes de revisão da App Store dizem que as prévias de um app só podem usar capturas de vídeo da tela do próprio app, com narração e textos sobrepostos para explicar o que o vídeo não deixa claro. A ajuda do Google Play para vídeos de prévia pede que a experiência principal do app apareça nos primeiros 10 segundos. Partimos do que existe: o produto ao vivo, um ambiente de homologação ou os arquivos de design. Se um recurso ainda não foi construído, o storyboard o marca e combinamos com você se vale esperar por ele ou deixá-lo de fora. Quer que a Dardo faça isso por você? Conte o que você precisa. Nico responde pessoalmente em até um dia útil. [Pedir uma proposta](https://dardo.studio/pt/contato/?service=product-launch-videos) ## Motion feito em código ou gravado do produto ao vivo Há duas formas de transformar uma interface em vídeo, e muitos vídeos de lançamento usam as duas. Feito em código: reconstruímos os cards, os painéis e os botões que contam a história como uma composição do Remotion. O Remotion gera vídeo a partir de componentes React, um quadro por vez, então cada rótulo, número e idioma é um dado. Mudar um preço, um título ou o idioma significa renderizar de novo, não reeditar uma timeline, e o movimento usa a sua tipografia e as suas cores reais. Gravado do produto: capturamos o site ao vivo em um navegador, então o movimento é exatamente o que os usuários veem. Os vídeos curtos e sem som da nossa [página de projetos](https://dardo.studio/pt/projetos/) foram feitos assim, a partir dos sites ao vivo da Hyper, do Janus Observatory e da Gissi; na Hyper, um relógio controlado do navegador registra cada passo da animação para que nenhum quadro se perca. Funciona para interfaces que já se movem bem, como uma intro animada ou uma cena 3D. Cenas gravadas podem entrar em uma composição em código, com a sua tipografia e as suas transições ao redor. Nos dois casos, o vídeo é feito com o seu produto, não com banco de imagens nem com um mockup genérico de aparelho. ## Superame: um comercial de 28,8 segundos feito com a própria interface O [Superame](https://dardo.studio/pt/projetos/superame/) é um ranking público de projetos que a Dardo projetou e desenvolveu. O comercial de lançamento tem 28,8 segundos, em 1920 × 1080 e 60 quadros por segundo, com som e em espanhol. Os metadados do arquivo mostram que ele foi renderizado com o Remotion 4.0.520, e ele entrou no nosso site em 14 de setembro de 2026. Cada cena é a interface do Superame, reconstruída em código. Um card de projeto é publicado e depois se perde entre outros; o painel de oferta aumenta o valor e o botão Superar é pressionado; o card sobe no ranking até o primeiro lugar. Cinco frases contam a história: “Lo lanzaste.” (você lançou), “¿Y el resto?” (e o resto?), “Sí. El tuyo.” (sim, o seu), “Que te vean.” (que te vejam) e um fechamento com superame.lol e “hazte ver.” (apareça). Um corte sem som em 1280 × 720 roda no nosso portfólio, porque vídeo sem som pode começar sozinho quando a página carrega. O que este exemplo não mostra: não publicamos quanto tempo levou, quanto custou nem como performou, e é um único vídeo em um único idioma. É evidência do método, não de resultados. ## Um master, cortado para cada lugar onde o vídeo passa Cada plataforma corta, limita e reproduz o vídeo de um jeito, então planejamos os cortes já no storyboard e mantemos os textos principais dentro da área segura de cada formato. Em outubro de 2026, as páginas de ajuda das próprias plataformas dizem: __Um master, cortado para cada lugar onde o vídeo passa__ | Onde passa | Formato | O que dizem as especificações da plataforma | | ------------------------------ | -------------------------------------------- | ------------------------------------------------------------------------------------------------------------ | | Seu site ou landing page | Master 16:9, mais um loop sem som | O Chrome sempre permite autoplay sem som; com som, só em casos limitados, como depois que a pessoa interagiu | | YouTube | 16:9 | Enviar na mesma taxa de quadros em que o vídeo foi feito; 16:9 é o padrão no computador | | YouTube Shorts | Vertical | Até 3 minutos, com resolução de até 1080p | | Anúncios no Reels do Instagram | 9:16, 1440 × 2560 | Deixar livres de textos e logos os 14% superiores, os 35% inferiores e 6% de cada lado | | Anúncios em vídeo no LinkedIn | 16:9, 1:1, 4:5 ou 9:16 | De 15 a 30 segundos recomendados para todos os posicionamentos; menos de 30 fps; legendas em SRT | | Anúncios In-Feed do TikTok | 9:16 recomendado | No mínimo 540 × 960; a área segura depende das dimensões e do tamanho do texto do anúncio | | Prévias de app na App Store | Tamanhos fixos por aparelho, como 886 × 1920 | De 15 a 30 segundos, no máximo 30 fps, só capturas do próprio app | | Vídeo de prévia no Google Play | Horizontal ou vertical, no YouTube | Os primeiros 30 segundos podem rodar sozinhos e sem som; os anúncios do YouTube precisam estar desativados | Por isso um master em 60 fps como o do Superame precisa de uma exportação com menos quadros para o LinkedIn e a App Store, e um corte vertical é recomposto em vez de cortado, para que a interface fique legível no celular. Relemos a página de cada plataforma antes de exportar, porque esses limites mudam. ## Legendas, som desligado e versões por idioma Um vídeo de lançamento costuma começar sem som: o Chrome só inicia sozinho um vídeo com som em casos limitados, como depois que a pessoa interagiu com o site; o Google Play roda as prévias sem som; e as especificações da Meta para anúncios no Reels chamam as legendas de opcionais, mas recomendadas. Por isso a história é escrita para funcionar em silêncio, com os textos na tela, e o som soma. Legendas também são um requisito de [acessibilidade](https://dardo.studio/pt/servicos/acessibilidade-web/): o critério de sucesso 1.2.2 das WCAG 2.2, de nível A, pede legendas para o áudio pré-gravado em mídia sincronizada, com falas e sons relevantes. Entregamos legendas ocultas em arquivos SRT, o formato que o LinkedIn exige, e aplicamos legendas abertas nos cortes para redes que não aceitam um arquivo. Em uma composição em código, o texto na tela é um dado, então as versões em português, inglês e espanhol são renderizadas com o próprio comprimento de linha, datas e moedas, em vez de digitadas por cima do corte original. Cada idioma passa por uma revisão própria antes da exportação. ## Quando um vídeo de lançamento vale o investimento Um vídeo de lançamento compensa quando o produto funciona, as telas principais estão estáveis e há uma data e um lugar para o vídeo passar: o post de lançamento, uma landing page, a página na loja de apps ou uma campanha paga. Antes disso, uma gravação de tela feita pela sua equipe basta para testar o interesse. Se os visitantes chegam e não agem, a página pode importar mais que o vídeo: comece por uma [landing page](https://dardo.studio/pt/servicos/landing-pages/) ou por um [site para SaaS](https://dardo.studio/pt/servicos/site-para-saas/). Se a própria interface não está clara, o [design de produto](https://dardo.studio/pt/servicos/design-de-produto/) vem primeiro, porque um vídeo só mostra o que existe. Para movimento que o visitante percorre e controla dentro do site, veja o [desenvolvimento criativo](https://dardo.studio/pt/servicos/desenvolvimento-criativo/). Não gravamos live action. Atores, locações e equipe de filmagem são trabalho de uma produtora de vídeo; podemos entregar a ela as cenas de interface para a montagem. ## O que define o custo de um vídeo de lançamento Não há preço de pacote: um loop de 15 segundos gravado de um produto ao vivo e um comercial de 60 segundos com locução em três idiomas são trabalhos diferentes. O que mais pesa: - A duração e o número de cenas diferentes - Se a interface existe em código ou em arquivos de design que possamos usar - Motion feito em código, gravado do produto ou os dois - Locução e música licenciada para anúncios pagos - Versões: formatos, durações e idiomas - Quantas pessoas aprovam o roteiro e os cortes A proposta orça separadamente roteiro, produção, som e cada conjunto de versões, com datas calculadas de trás para frente a partir do seu lançamento. Nossa [página de preços](https://dardo.studio/pt/precos/) lista as faixas de orçamento do formulário de contato. ## Dúvidas antes de escolher **Quanto custa um vídeo de lançamento?** Depende da duração, do número de cenas, de o movimento ser feito em código ou gravado do produto, do som e da locução e de quantas versões você precisa. Não publicamos um preço para este serviço: orçamos depois de uma primeira conversa, com roteiro, produção, som e versões em linhas separadas que você pode comparar com outros orçamentos. **Quanto tempo deve durar um vídeo de produto?** O que o lugar onde ele passa permite. Prévias da App Store têm de 15 a 30 segundos, o LinkedIn recomenda de 15 a 30 segundos para os seus posicionamentos e o Google Play pode rodar sozinhos e sem som os primeiros 30 segundos. O comercial do Superame tem 28,8 segundos. Um mesmo storyboard pode planejar um corte curto para as redes e um mais longo para a landing page com as mesmas cenas. **Quanto tempo leva para fazer um vídeo de lançamento?** Não há prazo padrão. Depende do número de cenas, da rapidez na aprovação do roteiro e dos cortes e de as telas já estarem finais. A proposta define entregas com data, calculadas de trás para frente a partir do lançamento; conte a data logo no início e, se estiver perto, combinamos qual corte sai primeiro. **Vídeo de lançamento é o mesmo que vídeo explicativo?** Não exatamente. Um vídeo de lançamento é uma peça curta que anuncia um produto e mostra por que ele importa; um vídeo explicativo percorre como o produto funciona e costuma ser mais longo. Fazemos os dois com a interface real. Não fazemos explicativos com personagens animados nem vídeos com atores. **Vocês fazem o vídeo em inglês e em espanhol?** Sim. Em uma composição em código, o texto na tela é um dado, então cada idioma é renderizado com o próprio comprimento de linha, datas e moedas, em vez de digitado por cima do corte original; uma locução precisa de uma gravação por idioma. O comercial do Superame é em espanhol. Cada idioma passa por uma revisão própria antes da exportação. **De quem são o vídeo e os arquivos-fonte?** Com o pagamento final, o contrato cede por escrito à sua empresa os direitos sobre o vídeo final, e você recebe o master, cada exportação e as legendas, com as licenças de música e locução listadas. Se a sua equipe quiser o projeto do Remotion, as perguntas frequentes da licença dele tornam responsável quem é dono do projeto e somam as equipes das duas empresas para o limite de quatro pessoas, então resolvemos isso antes da entrega. **O vídeo vai deixar a nossa landing page mais lenta?** Não, se ele carregar depois do conteúdo da página. Os vídeos do nosso próprio site só carregam quando estão visíveis, mostram primeiro uma imagem de capa, pausam fora da tela e usam arquivos mais leves no celular. Um loop sem som pode rodar sozinho; a versão com som toca quando a pessoa pede. Para aparecer nos resultados de vídeo do Google, o guia dele pede uma página em que o vídeo seja o conteúdo principal, com dados estruturados VideoObject e uma miniatura estável. ## Do blog - [Remotion: como fizemos um comercial de produto com código](https://dardo.studio/pt/blog/remotion-comercial-de-produto/) Fizemos o comercial de 28,8 segundos do Superame com Remotion. O que ele é, como renderiza, quem precisa de licença e quando o After Effects é melhor. ## Fontes e leituras adicionais Fontes desta página, com mais detalhes dos publicadores originais. - [Remotion: The fundamentals (videos as React components rendered frame by frame)](https://www.remotion.dev/docs/the-fundamentals) · remotion.dev - [Remotion: License FAQ (agencies, clients and the four-person threshold)](https://www.remotion.dev/docs/license/faq) · remotion.dev - [Apple: App Store Review Guidelines (2.3.4, app previews)](https://developer.apple.com/app-store/review/guidelines/) · developer.apple.com - [Apple App Store Connect Help: App preview specifications](https://developer.apple.com/help/app-store-connect/reference/app-information/app-preview-specifications) · developer.apple.com - [Play Console Help: Add preview assets to showcase your app](https://support.google.com/googleplay/android-developer/answer/9866151) · support.google.com - [YouTube Help: Recommended upload encoding settings](https://support.google.com/youtube/answer/1722171) · support.google.com - [YouTube Help: Upload YouTube Shorts](https://support.google.com/youtube/answer/10059070) · support.google.com - [Meta Ads Guide: Instagram Reels video ad specs](https://www.facebook.com/business/ads-guide/update/video/instagram-reels) · facebook.com - [LinkedIn Marketing Solutions Help: Video ads advertising specifications](https://www.linkedin.com/help/lms/answer/a424737) · linkedin.com - [TikTok Ads Manager: Auction In-Feed Ads specifications](https://ads.tiktok.com/help/article/video-ads-specifications) · ads.tiktok.com - [Chrome for Developers: Autoplay policy in Chrome](https://developer.chrome.com/blog/autoplay) · developer.chrome.com - [W3C: Understanding WCAG 2.2, Success Criterion 1.2.2 Captions (Prerecorded)](https://www.w3.org/WAI/WCAG22/Understanding/captions-prerecorded.html) · w3.org - [Google Search Central: Video SEO best practices](https://developers.google.com/search/docs/appearance/video) · developers.google.com [Dardo](https://dardo.studio/pt/) · [Serviços](https://dardo.studio/pt/servicos/) · Vídeos de lançamento ## Trabalhos e estudos relacionados [![Tela do ranking do Superame com cards de projetos ordenados pelo total pago, um projeto da Dardo](https://dardo.studio/work/superame-2.webp?v=118a7a4eb407) · Trabalho selecionado / Comercial de lançamento feito com a interface · **Superame** · Um comercial de 28,8 segundos em espanhol, feito em código com o Remotion a partir dos cards, do painel de oferta e do ranking do Superame. Ele demonstra o método; não afirma nenhum resultado de campanha. · Ver o projeto](https://dardo.studio/pt/projetos/superame/) ## Da data de lançamento a um briefing de vídeo Conte a data, onde o vídeo vai passar e quais telas mostram melhor o produto. Respondemos com o escopo: cenas, versões, idiomas e o que precisamos da sua equipe. [01 · **Veja o comercial** · Superame, feito com a própria interface](https://dardo.studio/pt/projetos/superame/) · [02 · **Precisa da página onde ele vai passar?** · Landing pages](https://dardo.studio/pt/servicos/landing-pages/) · [03 · **Peça uma proposta** · Envie o seu briefing de lançamento para a Dardo](https://dardo.studio/pt/contato/?service=product-launch-videos) ## Continue explorando. - [![superame.lol — prévia do site](https://dardo.studio/_astro/01M4H711Q11QCMQDA10WE4A1K7_ZrTSRU.webp) · Estudo de caso · **superame.lol — estudo de caso de web design**](https://dardo.studio/pt/projetos/superame/) - [Serviço · **Estúdio de desenvolvimento criativo para sites interativos**](https://dardo.studio/pt/servicos/desenvolvimento-criativo/) - [Serviço · **Design de landing pages para campanhas, anúncios e lançamentos**](https://dardo.studio/pt/servicos/landing-pages/) - [Serviço · **Criação de sites para SaaS: posicionamento, preços e cadastro**](https://dardo.studio/pt/servicos/site-para-saas/)