Interactieve vis-infographic is een reeltraktatie

Schrijver: Peter Berry
Datum Van Creatie: 17 Juli- 2021
Updatedatum: 13 Kunnen 2024
Anonim
Interactieve vis-infographic is een reeltraktatie - Creatief
Interactieve vis-infographic is een reeltraktatie - Creatief

Inhoud

Veel infographics drijven door ons bij Creative Bloq, maar True Fish Tales heeft ons echt verslaafd. Het speelt in op het idee dat vissers beroemd zijn vanwege het vertellen van sterke verhalen door een aantal verbazingwekkende 'waargebeurde verhalen' samen te brengen over de monsters die op de loer liggen onder de zee. . Wat het onderscheidt, is de soepele en gebruiksvriendelijke interactiviteit, waardoor het ontdekken van de inhoud een leuke en vermakelijke ervaring wordt.

De infographic is samengesteld door Brian Maier en Mark Shelton van het Kentucky-bureau DBS> Interactive als onderdeel van een voortdurende inspanning om nieuwe inhoud toe te voegen aan de United Marine-website.

"Ons doel was om een ​​echt interactieve infographic te maken als belangrijkste focus voor inhoud", legt John Lewis van DBS> Interactive uit. "Dus naast het maken van hotspots en animaties, hebben we een optie toegevoegd voor gebruikers om hun eigen informatie toe te voegen, die we zullen verifiëren en aan de infographic zullen toevoegen."


Maier en Shelton gebruikten een combinatie van CSS3 en JavaScript om de infographic te bouwen. "Veel van de animaties en afbeeldingen worden afgehandeld met CSS3", vervolgt Lewis, "maar ze gebruikten op sommige plaatsen JavaScript om plaats te bieden aan oudere browsers die deze technologie nog niet ondersteunen.

JavaScript wordt gebruikt om de pinnen op de kaart te positioneren. "We hebben hier JavaScript gebruikt om ons in staat te stellen de kaart te schalen zodat deze in verschillende browsergroottes past. De menupictogrammen, wanneer ze zijn geschaald naar mobiel, gebruiken CSS3-mediaquery's om apparaten met een hoge resolutie te targeten en wisselen de pictogramafbeeldingen om met grotere, meer gedetailleerde pictogrammen. animaties en 'pagina'-overgangen worden afgehandeld met een combinatie van CSS3 en JavaScript. "

De infographic is responsief ontworpen, dus hij werkt goed op zowel mobiele browsers als desktopcomputers. DBS zal het in de toekomst blijven ontwikkelen en meer feitelijke informatie en afbeeldingen over de verschillende soorten toevoegen. "Uiteindelijk willen we dat het een mix wordt tussen een Fish Encyclopedia en het Guinness Book of World Records."


Vond dit leuk? Lees deze!

  • Hoe een app te bouwen
  • Illustrator-tutorials: geweldige ideeën om vandaag te proberen!
  • Briljante selectie van Wordpress-tutorials

Heb je een schitterende infographic gezien? Deel de link met de community in de reacties hieronder!

Fascinerend
Conceptontwerptips voor kunstenaars
Verder

Conceptontwerptips voor kunstenaars

De hoofdtaak van een kun tenaar in een vi uele ontwikkeling omgeving die in animatie werkt, i het bedenken, ontwerpen en uitvoeren van een geloofwaardige wereld waarin per onage kunnen leven. Maar het...
Brandinglegendes vragen ’What If?’ Op Kyoorius Designyatra 2014
Verder

Brandinglegendes vragen ’What If?’ Op Kyoorius Designyatra 2014

Over lecht 11 dagen gaat de groot te ontwerpconferentie van India - Kyooriu De ignyatra - van tart in Goa. Themed ’What If’, de negende iteratie van het driedaag e evenement, zet haar zoektocht voort ...
10 ongelooflijke ontwerptributen aan Game of Thrones
Verder

10 ongelooflijke ontwerptributen aan Game of Thrones

ind de lancering op onze chermen in 2011, i Game of Throne van HBO uitgegroeid tot een van de mee t populaire drama' die ooit zijn uitgebracht. Verhalen over bedrog, liefde, oorlog en verlie , de...