Vida útil visual – Por que as ilustrações de web design ficam obsoletas

Publicados: 2022-03-11

A ilustração é uma forma vibrante e variada de comunicação visual. Como disciplina de design, mescla a clareza da mensagem do design gráfico e a capacidade expressiva das artes plásticas. No auge, a ilustração faz algo que a fotografia não consegue. Ele retrata o que é familiar de uma perspectiva que é inatingível com os olhos humanos.

O recente influxo de marcas usando ilustração online é uma das melhores coisas que aconteceram na web em muito tempo. Ele trouxe vibração, humor e clareza a uma série de propostas de negócios e permitiu que as empresas contassem suas histórias com mais clareza.

Ilustração de webdesign
A ilustração retrata o mundo de maneiras familiares e inesperadas (aplicativo Emaar EMR).

Apesar dos pontos positivos, há problemas. Em sua essência, a ilustração é uma ferramenta de contar histórias, mas à medida que sua popularidade aumenta, ela se torna obrigatória. Temos um site, portanto, devemos ter ilustrações .

Sem visão estratégica, a ilustração é ornamentação, a antítese da originalidade. A história é descartada, a imaginação abandonada. Sites individuais perdem distinção e todos os produtos e serviços ilustrados se misturam.

Um funcionário bem vestido está sentado em uma mesa arrumada operando uma interface abstrata que se funde com o mundo real enquanto textos e e-mails voam em aviões de papel que pousam em um gato cochilando ao lado de uma planta frondosa emoldurando uma pessoa fazendo ioga enquanto bebe kombucha e navega em um app de onde emerge uma mão gigante que assina um contrato com uma caneta-tinteiro de grandes dimensões .

Com certeza você já viu.

Existem quatro culpados que ameaçam a viabilidade a longo prazo da ilustração na web.


Culpado 1: as imagens carecem de inteligência

A origem

A ilustração tem uma rica história de instigação. Por centenas de anos, tem sido usado como uma forma de comentário social. Por quê? Porque esclarece de maneira pungente a natureza complexa dos assuntos humanos. Quando as pessoas são contraditórias, quando as experiências são confusas, a ilustração torna isso óbvio – em um instante.

O objetivo da ilustração não é a controvérsia por si só. Em vez disso, o objetivo é fazer com que as pessoas parem e ponderem sobre um ponto de vista, mesmo que entre em conflito com o seu. Na melhor das hipóteses, a ilustração é o momento aha final.

O problema

A demanda atual por conteúdo visual roubou muito dos poderes elucidativos da ilustração contemporânea da web. Online, a ilustração raramente instiga; principalmente, instrui ou embeleza.

Em muitos sites, as ilustrações são representações visuais 1 para 1 do texto com o qual estão emparelhadas. Experimente nosso recurso exclusivo de agendamento! [Inserir ilustração monoline do calendário]

Ou retratam pessoas vivendo cenários de “melhor vida” graças a produtos e serviços adquiridos. Experimente nosso recurso exclusivo de agendamento! [Inserir ilustração de um laptop bebendo café cumprimentando um calendário de carinha sorridente]

Nenhuma das abordagens é potente o suficiente para evitar que as ilustrações de sites percam sua arrogância de contar histórias.

O remédio

Alguns conceitos são difíceis de ilustrar. Existem produtos e serviços que não são empolgantes ou facilmente vinculados às experiências humanas. Aqui, os ilustradores devem se aprofundar durante a criação do conceito. Para descobrir os ângulos mais atraentes de um tópico, explore seu lado sombrio.

  • Quais são os grandes pontos de dor e por que eles existem?
  • Quem é mais afetado financeiramente, profissionalmente ou emocionalmente?
  • Existem pontos de vista conflitantes ou controversos entre empresas, clientes ou especialistas?

Perguntas como essas funcionam com a maioria dos produtos vendidos online. Como ilustradores, muitas vezes temos a tarefa de mostrar o que há de bom, mas se não entendermos o que há de ruim, buscaremos tropos cansados. Na verdade, esse equilíbrio positivo/negativo é um aspecto fundamental da narrativa. Sem os baixos, os altos ilustrativos perdem seu impacto.

Trabalho bem feito: Grande Cartel

Ilustrações para webdesign
As ilustrações do blog do Big Cartel são bem-humoradas e espirituosas, como este tríptico que destaca a agilidade de seu checkout digital.


Culpado 2: Imitação Descontrolada Arruina Novidade

A origem

Imitação e criatividade não são diametralmente opostas. Desde as primeiras civilizações do mundo, artistas e designers cultivaram a criatividade através da mímica. Um estilo atraente chama a atenção. Nós o examinamos, desconstruímos e coletamos sua técnica para aprimorar nosso próprio trabalho. Isso é crescimento.

