Infografy nejsou nové. A jistě ani interaktivní nejsou - ale s uvedením nedávných zpravodajských serverů, jako jsou například Vox,Fivethirtyeight a Upshot , jsou stále populárnější.
A protože diváci vidí infografiku na tabletech, telefonech a stolních počítačích, vytváření grafiky ve formátu HTML5 je způsob, jak jít - je to pravděpodobně způsob, jakým vás vaši klienti a spolupracovníci požádají o vybudování!
A mapa fanoušků baseballu od Upshot
Zde jsou tři způsoby, jak se ujistit, že vaše interaktivní infograficky založené na HTML5 prolomí nepořádek.
Než se dokonce zamyslíte nad technologií, je důležité přemýšlet o grafice z pohledu diváka. Zatímco HTML5 vám dává úplně nové médium pro prezentaci příběhu vašich dat, automaticky neposkytuje účel ani narativu k dílu.
Je zřejmé, když byl projekt spojen s posledním okamžikem, bez ohledu na použitelnost či kvalitu. Jak se vyvarujete této práci? Líbí se mi zaměstnání metody "FIRED" - snadný způsob, jak si zapamatovat, abyste kriticky mysleli, než začnete používat nejnovější triky CSS, abyste vytvořili interaktivní mapu:
Při zadávání těchto otázek vám pomohou mapovat cíle vaší stránky a jak chcete, aby vaše zpráva rezonovala s vaším publikem. V konečném výsledku by váš konečný produkt měl rámovat svůj nápad jasným a chutným způsobem. Buďte kreativní, ano, ale také disciplinujte. Grafické umění je to, čemu by měl čtenář čerpat, ale předložené údaje musí být stručné; Nenechte médium předjet zprávu. Úspěšná infografie přitahuje vaše publikum více a je snadné strávit.
Adobe Edge Animovat je animační nástroj HTML5, který vám umožňuje přidávat pohyb do webové grafiky, což vám umožní rozšířit vlastní vzory s interaktivitou a pohybem. Je také integrován s dalšími kreativními nástroji, které nabízejí bezproblémový most mezi designem a HTML, jak vytváříte pro web. Existují některé opravdu skvělé šablony a vzorky na prezentace stránky abys začal. Chcete-li jít do úrovně hlouběji a přidat prvky, jako jsou klepnutí a dotek drahé pračky, je zde tutoriál s aktivy abys začal.
Můžete také tkát v interaktivní grafice, která využívají nejnovější aktualizace prohlížeče CSS a HTML5, aby se některé docela fantazie efekty. CSS Shapes je ve svých posledních stádiích specifikace; Koukni na to (Github repo tady ).
Infographic není ničím bez silných zdrojů dat a nástrojů pro jejich ilustraci.
Zdroje dat se mohou lišit - ať je to váš vlastní výzkum nebo váš klient. Tam je také dobrý seznam na Quora z veřejně dostupné datové sady které vám mohou poskytnout nějaké dobré surové údaje.
Některé z mých oblíbených infografických služeb (které samozřejmě poskytují všechny produkty HTML5) pro shromažďování a vyhodnocování dat jsou:
A pokud jste obzvláště ambiciózní a hledáte opravdu hluboké ponoření do větší oblasti vědy o datech, je na tomto tématu spousta zdrojů online. Existují takové MOOC kurzu datových věd z univerzity ve Washingtonu.