A vektoros grafikák egyre nagyobb népszerűségnek örvendenek a digitális tervezés világában, köszönhetően a felbontásfüggetlenségüknek és rugalmasságuknak. Ez a cikk bemutatja, hogyan lehet képeket vektoros formátumra alakítani, különös tekintettel a Photoshop és az Adobe Illustrator használatára, valamint alternatív megoldásokat is felvázol.
Miért érdemes vektorizálni?
A vektoros grafikák egyenesekből és görbékből állnak, amelyeket matematikai képletek írnak le. Ennek köszönhetően függetlenek a felbontástól, így szabadon módosíthatók anélkül, hogy az élességük vagy a részletességük romlana. Ugyanolyan éles határvonalakkal rendelkeznek átméretezés vagy PDF formátumba mentés után is. Ezért nemcsak logótervezés során, hanem számos más munkafolyamatban is szükség lehet rájuk.
A raszteres képformátumok, mint a PNG, nem méretezhetők korlátlanul, mivel pixelekből épülnek fel. Bár a PNG elterjedtebb és hatékonyabb formátum lehet bizonyos esetekben, mint az SVG, mégsem támogatja a korlátlan méretezhetőséget. A vektoros képek felbontásfüggetlenek, ezért minden vektoros kép ideális az átméretezéshez. Bár a raszteres formátumú kép átméretezése lehetséges, a pixelek széteshetnek, ami nagyításkor pixelesedést eredményezhet.
A raszteres kép minősége kissé gyengébb lehet, ha vektorrá alakítják, mert a pixelek eltűnnek. A pixelek olyan adatok, amelyek egyesülve színt alkotnak, és elősegítik a digitális fénykép megjelenését.
Vektorizálás Photoshopban
A Photoshop fő funkciója a raszteres képek szerkesztése, így nem kínál olyan hatékony vektorizálási lehetőségeket, mint az Illustrator. Ennek ellenére könnyen importálhatunk JPG és PNG formátumokat, népszerű raszteres formátumokat, és elkezdhetjük a vektorizálási folyamatot.
Ebben a videóban a vektoros rajzolás alapjait fogjuk megtanulni Photoshop-ban. Nyissunk meg egy szabadkézi rajzot. A Pen toolt válasszuk ki, az eszköztáron a Shape layers legyen kiválasztva. Rakjunk le csomópontokat, hozzunk létre egy zárt görbét. Tartsuk a Pen toolon a bal egérgombot, majd válasszuk ki a Convert toolt. Változtassuk meg a görbék irányvonalait, állítsuk be a körvonalat a rajzhoz. Ha túl kevés csomópontot raktunk le, az Add encore pointtal rakhatunk még le további csomópontot. Rajzoljuk meg hasonló módszerrel a hátteret is.
A Photoshop Bézier-eszköze nagyon éles vágások létrehozására alkalmas. Kitűnő technikai eszközök - gépalkatrészek, autók, repülőgépek - körbevágására. Válaszd itt a Toll-eszközt. Itt találsz egy legördülő menüt, ahol a FORMA és a GÖRBE között választhatsz. Válaszd ki az egyik sarkát, és a Bézier-eszközzel - a módszerünk szerint - kattintgass végig minden sarkon, körbejárva az alakzatot. A körbejelölés után körbe is kéne vágni a képet. Ugyanazt a megoldást használjuk, mint a RÉTEGMASZK-nál. A rétegkezelőn van egy lukas téglalap-ikon.
A VEKTORMASZK (vagy vektoros vágómaszk) egy nagyon szimpatikus eszköz azoknak, akik a vektorgrafika felől érkeztek a Photoshopba. Jelöljük körbe a Bézier/Toll-eszközzel (P) úgy, hogy a lehető legkevesebb pontot rakjuk rá, azokba a pontokba, ahol a görbe változik. Itt viszont előtte legalább egyik csomópont modosításával az egyenesből görbét kell készítened. Ez egy Bézier-görbe csomópontja, a két szokásos irányponttal. Figyeld meg, hogy most már meg tudod fogni a begörbített szakaszt is, és azzal formázhatod! Járd körbe és módosítsd a görbét.
A Képkontúrozás panel alapvető és speciális kontúrozási beállításokkal rendelkezik az eredmény testreszabásához. Váltás az előbeállítások továbbfejlesztett és régi verziói között a Képkontúrozás futtatásához. MEgjeleníti a kontúrozás eredményének vagy a forrásképnek a megtekintését körvonalakkal vagy azok nélkül. Meghatározza a kontúrozás eredményének színmódját. Az elérhető beállítások határozzák meg a kontúrozott grafika alapszínét és szürkeárnyalatos módjait.
- Szín: Megjeleníti a Színek csúszkát vagy a Színek legördülő menüt a kiválasztott Paletta alapján.
- Szürkeárnyalatos: Megjelenít egy Szürkék csúszkát, melyen a szürkeárnyalatos kontúrkészítési eredményben felhasználható szürke mennyiségét lehet megadni.
- Fekete-fehér: Megjelenít egy Határérték csúszkát, melyen a fekete-fehér kontúrkészítési eredményben felhasználható Határérték értéket lehet megadni.
Meghatározza a palettát, amellyel létrejön a forráskép színes kontúrozása. Meghatározza a kontúrozott alakzat és az eredeti, képpontokból felépülő alakzat távolságát. Képpontokban meghatározza a kontúrozásnál elhanyagolandó területet. Nagyobb érték kevesebb zajt jelent. Meghatározza a kontúrozási módszert.
- Kitöltések: Kitöltött területeket hoz létre a kontúrkészítési eredményben.
- Ecsetvonások: Ecsetvonásos görbéket hoz létre a kontúrkészítési eredményben.
Meghatározza a forráskép alkotóelemeinek maximális vastagságát, amelyeknél létrejöhet ecsetvonás. A maximális szélességnél nagyobb alkotóelemek körvonalas területekké válnak. Színátmenetek: A kép lineáris színátmeneteit észleli és követi nyomon. A továbbfejlesztett Nagy színhűségű fénykép és Alacsony színhűségű fénykép előbeállításokban támogatott, vagy amikor a Mód Szín vagy Szürkeárnyalatos értékre vagy a Paletta Automatikus vagy Teljes tónus értékre van beállítva. A Színátmenetek csak akkor működnek Szürkeárnyalatos módban, ha a Paletta már be van állítva. Állítsa be a Simítás csúszkát a színátmenet simításának szabályozásához. A magasabb értékek simább színátmenetet eredményeznek.
Görbék vonalakhoz illesztése: Ez a funkció kicseréli az enyhén ívelt vonalakat egyenes vonalakra, és a 0 vagy 90 fokhoz közeli vonalakat átalakítja abszolút 0 vagy 90 fokos vonalakra. Geometriai grafikák vagy enyhén elforgatott alakzatok létrehozására szolgál a forrásképben. Átlátszóság: Megakadályozza a kép átlátszó hátterének fehérként való kontúrozását. Másik lehetőségként a Mód lehetőséget Szín értékre állíthatja, és legalább négy színt választhat ki, ha a Paletta lehetőséget Korlátozott értékre állította. Szín mellőzése: Figyelmen kívül hagy egy adott színt kontúrozáskor. A színválasztóval szelektíven figyelmen kívül hagyhatja a színeket. A kontúrozási eredményben szereplő görbéket logikai csoportokba rendezi, amelyek megkönnyítik a szerkesztést. Az összes készlet továbbfejlesztett verziója beépített támogatást nyújt az Automatikus csoportosításhoz.
Ez a művelet az alapbeállításoknak megfelelően alakítja a pixelgrafikus ábrát képkontúros objektummá. Ha lenyitjuk a jobb oldali menüsávban a Rétegek panelt, akkor a sok-sok görbe között megtaláljuk magát az összetett alakzatot, azaz magát az ábrát. Ezt Egyedi alakzatként felvehetjük a Photoshopban is. Ehhez legyen kijelölve a Rétegek panelen ez az összetett alakzat, ezen a rétegen állva nyomjunk Ctrl+C billentyűkombinációt. Nyissuk meg a Photoshopot-ot, nyissunk meg benne egy új munkaterületet, majd nyomjunk egy Ctrl+V billentyűkombinációt. A felugró Beillesztés nevű ablakban válasszuk ki az Alakréteg lehetőséget, majd nyomjunk OK-ot. Új rétegen megjelenik az alakzat, álljunk ezen a rétegen, majd kattintsunk a Szerkesztés/Egyedi alakzat meghatározása lehetőségre. Ennek eredményeként a színes rajz fekete sziluettjét, tehát árnyrajzát kapjuk meg, így például fekete ikonként tudjuk használni. Ha esetleg át szeretnénk színezni ezt a fekete ábrát, akkor kattintsunk a felső menüsorban található Grafikus stílus panel dobozára, majd válasszuk ki az Alapértelmezett grafikus stílust. Ezzel a technikával a saját rajzainkat, kézírásunkat is vektorossá alakíthatjuk.
Adobe Illustrator és a Vectorizer funkció
Az Adobe Illustrator a legnépszerűbb megoldás vektoros képek létrehozására és szerkesztésére. A szoftver az előre beállított értékek széles választékát kínálja, amelyekkel az állóképeket újraskálázható vektorképpé alakíthatjuk.
A vektorokon kívül a raszteres kép szerkesztése itt is megvalósítható, például a kép levágása a nem kívánt területek eltávolításához. Tipp: Különböző színű képek kezelésekor a módot Színre kell állítani. A mód kiválasztása után lépjen a Speciális módba a Sarkok, Zaj és Útvonalak beállításához. Menjen vissza a felső menübe, de most válassza ki tárgy és kattintson Bontsa. A végső kimenet exportálásához kattintson a gombra Fájl, Exportálás, akkor Exportálás másként. Válassza ki, hogy milyen típusú vektorformátumot szeretne végső kimenetként használni, és győződjön meg róla, hogy vektorformátumot választott.
Az Illustrator természetesen tartalmaz egy vektorizáló eszközt, ez az Image Trace, amit egyrészt az Object menüből tudunk aktiválni, de a Window menü alatt bekapcsolhatjuk a saját kis eszköztárát is, ahol nagyon részletesen beállíthatjuk az átalakítás paramétereit. Az elkészült vektorhalmot az Expand paranccsal teheted szerkeszthetővé.
Az Image Trace használatával szép eredményeket csak akkor kaphatunk, ha olyan fotót használunk kiindulási alapul, amelyen erős kontrasztok, lehetőleg világítóan világos, egynemű háttér van. A Design Made Simple videóján ezt a folyamatot követheted végig.
Alternatív megoldások: Logoist és Vectorize!
Még a nyár vége felé mutattunk be egy zseniális vektorgrafikai szoftvert a Logoist 4-et, amely amellett, hogy jól használható vektoros eszköztárral rendelkezik, kapott egy izgalmas extra funkciót is: profin módon képes átalakítani bitmapes képeket és fotókat vektoros ábrává. Hasonló megoldást persze találunk az Adobe Illustratorban, vagy akár a CorelDRAW-ban is, de a Logoist program Vectorizer funkciója talán még ezeknél is kényelmesebben és hatékonyabban használható.
Ha viszont nincs szükségünk egy komplett vektorgrafikai szoftverre, viszont jól jönne a fotók vektoros ábrává alakítása ugyanezzel a metódussal, erre is van megoldás: a Logoist készítői ugyanis önálló - macOS és iOS - programként is elérhetővé tették ezt a funkciót, Vectorize! A Vectorize! tulajdonképpen a Logoist leszármazottjának is tekinthető, mert a felépítése és opciói egyaránt onnan öröklődtek. Ennek megfelelően döbbenetesen egyszerűen alakíthatunk át vele vektoros ábrává szinte bármilyen bitmap alapú képet.
A forrás lehet bármilyen, a Macünk meghajtóján meglapuló képfájl, de egy mozdulattal megnyithatunk képet a macOS saját Fotók alkalmazásából is. Sőt, ha úgy adódik, akár az iPhone kamerájával is szkennelhetünk vagy fotózhatunk, közvetlenül a programba. Mi több, ez esetben akár az iOS Sketch funkcióját is használhatjuk, vagyis rajzolhatunk a telefon képernyőjére, majd a Vectorize! Az első elemzés után megjelennek az aprólékos finomhangolásra szolgáló opciók is a program felületén: megválaszthatjuk a színátmenetek módját, a csoportosítási rendszert, kontúrok vastagságát stb. Az előnézeti képen minden változtatást nyomon követhetünk, bár itt is érvényes, hogy ha olyan módosítást hajtunk végre, amely számításigényes, akkor azért egy kicsit gondolkodik a gép. Összességében viszont megéri a várakozás, mert a végeredmény rendkívül meggyőző lesz. A Vectorize! Ha mindennel végeztünk, a kész ábrát két népszerű formátumba exportálhatjuk: az egyik a PDF, a másik az SVG.
Ha valakinek megtetszik a program és szeretné mindig kézközelben tudni, annak mindössze egy iPhone-ra lesz ehhez szüksége, a Vectorize! ugyanis macOS mellett iOS alatt is használható. De ugyanígy akár egy iPaden is beüzemelhető. A Vectorize! iOS változatának tudása gyakorlatilag teljesen megegyezik a maces verzió lehetőségeivel, még a felület is nagyon hasonló, csak persze a kisebb kijelzőhöz és az érintőképernyőhöz van igazítva. Mindent egybevetve a Vectorize! bőven megéri az árát, ha gyakran kell bitmapes ábrákat vagy fotókat átalakítanunk vektoros ábrává. Még akkor is jó eredményt érhetünk el vele, ha gyengébb minőségű az eredeti képfájlt, hiszen a gépi tanulás segítségével a program az átalakítás előtt képes feljavítani az alapanyagot. Emellett már csak hab a tortán, hogy nem csak Macen, hanem akár iPhone-on vagy iPaden is használhatjuk. Természetesen nem csak fotók átalakításához jó választás, hanem akkor is, ha bitmapes képként meglévő ábrákat, logókat, szkennelt rajzokat stb.
Online konverterek
Aiseesoft ingyenes képátalakító online egy népszerű megoldás, amely bármilyen képet, legyen az raszter vagy vektor, probléma nélkül átalakíthat olyan népszerű formátumokká, mint a JPEG, PNG és GIF. Ez a konverter támogatja a kötegelt átalakítást, ami azt jelenti, hogy egyszerre több képtípust tölthet fel és konvertálhat új formátumba, és letöltheti az összeset. Bár ez nem egy ingyenes vektoros képátalakító, vagy alapvetően nem képes a képet vektorossá alakítani, mégis megbízható konverter, amelyhez hozzáférhet az interneten.
Képregényszerű vektoros illusztrációk
A vektoros grafikának egy harmadik, gyakran előkerülő stílusát alkotják a képregényszerű, de egyben realisztikus illusztrációk, lényegében fényképek vektorossá varázsolt verziói. Ez a művelet semmiképpen nem egyszerű, hiszen egy alapvetően komplex, részletekben gazdag képet kell valamilyen módon átalakítani vektoros, egyszerűsített, jól átlátható grafikává.
Ha viszont valódi, tiszta vonalakból álló vektoros átalakítást szeretnél, sajnos akkor jársz a legjobban, ha egeret (vagy digitális rajztáblát) ragadsz, és beveted, amit a Pen Tool használatáról elsajátítottál. Rengeteg ilyen jellegű tutorialt találsz az interneten, de ezek általában egyszerűen megmutatják, hogyan kattintgatja az ügyes kezű grafikus végig a fotók körvonalait. Amiért abszolút érdemes ezeket végignézni, az a szemléletmód, hogy hogyan érdemes a szöszös szélű pixeles grafikát átalakítani, ha hajról, szemről, effélékről van szó.
A Dom Designs videója egy kicsit geometrikusabb eszközökkel, vastagabb vonalakkal dolgozik, de nagyon sok finom trükköt mutat a vonalkezelésben. Kokoro Yagami tutorialja viszont már szép, aprólékos módon rajzolgatja végig és alakítja vektoros foltokká a modell körvonalait. Hòa videója is hasonlóan dolgozik, ez annyiban inspiráló, hogy itt az eredetihez hű átrajzolás helyett a grafikus már rögtön egy erős hangulatú saját palettával alakítja át a híres színész portréját.