Em um mundo perfeito, a imitação estaria confinada ao aprendizado e ao comentário. Os estilos copiados seriam transformados, tanto visualmente quanto conceitualmente. Raramente funciona assim.

O problema

A imitação rejeita a evolução. Quando encontramos um estilo popular e nos ligamos à sua órbita, somos como aprendizes do velho mundo com um toque sinistro. Apropriamo-nos dos atributos estilísticos dos ilustradores que “seguimos” e promovemos os resultados como nossos.

As marcas são cúmplices. A empresa X quer o estilo de ilustração da empresa Y, então eles encomendam uma imitação. Isso acontece repetidamente, site após site, cada iteração introduz novas camadas de entropia. Eventualmente, toda uma indústria emprega um desfile de clones degenerados, como Michael Keaton em Multiplicity .

Não procure mais do que o estilo de ilustração predominante do cenário SaaS. É vergonhosamente homogêneo.

O remédio

Existem inúmeros caminhos além da imitação. Nenhum requer gênio criativo ou a exclusão da inspiração externa. Muito pelo contrário; ilustradores precisam de ampla exposição ao material de referência. Quanto mais vemos e armazenamos, mais podemos reinterpretar. Uma série de exercícios exploratórios são possíveis:

  • Mashup de história . Reimagine um estilo de ilustração inspirador através dos olhos de um artista talentoso.
  • Redesenho rápido . Desenhe cuidadosamente um objeto ao fazer referência ao estilo de outro ilustrador. Em seguida, redesenhe rapidamente o mesmo objeto de 7 a 10 vezes sem o estilo de referência e abrace as peculiaridades que surgirem.
  • Adicione uma regra . Crie uma restrição que afete o processo de ilustração. Por exemplo: só posso desenhar linhas retas. Eles podem ter qualquer comprimento ou ângulo, mas devem ser retos.
  • Interruptor de ferramenta . Imite um estilo de ilustração com uma ferramenta de desenho inadequada para o trabalho. Por exemplo, se o estilo depende de linhas precisas, replique-o com tinta e um pincel de cerdas macias.
  • Interpretação cega . Compile uma coleção de 3-4 estilos de ilustração atraentes e peça a um colega que descreva um por escrito. Descarte todos os estilos de referência originais e use a descrição escrita para informar escolhas criativas.

Trabalho bem feito: Toggl

Ilustrações em sites
Com seu estilo 3D e senso de ironia, o Toggle contraria a tendência atual de ilustrações de web design em 2D.


Culpado 3: Os sistemas de ilustração ficam velhos e rígidos

A origem

A nossa é uma era de obsessão pelo sistema de design, decorrente da necessidade de manter experiências consistentes em vários pontos de contato da marca. Não que os sistemas de design sejam novos. Os sistemas editoriais existem há mais de um século, mas o pensamento sistêmico é urgente, dado o número de canais digitais que as marcas utilizam agora.

Da mesma forma, as marcas empregam estilos de ilustração distintos há décadas, mas os sistemas de design modernos introduziram uma nova consideração: como tornamos nosso estilo de ilustração sistemático?

Cores, texturas, proporções e tipos de corpo são cuidadosamente definidos. Os resultados são exibidos com muita fanfarra. O tempo revelou uma falha.

O problema

Ilustração e design de interface não são a mesma coisa. Quando um sistema de design informa o estilo de uma interface, o resultado é uma coesão feliz que orienta os usuários em seu ambiente digital. A arquitetura da informação é um marco. A navegação é um hábito. Mas um estilo ilustrativo liderado pelo sistema sufoca o impulso criativo – essa súbita ignição de novas ideias freneticamente capturadas e refinadas.

Não é que os sistemas sejam inerentemente ruins. Quando os sistemas trabalham em apoio aos conceitos de imagem, os ilustradores podem realmente achar as restrições libertadoras. Mas quando as imagens são concebidas através das lentes de um sistema, as ideias enfraquecem enquanto os ilustradores repousam na falsa confiança da coesão: ela se encaixa no sistema, então funciona!

Gradualmente, mais esforço é direcionado à manutenção do sistema. Pesos de linha e artigos de vestuário anulam conceitos convincentes. Finalmente, o estilo e a capacidade de contar histórias da ilustração murcham e morrem.

O remédio

A ilustração traduz a complexidade do engenho e da emoção humana. Convida as pessoas de fora a apreciar experiências às quais podem não estar acostumados. A capacidade da ilustração de ser um veículo de identidade de marca é secundária. Estes não devem ser revertidos.

Para evitar que as imagens fiquem rígidas, construa sistemas de ilustração com base em princípios temáticos. A voz e os valores de uma marca não são apenas fontes para decisões estilísticas. São estratégias de contar histórias que podem ser vistas, interpretadas e recontadas a partir de múltiplas perspectivas — do cliente, da empresa e da concorrência.

