{"id":261561,"date":"2023-07-24T07:50:00","date_gmt":"2023-07-24T04:50:00","guid":{"rendered":"https:\/\/inform.click\/25-infograficos-interativos-para-o-designer-em-voce\/"},"modified":"2023-07-24T08:03:00","modified_gmt":"2023-07-24T05:03:00","slug":"25-infograficos-interativos-para-o-designer-em-voce","status":"publish","type":"post","link":"https:\/\/inform.click\/pt-pt\/25-infograficos-interativos-para-o-designer-em-voce\/","title":{"rendered":"25 infogr\u00e1ficos interativos para o designer em voc\u00ea"},"content":{"rendered":"

\n Desde o in\u00edcio do s\u00e9culo, os infogr\u00e1ficos tiveram um impacto poderoso na forma como vemos a m\u00eddia da web. No in\u00edcio, era revolucion\u00e1rio como o meio perfeito para representar dados e entreter o p\u00fablico.\n<\/p>\n

\n O sucesso dos infogr\u00e1ficos evoluiu desde ent\u00e3o. Apenas alguns anos atr\u00e1s, os infogr\u00e1ficos se tornaram extremamente populares com a erup\u00e7\u00e3o do marketing digital e da otimiza\u00e7\u00e3o de mecanismos de busca.\n<\/p>\n

\n Com sua popularidade, vieram v\u00e1rias mudan\u00e7as na forma como eram apresentados. Apenas o melhor dos melhores foi compartilhado nas m\u00eddias sociais, resultando em maior reconhecimento da marca e engajamento do consumidor.\n<\/p>\n

\n \u00c0 medida que o infogr\u00e1fico tradicional evoluiu para acompanhar as mudan\u00e7as nos gostos dos consumidores, ele trouxe ao mundo o infogr\u00e1fico interativo, que est\u00e1 se tornando a forma mais procurada de representa\u00e7\u00e3o de dados at\u00e9 hoje, tornando at\u00e9 mesmo alguns infogr\u00e1ficos est\u00e1ticos como desatualizados e irrelevantes.\n<\/p>\n

\n Para ajud\u00e1-lo a ficar \u00e0 frente do jogo com seu design gr\u00e1fico e criar um infogr\u00e1fico com potencial para se tornar viral, d\u00ea uma olhada nesta lista de infogr\u00e1ficos interativos incr\u00edveis.\n<\/p>\n

\n 1 Eastern Tennessee da Derby Supply Chain Solutions
\n<\/h5>\n

\n <\/a>\n<\/p>\n

\n Este infogr\u00e1fico projetado para descrever um pouco da hist\u00f3ria, cultura e curiosidades do leste do Tennessee usa rolagem de paralaxe para dar vida \u00e0 paisagem \u00e0 medida que v\u00e1rios fatos e informa\u00e7\u00f5es s\u00e3o relacionados. Isso torna o aprendizado sobre esse local espec\u00edfico muito mais agrad\u00e1vel!\n<\/p>\n

\n 2 A hist\u00f3ria completa das m\u00eddias sociais por AvaLaunch Media
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n Voc\u00ea provavelmente n\u00e3o sabia que a ra\u00e7a humana tinha uma vers\u00e3o da m\u00eddia social que datava de 1800, n\u00e3o \u00e9? Este infogr\u00e1fico permite que o usu\u00e1rio clique em diferentes per\u00edodos de tempo para descobrir a longa e interessante hist\u00f3ria das m\u00eddias sociais atrav\u00e9s dos tempos. A capacidade de controlar a velocidade e a ordem das informa\u00e7\u00f5es \u00e9 uma perspectiva empolgante para os consumidores.\n<\/p>\n

\n 3 Como funciona a pesquisa do Google
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n O Google provavelmente tem mais estat\u00edsticas e informa\u00e7\u00f5es para compartilhar sobre o uso e a navega\u00e7\u00e3o na Internet do que qualquer outra empresa, e eles compartilham alguns desses dados neste infogr\u00e1fico que explica a popularidade das pesquisas na Web e como elas funcionam por meio de uma hist\u00f3ria de tr\u00eas partes que os usu\u00e1rios podem percorrer em seu pr\u00f3prio ritmo.\n<\/p>\n

\n 4 navegadores da Web e resolu\u00e7\u00f5es por Webby Monks
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n Este despejo de informa\u00e7\u00f5es animadas \u00e9 simplesmente divertido. \u00c0 medida que voc\u00ea percorre o gr\u00e1fico brilhantemente colorido e repleto de informa\u00e7\u00f5es, gr\u00e1ficos atraentes aparecem para ajudar a aprimorar os dados e tornar a experi\u00eancia educacional muito mais divertida.\n<\/p>\n

\n 5 The Enlightened Happy Hour: um guia interativo para o que voc\u00ea est\u00e1 bebendo pela coluna cinco
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n Todo mundo adora happy hour, mas todas as calorias consumidas naquela sess\u00e3o n\u00e3o fazem muito pela sua cintura. Este infogr\u00e1fico usa uma configura\u00e7\u00e3o de barra e permite que voc\u00ea clique em diferentes tipos de bebidas para descobrir as informa\u00e7\u00f5es nutricionais de cada uma, incluindo calorias e teor alco\u00f3lico. Observe a natureza convincente dos recursos visuais.\n<\/p>\n

\n 6 Evolu\u00e7\u00e3o do Insight pela Vision Critical
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n Voc\u00ea pode n\u00e3o se importar com a hist\u00f3ria da pesquisa de mercado, mas ainda estar\u00e1 interessado em dar uma olhada neste infogr\u00e1fico cativante, que usa gr\u00e1ficos ousados \u200b\u200be uma variedade de p\u00e1ginas para compartilhar as hist\u00f3rias de muitas pessoas influentes e eventos desde 1900 at\u00e9 agora.\n<\/p>\n

\n 7 direitos pol\u00edticos das mulheres ao redor do mundo do The Guardian
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n Aprenda sobre os direitos das mulheres em v\u00e1rias partes do mundo e sobre o excelente design interativo com este infogr\u00e1fico animado. Os espectadores podem clicar em qualquer pa\u00eds ou regi\u00e3o do mundo para aprender sobre os direitos pol\u00edticos das mulheres de l\u00e1. Este infogr\u00e1fico \u00e9 brilhante porque os criadores est\u00e3o apresentando grandes volumes de informa\u00e7\u00f5es, mas os criadores do visual o apresentam de forma que os usu\u00e1rios possam obter as informa\u00e7\u00f5es que desejam sem se sentirem sobrecarregados.\n<\/p>\n

\n 8 Amea\u00e7as de Seguran\u00e7a no Varejo por Nuspire
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n Este infogr\u00e1fico interativo usa HTML5 e uma maquete de um espa\u00e7o de escrit\u00f3rio t\u00edpico para mostrar exatamente como as empresas s\u00e3o vulner\u00e1veis \u200b\u200baos hackers. Os visualizadores s\u00e3o direcionados a usar a barra de espa\u00e7o ou as teclas de seta para passar de uma amea\u00e7a \u00e0 seguran\u00e7a para outra. Isso ajuda a transmitir a mensagem, pois o visual mostra \u00e0s empresas os locais f\u00edsicos mais fracos. \u00c9 uma amea\u00e7a que eles podem realmente experimentar.\n<\/p>\n

\n 9 Por que voc\u00ea n\u00e3o deve beber e dirigir nos estacionamentos do centro da cidade em Leeds
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n Este infogr\u00e1fico \u00e9 inspirado durante as f\u00e9rias, quando beber e dirigir est\u00e1 no auge. Os consumidores podem dizer a esse infogr\u00e1fico quanto beberam e ele os informar\u00e1 se essa quantidade est\u00e1 ou n\u00e3o acima do limite legal. \u00c9 acompanhado de uma s\u00e9rie de estat\u00edsticas para promover ruas mais seguras.\n<\/p>\n

\n 10 voos interativos do The Guardian
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n Observe min\u00fasculos jatos e avi\u00f5es se cruzando no ar ao mesmo tempo para ver com que frequ\u00eancia os seres humanos voam. Ele mostra os hor\u00e1rios de maior movimento para voar e tamb\u00e9m as \u00e1reas que recebem mais tr\u00e1fego a\u00e9reo. \u00c9 uma representa\u00e7\u00e3o de dados fascinante, para dizer o m\u00ednimo, que incentiva a explora\u00e7\u00e3o pessoal por meio dos dados.\n<\/p>\n

\n 11 13 raz\u00f5es pelas quais seu c\u00e9rebro deseja infogr\u00e1ficos da NeMam Studios
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n Caso voc\u00ea tenha esquecido por que os infogr\u00e1ficos fazem tanto sucesso, este gr\u00e1fico animado ir\u00e1 lembr\u00e1-lo. Com cores vivas, rolagem paralaxe e a quantidade certa de movimento gr\u00e1fico, esse + visual mant\u00e9m os espectadores entretidos e informados at\u00e9 o fim.\n<\/p>\n

\n 12 Mapeando os mortos: mortes por armas desde Sandy Hook por The Huffington Post
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n Este gr\u00e1fico s\u00f3brio mostra as regi\u00f5es mais comuns de mortes por armas de fogo nos Estados Unidos desde o tiroteio na escola prim\u00e1ria de Sandy Hook. O assunto do infogr\u00e1fico \u00e9 triste, mas a apresenta\u00e7\u00e3o \u00e9 brilhante para passar a mensagem.\n<\/p>\n

\n 13 Drible: Para que serve? por Dribbble LLC
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n Quase todos os elementos neste infogr\u00e1fico HTML5 ganham vida quando voc\u00ea move o cursor para mostrar um elemento diferente de como usar o Dribble. Embora muitas das informa\u00e7\u00f5es neste gr\u00e1fico possam ser mais espec\u00edficas, o uso de anima\u00e7\u00e3o torna extremamente f\u00e1cil e interessante acessar o conte\u00fado.\n<\/p>\n

\n 14 Como funciona um motor de carro de Animagraffs
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n Este infogr\u00e1fico acerta em cheio com seus gr\u00e1ficos, j\u00e1 que entender como o motor de um carro funciona \u00e9 realmente algo que voc\u00ea precisa ver em a\u00e7\u00e3o. ele explica em c\u00e2mera lenta como o motor ganha vida com uma s\u00e9rie de gr\u00e1ficos mostrando o que cada pe\u00e7a do motor faz.\n<\/p>\n

\n 15 Quantas fam\u00edlias s\u00e3o como a sua? do The New York Times
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n Se voc\u00ea j\u00e1 se perguntou se a situa\u00e7\u00e3o de sua fam\u00edlia \u00e9 \u00fanica, este visual interativo lhe dar\u00e1 a resposta. O usu\u00e1rio pode escolher uma variedade de op\u00e7\u00f5es de tamanhos de fam\u00edlia e situa\u00e7\u00f5es para saber como o resto do pa\u00eds se compara. N\u00e3o \u00e9 t\u00e3o atual quanto poderia ser, mas ainda \u00e9 uma excelente representa\u00e7\u00e3o da maneira correta de usar gr\u00e1ficos animados.\n<\/p>\n

\n 16 O brilhante futuro do compartilhamento de carros
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n Ao visualizar este infogr\u00e1fico, voc\u00ea entra em um pequeno carro verde e dirige no seu pr\u00f3prio ritmo para descobrir como o compartilhamento de carros deve mudar ao longo dos anos. H\u00e1 mais de uma maneira de interagir com este infogr\u00e1fico. Voc\u00ea pode rolar de um lado para o outro para mover o carro ou passar o mouse sobre certos elementos do visual para obter mais informa\u00e7\u00f5es. M\u00faltiplas formas de intera\u00e7\u00e3o s\u00e3o extremamente eficazes para manter os espectadores envolvidos do come\u00e7o ao fim.\n<\/p>\n

\n 17 contos de peixes verdadeiros da United Marine
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n Este site \u00e9 o sonho de um pescador. Ele n\u00e3o apenas revela alguns dos principais peixes de ca\u00e7a em todas as \u00e1reas, mas tamb\u00e9m compartilha as hist\u00f3rias daqueles que enfrentaram o maior peixe de rapina e venceram. \u00c9 f\u00e1cil passar de um ponto de informa\u00e7\u00e3o para outro, e as hist\u00f3rias dos peixes grandes s\u00e3o cativantes.\n<\/p>\n

\n 18 gigantes famintos da tecnologia da Simply Business
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n Este infogr\u00e1fico compara o crescimento de cinco grandes empresas de tecnologia. Ele mostra tanto o tempo de crescimento quanto o valor que cada neg\u00f3cio rendeu. Se voc\u00ea clicar no \u00edcone de cada empresa, ser\u00e1 direcionado para uma p\u00e1gina sobre a situa\u00e7\u00e3o financeira de cada empresa, o que \u00e9 uma forma muito eficaz de transmitir muitas informa\u00e7\u00f5es, mantendo a integridade do visual.\n<\/p>\n

\n 19 A Evolu\u00e7\u00e3o da Web
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n D\u00ea uma olhada na forma como este gr\u00e1fico se move lentamente desde o in\u00edcio da internet at\u00e9 onde estamos hoje. O come\u00e7o simples que leva a um estado mais complexo mostra efetivamente o qu\u00e3o grande e difundida a internet se tornou em apenas 20 anos. Para completar, o usu\u00e1rio pode selecionar entre v\u00e1rios idiomas.\n<\/p>\n

\n 20 Evolu\u00e7\u00e3o da colabora\u00e7\u00e3o social pelo Autodesk 360
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n D\u00ea um passeio pela rua desde a d\u00e9cada de 1950 at\u00e9 o presente e aprenda sobre alguns dos parceiros mais influentes em colabora\u00e7\u00e3o. O usu\u00e1rio pode clicar em cada per\u00edodo de tempo e explorar o hist\u00f3rico \u00e0 vontade. O infogr\u00e1fico mant\u00e9m o espectador envolvido at\u00e9 o final, quando a empresa revela sua chamada \u00e0 a\u00e7\u00e3o. Outra representa\u00e7\u00e3o de um gr\u00e1fico que pode converter um p\u00fablico com efici\u00eancia.\n<\/p>\n

\n 21 Conectando: como as pequenas empresas usam a tecnologia de bons infogr\u00e1ficos
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n Um dos maiores desafios dos infogr\u00e1ficos \u00e9 apresentar um grande volume de informa\u00e7\u00f5es sem sobrecarregar o p\u00fablico. Esse visual faz exatamente isso sem problemas, permitindo que o visitante clique no infogr\u00e1fico para ler os dados. O visual \u00e9 atraente e informativo, levando o leitor a uma conclus\u00e3o l\u00f3gica.\n<\/p>\n

\n 22 Evolu\u00e7\u00e3o do console de jogos de Design by Soap
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n Veja quanto custava um console de jogos constru\u00eddo em 1972 em compara\u00e7\u00e3o com agora. O visual leva voc\u00ea de um ano para o outro, mostrando cada console criado, o ano em que foi feito e o custo na \u00e9poca e agora. Cada p\u00e1gina do console tem um local onde os usu\u00e1rios do infogr\u00e1fico podem ler mais informa\u00e7\u00f5es sobre o console individual.\n<\/p>\n

\n 23 jornadas \u00e9picas de jogos de console por Butler's Bingo
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n Os jogadores de todos os lugares adoram este infogr\u00e1fico que compartilha algumas informa\u00e7\u00f5es perspicazes sobre v\u00e1rios videogames populares. Voc\u00ea pode selecionar entre v\u00e1rios jogos diferentes e descobrir informa\u00e7\u00f5es sobre o enredo e as miss\u00f5es dentro do jogo. \u00c9 f\u00e1cil clicar e aproveitar as informa\u00e7\u00f5es apresentadas. \u00c9 o infogr\u00e1fico perfeito para empresas que procuram atrair o geek interior dos consumidores.\n<\/p>\n

\n 24 A Origem Explicada por Togethera
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n Lembra do filme A Origem, de 2010, com Leonardo DiCaprio e Joseph Gordon-Levitt? \u00c9 incompreens\u00edvel para dizer o m\u00ednimo. Se voc\u00ea \u00e9 um dos muitos que tiveram dificuldade em acompanhar todo o conceito de cria\u00e7\u00e3o e como os personagens passaram de um est\u00e1gio para o outro, este infogr\u00e1fico \u00e9 para voc\u00ea. Mais importante, este infogr\u00e1fico \u00e9 um \u00f3timo exemplo de como contar uma hist\u00f3ria com t\u00e1ticas de paralaxe.\n<\/p>\n

\n 25 Bond: Licen\u00e7a para Dirigir
\n<\/h5>\n

\n \"\"<\/a>\n<\/p>\n

\n Este infogr\u00e1fico tem algo para todos. Para os f\u00e3s de carros, mostra alguns dos carros mais legais da hist\u00f3ria dos filmes de Bond. Para fan\u00e1ticos por Bond, mostra um pouco sobre cada filme de Bond feito (incluindo aquele que ainda n\u00e3o saiu). E para designers, mostra uma maneira excepcional de manter seu p\u00fablico cativado do come\u00e7o ao fim com esse visual interativo.\n<\/p>\n

\n Cada um desses exemplos oferece algo para aprender sobre design de infogr\u00e1fico bem-sucedido. Ao estudar cada um desses gr\u00e1ficos, voc\u00ea encontrar\u00e1 coisas que considera brilhantes e coisas que n\u00e3o funcionam t\u00e3o bem. De qualquer forma, ajudar\u00e1 a fornecer a inspira\u00e7\u00e3o necess\u00e1ria para um design gr\u00e1fico eficaz em 2015.\n<\/p>\n<\/p>\n

\n Fonte de grava\u00e7\u00e3o: instantshift.com<\/a>\n<\/div>\n","protected":false},"excerpt":{"rendered":"

Desde o in\u00edcio do s\u00e9culo, os infogr\u00e1ficos tiveram um impacto poderoso na forma como vemos a m\u00eddia da web. No in\u00edcio, era revolucion\u00e1rio como o meio perfeito para representar dados e entreter o p\u00fablico. O sucesso dos infogr\u00e1ficos evoluiu desde ent\u00e3o. Apenas alguns anos atr\u00e1s, os infogr\u00e1ficos se tornaram extremamente populares com a erup\u00e7\u00e3o do marketing digital e da otimiza\u00e7\u00e3o de mecanismos de busca. Com sua popularidade, vieram v\u00e1rias mudan\u00e7as na forma como eram apresentados. Apenas o melhor dos melhores foi compartilhado nas m\u00eddias sociais, resultando em maior reconhecimento da marca e engajamento do consumidor. Como o infogr\u00e1fico tradicional\u2026<\/p>\n","protected":false},"author":1,"featured_media":135755,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[202,228,59],"tags":[],"class_list":["post-261561","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-designer-de-web","category-livros-didaticos","category-web-e-wordpress-2"],"_links":{"self":[{"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/posts\/261561","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/comments?post=261561"}],"version-history":[{"count":0,"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/posts\/261561\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/media\/135755"}],"wp:attachment":[{"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/media?parent=261561"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/categories?post=261561"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/inform.click\/pt-pt\/wp-json\/wp\/v2\/tags?post=261561"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}