Início » Aplicativos e Software » O que é mockup?

O que é mockup?

Expectativa versus realidade; saiba o que é mockup e não gaste mais tempo, dinheiro e recursos do que o necessário em um projeto

Tatiana Vieira Por

O que torna um projeto eficaz? Sabe quando você explica algo e parece tão simples, na sua cabeça, mas ao tentar transmitir a alguém torna-se uma tarefa extremamente complexa? Pois é. Saiba o que é mockup e como ele pode servir de ponte entre nossas ideias e o cliente final.

Ao elaborar um projeto, talvez seja tentador pular alguma etapa que lhe pareça óbvia. Contudo, é muito importante ter referências próximas do real, fazendo a ponte entre o processo criativo, que é mais abstrato e subjetivo, sem perder de vista seu objetivo final.

O que é mockup

O que é mockup?

Mockup é o que os designers comumente utilizam para apresentar uma ideia, que se fosse explicada em palavras, por exemplo, não apresentaria, com clareza, o produto ou resultado final. Isso vale tanto entre participantes de uma equipe de projeto, quanto na comunicação com o cliente final.

Um exemplo seria a criação de uma estampa de camiseta. Você deseja sugerir que a aplicação tenha 10 x 7 cm, mas na prática, imaginar a aplicação pode não ser tão simples. Algo pode passar despercebido e a aplicação em mockup ajuda – e muito – a reduzir a probabilidade de erro ou insatisfação.

O mockup é um caminho simples, de baixo custo e alta fidelidade, em que é possível prever o resultado real, sem precisar investir em um protótipo, produto piloto, 3D ou similar.

Quando se tem uma ideia em desenvolvimento, geralmente existem três ou quatro estágios de design, que podem ser confundidos com mockup:

  1. Esboço de UI ou User Interface (Design de Interface do Usuário): permite que os designers trabalhem com todas as suas ideias ruins e identifiquem as ideias com potencial – pode ser desde rabisco em papel a uso de softwares específicos;
  2. Wireframes: são onde a hierarquia de informações, agrupamento de conteúdo e funcionalidade central são trabalhados – é a representação estrutural do seu projeto;
  3. Mockups: é onde veremos os detalhes visuais, a aplicação de um layout, estampa, desenho, simulando o produto final. Os mockups de tela podem ser identificados por sua sofisticação visual, mas pela total falta de interatividade – se faz da necessida de apresentar a aparência visual estática de um site, por exemplo, detalhando cores, formas, tipografia etc;
  4. Protótipos: reúnem recursos visuais e interatividade em uma versão do produto final.

Esses estágios permitem que os designers de IU testem e aprimorem suas ideias, além de obterem a aprovação de forma mais precisa. Evitando desperdício de tempo, dinheiro e recursos.

Com informações: Viking Code School Prep.

Comentários da Comunidade

Participe da discussão
1 usuário participando