Poznáte to. Objednáte si polep na auto, banner na výstavu alebo tlač vizitiek – a od grafika či tlačiarne príde požiadavka: „Pošlite nám prosím logo vo vektoroch.“ Vy otvoríte priečinok s firemnými materiálmi, nájdete tam logo.png, logo.jpg a možno aj logo-final-FINAL.jpg, pošlete ich a odpoveď znie: „Toto bohužiaľ nestačí.„
V tej chvíli sa väčšina ľudí oprávnene pýta, čo je na tom logu zlé. Veď sa dá otvoriť, je farebné a vyzerá dobre.
Problém nie je v tom, ako logo vyzerá na obrazovke. Problém je v tom, ako je vnútri postavené. A práve o tom je tento článok – vysvetlím vám bez technických vedomostí, aký je rozdiel medzi vektorom a bitmapou, aké súbory by ste ako firma mali mať vo svojom archíve a čo robiť, ak ich nemáte.
Dva úplne odlišné svety obrázkov
Všetka grafika, s ktorou sa bežne stretnete, patrí do jednej z dvoch skupín. Vyzerať môžu na monitore rovnako, ale fungujú na úplne inom princípe.
Bitmapa (rastrová grafika): obrázok zložený z bodov
Bitmapový obrázok si predstavte ako mozaiku. Je zložený z pevného počtu drobných farebných štvorčekov – pixelov. Fotografia z mobilu, screenshot, obrázok z webu, to všetko sú bitmapy.
Kľúčové slovo je pevný počet. Keď fotografiu vytvoríte, má napríklad 2000 × 1000 pixelov. A viac ich už nikdy mať nebude.
Preto keď bitmapu zväčšíte, počítač nemá odkiaľ vziať chýbajúce detaily. Jediné, čo môže urobiť, je existujúce štvorčeky nafúknuť a dopočítať tie medzi nimi. Výsledok poznáte – rozmazané, zubaté okraje a takzvané „schodíky“. Presne to sa stane, keď sa logo z webovej stránky pokúsite natlačiť na plachtu na budovu.
Bitmapy poznáte podľa koncoviek JPG, PNG, GIF, TIFF, WEBP alebo PSD.
Vektor: obrázok zapísaný ako matematický predpis
Vektorová grafika nie je uložená ako body, ale ako súbor inštrukcií. Zjednodušene povedané, v súbore nie je napísané „tu je modrý pixel, vedľa neho ďalší modrý pixel“, ale skôr „nakresli kruh s daným polomerom, vyplň ho touto modrou a obtiahni čiarou tejto hrúbky“.
A to má jeden zásadný dôsledok. Keď takýto obrázok zväčšíte, počítač si podľa predpisu jednoducho prekreslí tvary nanovo – v akejkoľvek veľkosti. Rovnaký súbor môžete použiť na pečiatku veľkosti dvoch centimetrov aj na billboard pri diaľnici. V oboch prípadoch budú okraje dokonale ostré.
Vektor navyše obsahuje jednotlivé tvary ako samostatné objekty, takže sa dajú kedykoľvek upraviť – zmeniť farbu, oddeliť symbol od nápisu, upraviť odstup písmen. Pri bitmape to možné nie je, tam je všetko natrvalo „zapečené“ do jednej vrstvy bodov.
Vektory poznáte podľa koncoviek AI, EPS, SVG, CDR…
Rýchle porovnanie
| Využitia | Vektor | Bitmapa |
|---|---|---|
| Z čoho sa skladá | Krivky a tvary (matematika) | Pixely (farebné body) |
| Zväčšovanie | Bez straty kvality, donekonečna | Rozmazanie a zubaté okraje |
| Veľkosť súboru | Zvyčajne malá | Rastie s rozlíšením |
| Úprava farieb a tvarov | Jednoduchá a nedeštruktívna | Obmedzená až nemožná |
| Vhodné na | Logá, ikony, ilustrácie, piktogramy, texty | Fotografie a realistické obrázky |
| Nevhodné na | Fotografie | Logá určené na tlač a škálovanie |
| Typické formáty | AI, EPS, SVG, PDF | JPG, PNG, TIFF, WEBP |
Dôležité je, že jedno nie je „lepšie“ než druhé. Sú to nástroje na odlišné úlohy. Fotografia z dovolenky sa vektorom nikdy nestane a ani nemá – vektor nedokáže zachytiť milióny jemných farebných prechodov reálneho sveta. A naopak, logo uložené výlučne ako bitmapa vás bude obmedzovať pri každom väčšom tlačovom projekte.
Sprievodca formátmi: čo znamená ktorá koncovka?
Aby to bolo úplne praktické, tu je prehľad súborov, s ktorými sa najčastejšie stretnete.
Vektorové formáty
AI (Adobe Illustrator) – zdrojový, „master“ súbor loga. Toto je originál, v ktorom logo vzniklo a v ktorom sa dá kedykoľvek plnohodnotne upraviť. Otvorí ho grafik v profesionálnom programe. Ak máte tento súbor, máte všetko.
EPS – starší, ale stále veľmi rozšírený univerzálny výmenný formát. Otvorí ho takmer každý grafický program a takmer každá tlačiareň. Často to je práve ten súbor, ktorý od vás tlačiareň chce.
SVG – vektorový formát určený pre web. Logo v SVG je na stránke dokonale ostré na akomkoľvek displeji vrátane retina monitorov, súbor je pritom minimálny a stránku nespomaľuje. Dá sa dokonca animovať alebo mu meniť farbu priamo v kóde.
PDF – trochu záludný. PDF môže byť vektorové aj bitmapové, podľa toho, čo je v ňom uložené. Vektorové PDF je plnohodnotný podklad na tlač. PDF, do ktorého niekto len vložil naskenovaný obrázok, je bitmapa v peknom obale.
CDR (CorelDRAW) – vektorový formát programu CorelDRAW. Používa sa najmä v reklamných štúdiách a pri výrobe polepov.
Bitmapové formáty
JPG (JPEG) – najbežnejší formát pre fotografie. Používa stratovú kompresiu, takže pri každom uložení sa kvalita mierne zhorší. Nepodporuje priehľadné pozadie, preto logo v JPG má vždy pozadie – najčastejšie biely obdĺžnik, ktorý vám na farebnom podklade neposlúži.
PNG – bitmapa s podporou priehľadného pozadia. Ideálne na použitie loga na webe, v prezentáciách či dokumentoch. Na veľkoformátovú tlač sa nehodí, pretože stále ide o pevný počet pixelov.
TIFF – vysokokvalitná bitmapa používaná v tlači, najmä pri fotografiách. Súbory bývajú veľké.
WEBP – moderný webový formát s výbornou kompresiou. Vhodný pre fotografie na stránke, kde šetrí načítavací čas.
Ktorý súbor kedy použiť?: praktický ťahák
Aby ste sa v tom vyznali aj bez grafika po ruke:
Web a sociálne siete – SVG (ideálne pre logo priamo na stránke), PNG s priehľadným pozadím (profilové fotky, prezentácie), JPG alebo WEBP (fotografie).
Vizitky, letáky, katalógy, brožúry – vektor: AI, EPS alebo vektorové PDF.
Veľkoformát – bannery, plachty, polepy áut, výklady, roll-upy – jednoznačne vektor. Tu sa bitmapa prezradí okamžite a nemilosrdne.
Reklamné predmety – potlač tričiek, výšivky, gravírovanie, pečiatky – vektor. Výrobné stroje potrebujú presné dráhy, ktoré vedia prečítať len z kriviek.
Kancelárske dokumenty, Word, PowerPoint, e-mailový podpis – PNG s priehľadným pozadím.
Zlaté pravidlo, ktoré si stačí zapamätať: čokoľvek, čo sa bude tlačiť alebo vyrábať, chce vektor. Všetko, čo sa bude len zobrazovať na obrazovke, zvládne aj kvalitná bitmapa.
Čo ak vektory jednoducho nemáte?
Toto je situácia, v ktorej sa ocitne prekvapivo veľa firiem – a nie je to vaša chyba. Dôvody bývajú stále tie isté:
- logo kedysi robil známy, brigádnik alebo príbuzný a zdrojové súbory sa nikdy neodovzdali
- grafik, ktorý logo tvoril, už nie je dostupný alebo nekomunikuje
- logo vzniklo pred rokmi a zdrojové súbory sa stratili pri výmene počítača
- logo bolo od začiatku vytvorené len v programe, ktorý pracuje s bitmapami
- firma má k dispozícii už len sken starej vizitky alebo obrázok stiahnutý z vlastného webu
Výsledok je vždy rovnaký. Máte funkčnú značku, ktorú roky používate, ale pri každej väčšej zákazke narazíte na rovnaký múr. A možnosti sú v takom prípade v podstate dve.
Prvá je vytvoriť logo úplne nanovo, čo znamená zmenu vizuálnej identity so všetkým, čo k tomu patrí. Niekedy to dáva zmysel, najmä ak logo aj tak potrebuje omladiť.
Druhá – a vo väčšine prípadov rozumnejšia – je vektorizácia pôvodného loga.
Ako funguje vektorizácia loga?
Vektorizácia znamená prevod existujúceho bitmapového loga do plnohodnotnej vektorovej podoby. Výsledkom je súbor, ktorý sa dá zväčšiť na akúkoľvek veľkosť bez straty kvality, a vaša značka zostane presne taká, akú ju zákazníci poznajú.
Hneď na úvod jedno upozornenie. Existujú automatické online nástroje a funkcie „auto-trace“, ktoré sľubujú prevod jedným klikom. Pri jednoduchých tvaroch občas poslúžia, ale pri skutočnom logu takmer vždy vyprodukujú výsledok plný chýb: rozstrapkané okraje, stovky zbytočných bodov na krivkách, deformované písmená a farby, ktoré nesedia. Na obrazovke to na prvý pohľad prejde. Na tlačiarni v mierke jeden meter už nie.
Preto poctivá vektorizácia znamená prekreslenie loga nanovo, ručne, s presnosťou na desatiny milimetra. V praxi to zahŕňa:
- Analýzu predlohy – aj z nekvalitného podkladu sa dá vyčítať pôvodný zámer: geometria tvarov, proporcie, uhly.
- Identifikáciu písma – určenie použitého fontu alebo jeho čo najvernejšia náhrada, prípadne dokreslenie písmen ako samostatných tvarov.
- Prekreslenie tvarov – čisté krivky s minimálnym počtom kotviacich bodov, presné oblúky, symetria tam, kde má byť.
- Nastavenie farieb – definovanie odtieňov v CMYK pre tlač, RGB/HEX pre digitál a podľa potreby aj priradenie priamych farieb Pantone, aby vaša značka vyzerala rovnako na papieri aj na monitore.
- Export sady súborov – kompletný balík vo všetkých formátoch, ktoré budete v budúcnosti potrebovať.
Na konci dostanete presne to, čo vám doteraz chýbalo: jednu zložku, ktorú stačí poslať komukoľvek – tlačiarni, reklamnej agentúre, výrobcovi reklamných predmetov aj vášmu webmasterovi – a nikto sa vás už nebude pýtať na zdrojové súbory. Verzie na svetlé aj tmavé pozadie, čiernobielu variantu, súbory pre tlač aj pre web.
Vektorizácia zvyčajne nie je drahá ani zdĺhavá záležitosť. V porovnaní s tým, koľko času a nervov stojí opakované riešenie chýbajúcich podkladov pri každej jednej zákazke, ide o jednorazovú investíciu, ktorá sa vráti prakticky okamžite.
Ako zistíte, či máte vektor?
Rýchly test, ktorý zvládnete sami za pár sekúnd.
Podľa koncovky: ak máte súbor s príponou AI, EPS, SVG alebo CDR, s najväčšou pravdepodobnosťou ide o vektor. JPG, PNG, GIF a TIFF sú vždy bitmapy.
Podľa zväčšenia: otvorte súbor a priblížte ho na maximum – v prehliadači, PDF čítačke alebo obrázkovom prehliadači. Ak okraje zostávajú perfektne ostré aj pri extrémnom priblížení, máte vektor. Ak sa objavia štvorčeky alebo rozmazanie, je to bitmapa.
Pri PDF: priblížte logo v dokumente. Ostré aj pri veľkom zväčšení znamená vektorové PDF. Rozpixelované znamená, že v PDF je vložená bitmapa.
A ešte jedna praktická rada na záver tejto časti: keď si necháte vyrobiť nové logo, vždy si vyžiadajte odovzdanie zdrojových vektorových súborov. Je to úplne bežná a legitímna požiadavka. Sú to vaše podklady k vašej značke a mali by ste ich mať vo svojom archíve – nie u niekoho, koho po piatich rokoch nemusíte dohľadať. Zálohujte si ich na dve miesta a máte pokoj na roky dopredu.
Zhrnutie
- Bitmapa je zložená z pevného počtu pixelov. Zväčšovanie jej neprospieva. Je ideálna pre fotografie.
- Vektor je zapísaný ako matematické krivky. Zväčšiť sa dá donekonečna bez straty kvality. Je nevyhnutný pre logá.
- Na tlač a výrobu potrebujete vektor. Na obrazovku postačí kvalitná bitmapa.
- Ak vektorové logo nemáte, nemusíte začínať odznova – dá sa vektorizovať.
- Zdrojové vektorové súbory k svojej značke si vždy vypýtajte a zálohujte.
Potrebujete previesť logo do vektorov?
Ak ste pri čítaní zistili, že vaša firma má logo len ako JPG alebo PNG, rád vám s tým pomôžem. Vektorizáciu robím ručne – logo prekreslím do čistých kriviek tak, aby zodpovedalo originálu, a odovzdám kompletnú sadu súborov pre tlač aj pre web.
Rovnako pomôžem, ak si nie ste istí, čo vlastne v priečinku máte. Pokojne mi pošlite, čo máte k dispozícii, a poviem Vám na rovinu, či je to použiteľné a čo by ste k tomu potrebovali doplniť.
Napíšte mi cez kontaktný formulár a ozvem sa vám s návrhom riešenia aj cenou.