Contação de histórias interativa e sua aplicação na indústria de web design

Ter o elemento gráfico é a necessidade de todo site hoje em dia. Sem o uso adequado de recursos visuais, você simplesmente não pode transmitir sua mensagem ao visitante, melhor ainda, fazer com que ele abandone seu site.

Os recursos visuais têm o potencial de atingir a mente do espectador e atraí-lo para qualquer coisa que você esteja tentando apresentar, vender ou investir. Para usar os recursos visuais a seu favor e ganhar tráfego da forma mais rápida possível, o melhor método para engajar e converter o visitante é por meio da narrativa interativa.

Por que contar histórias?

Eu sei o que deve estar passando pela sua cabeça agora. O que Cinderela ou Rapunzal tem a ver com a experiência visual de um site? Bem, contar histórias não se limita apenas a contos de fadas e franquias da Disney, mas contar histórias é uma maneira eficaz no mix de marketing de qualquer site que pretenda ficar no topo da concorrência.

Como criar uma história interativa

É preciso muito planejamento e teste para conectar o design com a história, então, quando você o mostra na página de destino do seu site, você não faz papel de bobo. Seus visuais não precisam ser uma obra-prima de vários designers e um CGI caro. Você pode contar sua história com um único banner de imagem bem articulado. No entanto, o desafio se apresenta quando sua narrativa cruza com o objetivo do seu site. Sobre o que é o seu site? Qual é o logotipo da sua marca e por que ela está vendendo o que vende? Tudo o que você explica através do visual deve ser único, sem um centímetro de plágio. Deve se tornar tão atraente que, depois de visitar seu site uma vez, as pessoas comecem a compartilhá-lo, falar sobre ele e revisitá-lo novamente.

Como funciona

Há uma grande disparidade entre um site que tem imagens, gráficos e animação versus uma plataforma centrada em texto sem graça que você chama de site. É impossível julgar as pessoas e antes que você possa ter uma conversa adequada, elas se foram. Elementos multimídia são injetados para evitar isso. Quando um cliente vê um texto simples descrevendo um produto, há uma sensação de compulsão para ler os alfabetos e as palavras da declaração, enquanto uma imagem, vídeo ou animação gráfica é tão fácil de ver quanto de compreender.

Vendendo um grande produto com uma história curta

Uma empresa que vende automóveis tem muito o que preencher antes de poder fazer qualquer venda por meio de sua plataforma online. Comprar carros online exige muita coragem do cliente porque grandes somas estão envolvidas. Se o site não chamar a atenção do cliente, então não passa de lixo flutuando na internet. Vender carros, caminhões ou máquinas pesadas online certos ângulos de marketing para expor os USPs (pontos de venda exclusivos) do produto. Conheço um site de carros que usou a técnica perfeita de contar histórias para mostrar seu toque especial na tela do cliente.

Exemplo :

Lexusls.asia é uma ramificação da Toyota que vende carros de luxo. No site, os designers utilizaram brilhantemente a rolagem de paralaxe para apresentar o carro com texto suficiente para levar o visitante. Então, de repente, um pneu rola da direita e mostra algumas outras características interessantes do carro. À medida que você rola mais para baixo, o site não o solta e com alguns gráficos legais descreve o propósito e os benefícios do carro.

Linguagem Visual

A linguagem visual tem a capacidade de explorar a própria base do design centrado no ser humano. A linguagem visual remonta a muito antes de qualquer alfabeto ser inventado, pois as pinturas rupestres eram o meio básico de comunicação. As pinturas rupestres funcionaram como fonte de narrativa, guia para sobreviver e evitar potenciais perigos que faziam parte daquele período. Mais ou menos, os desenhos das cavernas são a forma mais antiga de dados visuais.

Sabemos que imagens e vídeos possuem um grande poder comunicativo, como aproveitar esse poder por meio de pixels?

Exemplo :

É quando sua própria imaginação entra em jogo. Adicionar imagens e vídeos com o texto de mistura certo para que seu site fale por si.

Bellroy.com vende suas carteiras de couro com a garantia de maior espaço com designs mais finos. Como eles mostram isso é através de um elegante slider com imagens HD de uma carteira contra a outra. À medida que o controle deslizante se move, a história também e, em 10 imagens, a mesma quantidade de cartões é colocada em sua carteira de marca, enquanto deforma a outra carteira mais do que realmente é. Aqui a conclusão é marcante e com uma moral de sobra.

Projete a história

É bastante semelhante a escrever uma peça quando você cria uma história visual. Todos os aspectos e elementos da peça estão presentes em seu site e se misturam com tanta intimidade que se fundem completamente com a história que você introduziu. Sua história começa com a configuração que você organizou, depois se move em direção ao conflito e termina com uma resolução.

Este site, por exemplo, tem uma maneira única de pegar o visitante pelo braço e convidar para um baile repleto de emoções e deleites visuais.

Os usuários devem estar bem cientes da história, pois ela os leva ao seu destino. E é aí que o visitante se torna o lead, e o lead se torna o cliente. É justo que o produto ou serviço que você planeja apresentar por meio do processo de contar histórias tenha algo que o usuário precise, uma funcionalidade exclusiva ou uma margem de preço que o cliente esteja procurando.

Exemplo :

