Barion Pixel
Ez itt a lifelong learning

Sosem tudhatsz eleget!

Blog

Segédlet

Kit érdekelnek a száraz adatok?

2014. július 09. | Tóth Zsuzsanna

# # # # #

2013 végén világszerte 51,2 millió ember élt kényszerűen távol az otthonától, azaz pontosan 6 millióval többen, mint a 2012 végi 45,2 millió fő.”

A Global Trends jelentés az otthonuk elhagyására kényszerült emberek három csoportját fedi le – a menekülteket, a menedékkérőket és a belső menekülteket. 

Közülük a menekültek száma 2013 végén globálisan 16,7 millió fő volt.
Az UNHCR felügyelete alá tartozó menekültek a legnagyobb számban Afganisztánból, Szíriából és Szomáliából érkeztek – e három csoport adta a világ menekültjeinek több mint felét. Ugyanakkor Pakisztán, Irán és Libanon több menekültet fogadott be, mint az összes többi ország együttvéve.
Régiós szinten Ázsiában és a csendes-óceáni térségben élt tavaly a legtöbb menekült, összesen 3,5 millió. Fekete-Afrikában 2,9 millió, a Közel-Kelet és Észak-Afrika térségében 2,6 millió volt a számuk.

A menekültek mellett 2013-ben 1,1 millió ember nyújtott be menedékkérelmet, a többségük a világ fejlett országaiban (tavaly Németország lépett az első helyre, mint az az ország, amely a legtöbb menedékkérelmet fogadta be). Korábban soha nem látott számú, 25 ezer 300 menedékkérelem érkezett a szüleiktől elszakított gyerekektől. A legtöbb menedékkérő, 64 ezer 300 ember Szíriából érkezett, a második legnagyobb kibocsátó a Kongói Demokratikus Köztársaság volt 60 ezer 400 fővel, míg a harmadik Myanmar 57 ezer 400 menedékkérővel.

A belső menekültek száma 2013-ban szintén rekordszintre, 33,3 millióra nőtt, a legnagyobb mértékű ugrást produkálva a Global Trends jelentésben szereplő összes csoport közül. “

forrás: http://www.unhcr-centraleurope.org/hu/hirek/2014/a-ii.-vilaghaboru-ota-eloszor-50-millio-folott-a-menekulesre-kenyszerultek-szama.html

Ez egy sztenderd éves összefoglaló kivonata az ENSZ menekültügyi hivatalától sok szomorú ténnyel és nagy számokkal, amelyet ilyenkor mindenhová eljuttatnak sajtóközlemény formájában.

Egy ideje rendszeresen járok a budapesti ENSZ székházba webdesign ismereteket tartani. Ezúttal az infografikán volt a sor, így a fenti cikkből dolgoztunk.

Ha nem olvastad végig, nagyon is megértem. Hosszú mondatok, sok szám. Hogyan lehet érdekesebbé tenni ezt a sok szöveget, úgy hogy minél több emberhez jusson el? A válasz: vizuális összefoglaló vagyis infografika.

Mi az infografika?

  • száraz adatok, információk grafikus, könnyen értelmezhető és befogadható megjelenítése

Miért használjunk infografikát?

  • érdekes – olyanokhoz is el lehet jutni, akik amúgy egy cikket nem olvasnának el
  • gyorsan áttekinthető
  • jó a sajtója (sajtóközlemény, socialmedia – az emberek szeretik megosztani, a sajtónak remek és érdekes tartalom, amivel nem kell dolgoznia)