Existem etapas práticas que orientam o desenvolvimento e a relevância a longo prazo dos sistemas de ilustração:

  • Não fique obcecado com regras e detalhes que o espectador médio não notará.
  • Evite impor as diretrizes do sistema de uma forma que prejudique a intuição criativa.
  • Não prenda os sistemas nas mesmas paletas de cores das marcas que eles representam.
  • Ocasionalmente, quebre o sistema e desafie os espectadores, convidando ilustradores externos a contribuir com seus próprios estilos únicos.
  • Planeje a evolução do sistema e permita a experimentação incremental, mesmo quando o estilo atual for bem recebido.

Trabalho bem feito: Notion.so

Estilos de ilustração da Web
Muitos sistemas de ilustração são excessivamente estilizados e carregados de regras. Pelo contrário, o sistema de ilustração monocromática da Notion é simples, consistente e expressivo.


Culpado 4: as ilustrações são usadas em demasia

A origem

Muitas empresas exigem grandes quantidades de conteúdo visual em seus sites, mas as restrições de tempo e orçamento limitam o número de gráficos personalizados que podem ser encomendados. Para preencher a necessidade, as empresas recorrem a sites de ações onde compram conjuntos temáticos de ilustrações.

Infelizmente, é raro encontrar ilustrações originais, de alta qualidade e subutilizadas (para não mencionar a marca).

O problema

Uma tendência preocupante surgiu no mundo da ilustração de ações. No que pode ser descrito apenas como uma homenagem equivocada à era do clipart, agora existem sites de ilustração que geram instantaneamente imagens “personalizadas”, permitindo que os usuários definam variáveis ​​como sexo, tom de pele e roupas. As ilustrações resultantes são uma mancha na credibilidade criativa das empresas que as utilizam.

O remédio

Para empresas com recursos limitados, existem duas maneiras de contornar a vibração falsa associada às imagens de banco de imagens. O primeiro pode ser uma surpresa. Abrace as ilustrações de ações de todo o coração. Vá com tudo. Use imagens de banco de imagens sem reservas, mas encontre maneiras de personalizá-las. Quão?

  • Misture e combine diferentes estilos de estoque com colagem digital.
  • Combine ilustrações de banco de imagens com fotografia (até mesmo fotografia de banco de imagens).
  • Sobreponha elementos desenhados à mão, como marcas de caneta ou traços de tinta.
  • Faça traçados de amostras de estoque digitalmente deformadas e distorcidas.
  • Converta estoque em escala de cinza e infunda cores da marca com gráficos desenhados digitalmente.

A segunda maneira de evitar o estoque enquanto trabalha em um orçamento é priorizar quais ilustrações são mais necessárias e pedir um pequeno conjunto. Talvez isso signifique encomendar cinco ilustrações da página inicial. No curto prazo, eles vão proporcionar impacto visual e, mais tarde, podem ser usados ​​para informar um conjunto maior de ilustrações para outros canais.

Trabalho bem feito: Bloomberg Businessweek

Tendências de ilustração da web
As capas impressas da Bloomberg há muito utilizam imagens de estoque para um efeito dramático (e hilário). Online, a tradição continua, como evidenciado por esta colagem de fotos inteligente.


Crie Ilustrações de Web Design com Propósito

Na web, a ilustração torna os serviços mais relacionáveis ​​e os produtos mais desejáveis. Ele fortalece a narrativa da marca e ajuda os visitantes do site a entender os fluxos intermináveis ​​de informações que encontram diariamente. Mas apenas ter ilustrações em um site não é suficiente.

As ilustrações que não conseguem ir além das representações 1 para 1 de seu texto correspondente são uma oportunidade de engajamento desperdiçada. Da mesma forma, há pouco valor em ilustrações que podem ser confundidas como pertencentes a uma das centenas de outras marcas.

As ilustrações devem cativar os espectadores com um ponto de vista único - estilisticamente e conceitualmente. Eles não precisam ser complexos, fotorrealistas ou repletos de cores para serem notados, mas precisam iluminar algo interessante sobre seus assuntos de uma maneira que palavras, fotos e diagramas não podem.

A ilustração veio para ficar. Seus poderes comunicativos são muito persuasivos para serem descartados. Mas para empresas e ilustradores que não exploram o potencial expressivo da ilustração, seu valor será passageiro.

• • •

Leia mais no Blog Toptal Design:

  • Ilustração de marca 101: Visualizando a narrativa
  • Um guia passo a passo para projetar ilustrações personalizadas sem nenhuma habilidade de desenho
  • Explorando os Princípios de Design da Gestalt
  • Retrospectiva de tendências de design de UX 2019
  • Os princípios do design e sua importância