O Bagigia.com primeiro oferece ao visitante uma introdução do varejista, seguida de imagens 3D simples, porém profundas, do próprio produto com texto emocional para manter a história em andamento. O amplo espaçamento em branco no design ajuda o usuário a se concentrar, pois o produto se destaca no centro, trazendo a história para a ação e para a resolução.

Usando a história animada a seu favor

É verdade. A animação do site foi vítima de uso excessivo sem levar em conta convenções ou padrões e essa é a principal razão por trás de sua queda nos últimos 5 anos. Ironicamente, muito poucos designers sabem como o uso de animação inteligente e pontual pode transformar sua história em Dark Knight Movie. A animação é construída para cobrir o que as imagens estáticas não podem completar, ao mesmo tempo em que adiciona diversão ao próprio design.

Exemplo :

Falando em DarkKnight, este aplicativo para iOS em benthebodyguard.com permite proteger e criptografar informações em seu site que apresentam uma animação passo a passo (literalmente) enquanto você desce com 'Ben' no meio, o guarda-costas que jurou proteger suas informações com uma reputação formidável. Este site exemplificou como a animação pode ser usada da melhor maneira para produzir a história de propósito ideal para um produto.

Traduzindo a mensagem do projeto

Não é uma surpresa para você como um design que é simplesmente uma mistura de artes visuais e gráficos pode produzir empatia dentro de você? Eu sei que tenho. Nós, como seres humanos, reagimos aos nossos sentidos animais tanto quanto qualquer outro organismo que seja fiel à sua natureza. Quando vemos um galã – fazemos como programado. Aproveitando essa característica do comportamento humano, sua história nem sempre precisa ser um buzz kill sobre seu manifesto e produtos, porque isso é provavelmente o que todos os outros proprietários de sites têm em mente hoje em dia. Quando você adiciona um senso de sentimento, espírito e moral, sua história se transforma em uma mensagem.

Exemplo :

Este site everylastdrop.co.uk leva você a uma jornada de seu uso diário de água em sua casa e arredores. Ler sobre os fatos sobre quanta água é desperdiçada todos os dias é muito comum e muitas vezes nunca é levado a sério. Esse pequeno inocente que usa água indiscriminadamente em sua rotina diária não apenas destaca a importância da água, mas também a coloca em contraste com aqueles que mais precisam dela em partes difíceis do mundo. Cresce tanto na mente do espectador que ele provavelmente pensaria duas vezes antes de desperdiçar outra gota de água na próxima vez.

Usando elementos escuros

Romances são divertidos de ler e com as recentes escaladas tecnológicas, agora é necessário que eles sejam lidos fora dos livros. Até hoje, a grande maioria dos usuários online ainda prefere julgar o livro pela capa do que realmente ler o prólogo. Para enfrentar esses usuários online e atraí-los para o produto, muitos escritores costumam contratar desenvolvedores para criar sites dedicados aos seus romances. Um ensaio passo a passo do romance com sequências animadas não apenas dará à história os fogos de artifício de que ela precisa, mas também atrairá o usuário on-line para lê-la.

Exemplo :

Usando o mesmo princípio e estrutura, o aclamado conto de Nam Le 'The Boat' foi convertido em uma graphic novel interativa, criando um mundo de tempestades devastadoras oceânicas forçando um barco dos terrores da Guerra do Vietnã. A melhor coisa que qualquer um pode fazer em sua festa de contar histórias é adicionar som ao seu design. Este é o superlativo de contar histórias animadas para adquirir UX. Veja aqui.

Envolvente e cheio de ilustração, é realmente a prova de como você pode gerenciar um produto criando um design que se move à medida que você interage com ele.

Unificação da rolagem

No setor de comércio eletrônico, as pessoas geralmente estão interessadas em obter os benefícios de um produto que pode ser usado em várias instâncias, mas pelo mesmo motivo. Por um lado, torna a vida deles muito mais fácil, e dois, faz parte da era tecnológica. Mas com tanto a aprender e reconhecer sobre um empreendimento como esse, é muito menos provável que os clientes arrisquem algo que tenha implicações futuristas e sirva ao seu propósito com muita facilidade, tornando-o bom demais para ser verdade. Eu vi empresas que tentaram vender esses produtos com muito a concordar e o resultado foi o abandono trágico.

Exemplo :

No entanto, este produto não só consegue vender, mas também cumprir o que promete aos seus clientes. Este Produto em onlycoin.com é um cartão único que carrega todos os seus cartões de crédito dentro dele. O processo de contar histórias ajuda o espectador a entender a complicação de carregar muitos cartões na carteira com raciocínio, mas com a exibição gráfica do passo a passo da otimização do cartão e do transporte compacto, fica difícil discordar das aplicações prometidas do produto.

Conclusão

Contar histórias não se limita apenas a qualquer produto ou objetivo; está aberto a todos os tipos de exercícios de comércio eletrônico que ajudam os visitantes a obter o UX ideal sem comprometer a funcionalidade do design. Aprender a dominar isso para seus próprios produtos e serviços por meio de sites de comércio eletrônico é imperativo nesta era do marketing eletrônico. Sem ler a mentalidade do consumidor, você simplesmente não pode lançar seu produto e, sem demanda, não há produção. Como diz Tim O'brien, “Contar histórias é a atividade humana essencial, quanto mais difícil a situação, mais essencial ela é”, e acredite em mim amigo, a situação nunca fica mais fácil.