Hogyan készítsünk infografikát?

  • Vegyük sorra milyen adatokat szeretnénk megjeleníteni?
  • Ezeknek az adatoknak milyen megjelenítés lehet a legjobb módja?
    (elvonatkoztatva a szokásos diagramoktól)
  • Ha sok adatunk van, akkor bontsuk egységekre – ne legyen zsúfolt
  • Válaszhatunk infografika-generátort vagy elkészíthetjük magunk
  • Az adatok mellett legyenek rövid magyarázó szövegek, grafikák is
  • Az adatok súlyozását méretkülönbségekkel, mennyiségekkel tudjuk érzékeltetni
  • Ha egy-egy adat kiemelten fontos, azt mindenképp illusztráljuk
  • Ellenőrizzük az adatok pontossát, hitelességét valamint a helyesírást
  • Jobb a lehető legnagyobb felbontásban dolgozni (300 dpi, pdf) mert könnyen végezheti plakátként és ebből a méretből még mindig lehet kicsinyíteni.
  • Az elkészült grafikát töltsük fel a közösségi oldalakra – Facebook, Pinterest stb.
  • Hasznos rajta feltüntetni a saját webcímet, elérhetőségeket is

Online generátorok és gyűjtemények –

http://piktochart.com/
http://infogr.am/
http://www.easel.ly/
http://create.visual.ly/
http://instantinfographicspresence.com/

Ezeket azért ajánlom így még az elején, mert tényleg hasznosak. Aki sajtóközleményeket állít össze, nem grafikus és nincs is arra 1-2 óránál több ideje, hogy túl sokat szöszöljön egy grafikán. Persze az online alkalmazások sablonokból dolgoznak és könnyen előfordulat, hogy egyik elrendezés vagy készlet sem elégíti ki az igényeid. Ebben az esetben is jó, ha össze tudsz rakni egy ilyet magad!

Barátunk a Photoshop lesz

1. lépésként nyissunk egy új fájlt – File / New / 1200×1600 

info_01

A Resolution értékét a weben nem megszokott módon 300-ban adjuk meg, mert nem tudhatjuk milyen útja lesz az infografikánknak a jövőben – mutasson jól nagyfelbontású eszközökön is, és ha ki akarnánk nyomtatni, akkor is jó minőséget kapjunk.

2. lépés – New Layer – Rectangle Tool – Fill / Gradient 

A Layer panelen nyiss egy új réteget, majd az eszköztáron válaszd a téglalap alakú eszközt, amivel az alapodra egy téglalapt tudsz rajzolni – ennek színét (Fill) fent a felső menüben tudod beállítani. Van sima egyszínnel kitöltés, azonban most a két vagy több színű átmenetet (Gradient) használd. Az átmenet színeit a csíkon alul található 2 kis négyzet szabályozza. Kattints rájuk és add meg a kívánt színt a felbukkanó színablakból.

info_02

3. lépés – Text – Helvetica Neue Bold 125 px, 75 px 

Szöveget hozzáadni az eszköztáron lévő T ikon megnyomása után lehet, fent be tudod állítani a kívánt betűtípust és méretet. Ha később változtatni szeretnél egy szövegen, csak kattints bele, jelöld ki és alkalmazd a fentieket.

A szövegeknél legyen egy hierarchia – nyilván a legnagyobb a cím, ami leírja miről is van szó összességében.

info_03

4. lépés – Line Tool 1 px, Helvetica Neue Light 45 px 

A címsortól a további szövegeket egy 1 px vékony vonallal (Line Tool) válaszhatod el. Egy ilyen vékony vonal remekül tagolja a tartalmat. A Line Toolt az eszköztáon ugyanott találod ahol a téglalap volt, csak nyisd meg az ikon sarkában a kis háromszöget és előbújnak a rejtett eszközök.

info_05

Az alcím a cikk címe lett, mert jól összefoglalja a problémát, amit most vizuálisan is ábrázolhatsz. Egy év alatt 6 millióval nőtt a menekültek száma. Kell a két évszám, az évek önálló adatai, ábrázolni kell a növekedést és azt, hogy ez 6 millió, ami nem kis szám.

