O product illustration é parte essencial das soluções digitais. Enquanto o conteúdo textual do seu site ou aplicativo dizem algo para o usuário, as ilustrações transmitem a informação de forma mais atrativa, auxiliando na comunicação e no cumprimento de tarefas com um toque mais humano, podendo ser metafórico ou não.

Para ser bem sucedida em um produto digital, a ilustração precisa estar alinhada com o tom e a voz da marca, transmitindo seu propósito e atingindo as necessidades e objetivos do usuário.

‘A ilustração do produto sem um objetivo pode sobrecarregar, ser perturbadora e até irritante. Em vez disso, tenha algo que valha a pena dizer; então diga lindamente.’ - Meg Robichaud Líder de Ilustração da Shopify

Product Illustration como ferramenta de Design

A interpretação de forma visual torna a experiência mais agradável, deixando o usuário mais disposto a experimentar algo novo e mais compreensível se algo der errado na interação. Essa é a grande diferença entre ilustrar algo simplesmente bonito, para algo que realmente transmita o propósito do produto e auxilie na experiência. Mas, como saber quando e onde usar essas ilustrações?

Apoiando o produto

Sabe aquela história de ‘menos é mais’? Aqui isso se encaixa perfeitamente. Muitos elementos podem causar confusão e má interpretação. Nesse cenário é importante evitar a frustração do usuário. A ilustração que apoia o produto é aquela que permite melhor entendimento, traduz informações complexas, influencia e direciona o usuário para o que é importante e resolve eventuais problemas.

Por isso, algumas marcas incorporaram as Product Illustrations como parte do branding. É uma forma de envolver e contar uma história, criando uma relação com o usuário. Uma definição precisa de como criar e como usar essas ilustrações só trará benefícios a marca que decidir usá-las.

Onboarding do aplicativo Dropbox

Humanizando a mensagem

Como dito acima, um dos papéis da ilustração é apoiar o conteúdo e humanizar a interação de um produto com seus usuários. Desenvolver uma jornada agradável, transmitir emoções e motivar ações não é uma tarefa exclusiva do conteúdo textual.

Uma imagem agradável e bem pensada chama a atenção. Páginas de erro, mensagens e feedbacks da interface se tornam mais acessíveis quando acompanhados de uma ilustração.

Página de erro Ifood

Guiando o usuário

As ilustrações guiam o usuário através do fluxo, apoiando a navegação. Portanto, podemos encarar as Product Illustrations de um produto como uma fonte de resolução de problemas e uma forma de amenizar as frustrações que podem ocorrer dentro da interface. Se o usuário se perder no caminho, o produto precisa oferecer meios para voltar ou recomeçar o processo. O Produto pode levar a caminhos imprevisíveis, usar ilustrações auxilia na experiência e acolhe o usuário caso ele se encontre num lugar desconhecido da interface.

Página de busca Quinto Andar

Metáfora no Design de Produto

Segundo o dicionário, metáfora nada mais é do que uma figura de linguagem que produz sentidos figurados por meio de comparação. Mas, o que isso tem a ver com ilustração de produto?

Entregar ideias complicadas de maneira agradável e fácil de compreender é uma das tarefas do UX Design. Na hora de usar metáfora como ferramenta para a criação das ilustrações, é necessário ter uma visão ampla do propósito do produto e com isso entender a forma que a marca quer se comunicar para auxiliar na experiência de navegação.

Uma das maneiras mais eficientes de criar metáforas no design de produto (o que podemos chamar de metáfora pura) é relacionar o abstrato com o concreto. Por exemplo, quando o usuário cria sua loja no Shopify, ele tem a opção de personalizá-la:

O desenho não é literal. A ilustração representa a loja com o sorvete e a personalização seria escolher as coberturas.

Comece a ilustrar

Existem propriedades que toda ilustração deve cumprir para ter sucesso. Se você quiser começar a se aventurar pelo mundo das ilustrações de produto aqui vão algumas dicas:

A ilustração deve ser útil para o produto

Adicionar informações e apoiar o produto é uma das responsabilidades das ilustrações. Por isso é importante se perguntar o porquê de colocar uma ilustração aqui e ali, dentro da interface. Estude bem onde e quando colocá-las, ofereça uma compreensão mais profunda de sua ferramenta e transmita o tom e a voz da marca.

Guia de Ilustrações da Shopify

Seja consistente com o Product Illustration

Em UX Design levamos a consistência muito a sério e com as ilustrações isso não é diferente. Definir a paleta de cores, a espessura das linhas e as formas são importantes para manter uma coerência entre as ilustrações.

Ilustrações de Alice Lee desenvolvida para o WordPress

As product illustrations não têm um estilo exato e as tendências mudam a cada ano. O importante é a mensagem que você quer passar. Encontre um estilo que mais lhe agrade, busque muita referência e comece a desenhar, não precisa ficar perfeito de primeira. Lembre-se: a prática leva a perfeição.

Referências sobre Product Illustration:

• Why illustration is a vital part of your product
• Illustration is the product design
• What is product illustration
• Product illustration for people who don’t know anything about product illustration
• Effectively using metaphor in product illustration
• Building a new illustration style for shopify
• A color exercise for our brands illustration
• Ilustrando UX: inserindo ilustrações em produtos digitais