← Voltar para todos os desafios

Dia 18: A apresentação visual

Uma imagem vale mais que mil palavras. Aprenda a criar seções que mostram seu produto em ação ou explicam processos de forma simples.

Mostre, não apenas fale

Enquanto a seção de "Proposta de Valor" diz ao usuário o que seu produto faz, a seção de Apresentação Visual mostra. É a diferença entre ler a receita de um bolo e ver uma foto irresistível dele já pronto. Uma boa apresentação visual cria desejo e torna o produto mais tangível e compreensível para o usuário.

Dois padrões para uma apresentação matadora

Dependendo do seu produto, dois padrões de design são extremamente eficazes para esta seção:

Padrão 1: Seção "Como funciona": Uma sequência de 3 ou 4 passos que quebra um processo complexo em partes fáceis de entender. É perfeito para explicar o fluxo de um aplicativo ou serviço.
Este formato é ideal para um produto digital, como um aplicativo ou uma ferramenta online. O objetivo é quebrar um processo em passos simples e fáceis de entender.

Comparação entre uma seção de 'Como Funciona' e uma Galeria de Imagens

Padrão 2: Galeria de imagens/mockups: Uma coleção de imagens de alta qualidade que mostram o produto ou os resultados do serviço. Ideal para produtos físicos (doceria), portfólios (fotógrafo) ou para exibir diferentes telas de um app dentro de mockups de celular.
Este formato é perfeito para um perfil profissional (advogado, dentista) ou para um negócio local (doceria), onde o apelo visual é o mais importante.

Dica de mestre: dê vida aos seus designs com mockups

Um design, por mais bonito que seja, ganha muito mais impacto quando apresentado dentro de um contexto real. Colocar suas telas em mockups de celulares ou computadores ajuda o cliente (ou recrutador) a visualizar o produto final em uso.

Para fazer isso de forma rápida e profissional dentro do próprio Figma, o Mockup Plugin é uma ferramenta incrível. Ele possui uma biblioteca gigante de mockups de alta qualidade prontos para você usar.

Instalar o Plugin no Figma

Seu desafio de hoje: a vitrine interativa

Sua missão é escolher o melhor formato para apresentar visualmente seu produto/serviço (definido no Dia 15) e projetar essa seção fundamental da sua landing page.

Checklist do desafio:

Decida o formato: O seu projeto se beneficia mais de uma seção "Como Funciona" (para processos) ou de uma Galeria (para resultados visuais)?
Esboce o conteúdo: Defina os 3 passos do seu processo ou selecione as 4 a 6 imagens principais para sua galeria.
Desenhe a seção completa, focando em imagens de alta qualidade e textos de apoio curtos e diretos.
Conecte ao seu Design System: Garanta que os títulos, textos e espaçamentos sigam os padrões que você já estabeleceu.