A képen látható világoskék vonalak az un. segédvonalak (Guides), amelyeket arra tudsz használni, hogy a tartalmat a segítségükkel pozicionáld. Először kapcsold be a View menüben a Rulers lehetőséget, ez vonalzókat jelenít meg a képed körül. Ezekből a vonalzókból tudod kihúzni a segédvonalakat, ha egérrel jól megragadod és húzni kezded. A segédvonalak nem látszanak majd a képen, ha már nem kellenek esetleg, a View / Clear Guides menüponttal kitörölhetőek.

5. lépés – Rounded Rectangle Tool, Radius 50 px

info_06

A Rounded Rectangle Tool is ott található ahol a sima téglalap, csak ez lekerekített. A lekerekítés értékét a felső menüsorban tudod állítani (Radius), ez legyen 50. Rajzolj egy ilyen lekerekített hosszú téglalapot, majd nyomd meg a Ctrl+J (Cmd+J) billentyű kombinációt, amivel megdupláztad. A Layer panelen látszik, hogy kettő van belőle, csak rajta van a másikon, húzd arrébb és helyezd el a másik mellé a képen látható módon.

Hogyan tudsz mozgatni? Lépj az eszköztáron az első, fekete nyílra – Move Tool, majd arra a rétegre, amelyet elmozdítani akarsz.

info_07

Még két másolat, és az eredménynek valami hasonlónak kell lennie. Egy sima téglalap (Rectangle Tool ) lesz a teste – ha még nem esett le, ez egy klasszik pálcika emberke lesz.

info_08

A nemrég megismert Rounded Rectangle Tool eszközzel most is egy lekerekített téglalap kell, csak ez a válla lesz. Az 50-es érték marad – a rajz alapján helyezd el. Tádám! Már csak egy fej kell!

info_09

Ehhez még mindig ugyanott kell egy kör alakú eszközt keresned – Ellipse Tool néven. Ha a Shift-et is nyomod rajzolás közben szabályos kört kapsz.

elipse

Ha az emberkéd megvan, akkor a Layer panelen jelöld ki az elemeit tartalmazó rétegeket – lépegess rajtuk végig. Ctrl nyomása közben lehet többet kijelölni. Ha nem tudod melyiken mi van, akkor kapcsold ki és be a szem ikont előttük és máris kiderül. A rétegeket épp ezért nem árt elnevezni sem – katt a Layer panelen a névre és átírható.

Tehát ha kijelölted minden részét, akkor nyomj egy jobb klikket és most ebben az esetben összeolvasztjuk a rétegeket a Merge Shapes – alakzatok összevonása parancssal.

info_10

Kész az emberkéd, amivel vizuálisan is jelezni fogod, hogy nem 50 millió juhról van szó, hanem emberi lényekről. Több méretben fogjuk használni, az először elkészültet méretezd át egy Ctrl+T megnyomásával. Megjelenik egy szerkesztő körülötte, amelynek az oldalait vagy a sarkait megfogva csökkentheted vagy növelheted a méretét. Itt is érvényes, hogy a Shift egyidejű nyomásával arányos marad a fickó.

ct

Most foglalkozzunk az adatokkal kicsit. Ahogy a feliratokat ráírtad, úgy rá tudod a számokat is. A drasztikus növekedést jelezd nagyobb számmal és helyezd feljebb is, hogy maximálisan egyértelmű legyen.

A számokat össze is kötheted egy növekedést jelző vonallal – egy kis kört rajzolj – mint az ember fejét, úgy kell – majd ha megvan duplázd meg Ctrl+J és vidd a másik szám alá. Vonalat szintén az az eszköz rejti, ami a kört, téglalapot stb. Line Tool a neve. Tedd le az egyik pontnál az egyik végét és a másiknál a másikat. A vonal vastagságát, színét a felső menü rejti.

A 6 db emberke itt is a duplikálás terméke – a legfelsőből készült egy másolat, majd átméretezés (Ctrl+T) és azt megint duplikálni (Ctrl+J)

Ugyanezzel az eszközzel készült a címet és az adatokat elválasztó 1 px fehér vonal is, csak közben nyomtam a Shiftet, így szép egyenes lett.

info_13

Ezt a vonalat duplázhatod, mert jön a cikk következő ábrázolható része. Ilyen vonalakkal jobban tagolható a grafika, látszik mely részek tartoznak össze.

info_14

A fejhez hasonlóan itt is egy szabályos kört kell rajzolni, csak jóval nagyobbat. A kör az egész szimbóluma, ebben az egészben fog megjelenni 3 kisebb kör és sok mégkisebb. A 3 körrel jelezzük azt a 3 országot amelyből a legtöbb menekült érkezett. A kisebbek meg ugye a meg nem nevezett többi. Amikor pontos adatokat tudunk pl. hogy a 3 országon belül is milyen eltérések voltak, szintén jelezhetőek a kör méretével. A három nagy kört feliratozhatod is.

info_15

A 6 emberkét fentről másoltam át – a rétegeken kijelöltem őket – találsz egy kis lánc ikont a Layer panel alján, ezzel átmenetileg összeláncolhatóak és egyszerre mozgathatóak. Ezeket is 2x dupláztam – így egyszerre és a megfelelő helyre kerültek – a 6-6 különböző színű emberke itt a körökre rímel – vagyis a sötétkék körökből származó emberek a menekültek több mint felét adták – a pontos az lenne ha 6 és fél emberkét tettem volna oda, de mivel nincs adatunk, hogy a több egyel több vagy 100 ezerrel így maradjunk a felében.

info_17

info_18

A következő adathalmaz a menedékkérelmet benyújtók és a belső menekültek száma.

info_19

Mivel itt pontos számaink vannak, a 3 ország különbségeit egyszerű oszlopokkal lehet illusztrálni. Rectangle Tool, amelyen fel tudjuk tüntetni az országok nevét és a számadatokat.

info_20

A belső menekültekről egy nagy számunk van, így ezt a nagy számot egy kapcsolódó fotóval tudjuk kiemelni – a képet a File / Place Embedded menüvel hívhatod be, és Ctrl+T-vel át is tudod méretezni.

info_21

Amikor elkészültél több módon érdemes menteni – az egyik Save as – JPG – ezt mindenki tudja kezelni, ill még a .pdf jöhet számításba. Ha webes környezetbe szánod, akkor nem árt egy Save for web sem – amit kitudnak tenni más weboldalak is a cikkeikbe. Természetesen magát a munkafájlt is mentsd .psd formában, ha esetleg változtatni kell rajta, meglegyen.

swd

Ez egy kis gyakorlattal fél óra alatt megvan, illetve ha még több időd van tovább csinosítgatható. Most nézd meg egy kicsit más szemmel a népszerű infógrafikákat és meglátod, a legtöbb nem más, mint színes alakzatok.

Sok-sok infografika a Pinteresten

Amit nehezebb kitalálni, az az adatok megjelenítésének logikája, de egy kis gyakorlással az is megy! Írj cikkeket úgy, hogy az unalmas adatokat látványosan tálalod és garantáltan több embert fog érdekelni!

Ha kérdésed van a témában, vagy szeretnél még több webdesignnal, grafikával kapcsolatos anyagot, csatlakozz az új csoportunkhoz a Facebookon – OWT – Webdesign & Marketing

Iratkozz fel YouTube csatornákra!

blog

Virtuális asszisztens legyél vagy webdesigner?

Virtuális asszisztens legyél vagy webdesigner?

2024. február 01.

Mindkettő fantasztikus lehetőség arra, hogy elhagyd a hagyományos kereteket, mint szoros, rugalmatlan munkaidő, helyhez kötöttség vagy akár a bérplafon. Egy ponton találkozik is a két munkakör, ahol a grafikai munka már az asszisztenciába hajlik – designerként is végezhetsz weboldal adminisztrációt, közösségi média tartalom készítést vagy felügyeletet és virtuális asszisztensként is sokszor találkozni már-már tervezői munkába […]

Tovább a cikkre
Secured By miniOrange