Kako napraviti vektorski crtež iz fotografije u Photoshopu. Napravite vektorsku sliku u Photoshopu. ⇡ SVG-Edit - online uređivač vektora

Svatko tko radi sa grafički urednici ponekad morate imati posla i s vektorskom i s rasterskom grafikom.

Što ako bismo trebali dodati neke specijalne efekte Photoshopa u vektorsku datoteku. Danas ću vam pokazati kako ispravno raditi vektorske datoteke u Photoshopu.

1) Samo povucite AI ili EPS datoteka u PHOTOSHOP-u. Mi vidimo:

2) Veličina je ovdje vrlo važna - uostalom, u Photoshop slikaće postati rasteriziran i bit će teško povećati veličinu bez gubitka kvalitete. Stoga je najbolje odmah uzeti veliku veličinu.

3) Kada smo otvorili našu datoteku, sve su slike bile na jednom sloju. Da biste zasebno radili sa svakim od njih, morat ćete koristiti odabir, na primjer, Rectangular Marquee Tool, a zatim izrezati na novi sloj.

4) Budući da nismo sigurni s kojom će veličinom slika morati raditi, pretvorit ćemo je u pametni objekt. Samo kliknite desnom tipkom miša na nju i odaberite odgovarajuću stavku. Ispada da je objekt po karakteristikama postao sličan vektorskom objektu, te se može povećati po želji.

5) U ovom primjeru, kopirao sam jednu od lubanja, a zatim je pretvorio u pametni objekt, te istegnuo oba objekta. Dok nikakva razlika nije vidljiva

6) Ali zumirajmo sliku. Razlika je očita!

7) Sve što je preostalo je postaviti sve kako treba). Možete koristiti svojstva sloja (Image> Adjustments) i opcije miješanja (Desni klik> Blending options).

Ipak, zašto je bolje otvarati vektorske slike u vektorskim uređivačima?

Jer ovdje možete mijenjati ne samo veličine, ispravne linije, boje, što nije uvijek lako u Photoshopu, pogotovo za početnika.
Na kraju, trebali biste znati da u Photoshopu možete umetnuti sliku izravno iz Illustratora - samo odaberite željenu sliku u Illustratoru, Ctrl + C, i onda Ctrl + V u Photodhopu.
Nadalje, postupak je identičan gore opisanom.

Konačni rezultat

Kao što znate, vektorske ilustracije trenutno su vrlo popularne u web grafici. Profesionalni dizajneri mogu stvoriti takve ilustracije za nekoliko sati. Bilo da ste početnik ili hobi, lekcije web grafike sigurno će vam biti izuzetno korisne. Svrha ove lekcije je baciti svjetlo na proces stvaranja odabrane slike. Pokazat ću cijeli proces korak po korak i objasniti sve korake koristeći svoje komentare.


Da biste stvorili stvarno cool sliku, morate odabrati željeni program i pridržavati se određenih pravila. Ako želite nacrtati vektorsku ilustraciju, treba imati na umu da se za to koriste takvi uređivači, kao npr Adobe ilustrator ili Corel Draw... Međutim, Photoshop ima dovoljno sredstava za razvoj vektorskih ilustracija. To ću jasno pokazati u svojoj lekciji o tome kako prevesti crtež u vektor. Kao osnovu za ilustraciju odabrao sam skicu mačke. Odlučio sam prikazati plavu mačku s ružičastim cvjetovima u šapama.

Korak 1

Krenimo od stvaranja pozadine. Nacrtajte oblik pomoću alata za odabir () (u Oblikujte slojeve(Oblik sloja)). Postavke - (Prozirnost popunjavanja) = 0% ... Sada upotrijebite preklapanje s gradijentom: ((Stil sloja - Gradijentni sloj)) da ispunite stvoreni oblik. Sve postavke su zadane, samo trebate promijeniti kut (ja ću odrediti stupanj) i gradijent. Dodati Moždani udar(Stroke) ((Stil sloja - Stroke)). Koristimo sve zadane postavke, osim širine in 1 px i boje.

1. Slika. Ispod je slika minicara na kojoj će se morati poraditi da bi dobio vektorski izgled. Kvaliteta slike u ovom slučaju nije toliko važna, sve dok postoje detalji za praćenje.

2. Proces. Prvo kliknite desnom tipkom miša i učinite jednu od dvije stvari: a) Kopiraj. Zatim u Photoshopu "e Uredi - Zalijepi. U ovoj metodi Photoshop ostavlja pozadinski sloj zaključanim i lijepi sliku na novi sloj Layer 1 iznad pozadine. Dvaput kliknite na riječ Layer 1 da odaberete tekst i prikladnije imenujete sloj. Na primjer, "theimage".

b) Spremi sliku kao na vijku. Zatim u Photoshopu File - Otvorite [File - Open] i pronađite gdje ste spremili sliku. Možda na radnoj površini?.. Primijetite, u paleti slojeva ikona slike pokazuje da je slika "indeksirana" [ukratko, to je gif]. Primijetite također da je blokiran. Da biste to popravili, samo idite na Slika - Način - RGB boja [Slika - Model - RGB] i na taj način prenesite zaključani sloj na sloj pozadine. Dvostruki klik na pozadinski sloj će ga pretvoriti u sloj koji se može uređivati. [Preimenujte sloj 0 na prijateljski način ... Na primjer, "theimage".]

Sada napravimo duplikat sloja slike. Ako koristite Photoshop 7 ili CS, stvorite novi skup slojeva kako biste zadržali sve pojedinačne objekte. Samo kliknite na ikonu mape na dnu palete slojeva, dvaput kliknite na Set 1 i nazovite ga kao moj.

3. Snažan alat za olovke. Počnimo stvaranjem poteza oko cijelog automobila. Postavite boju prednjeg plana pomoću kapaljke, uzimajući boju s najtamnijeg mjesta na slici. U ovom slučaju, vrlo blizu crnoj. Sada odaberite alat za olovku iz okvira s alatima. Provjerite je li opcija Shape Layers na [vrhu trake s opcijama], ocrtao sam je narančastom bojom.

Sada samo dodajte točke sidrišta gdje mislite da trebate urediti putanju.
Savjet: Ctrl + [Plus na numeričkoj pločici s desne strane tipkovnice] za povećanje. U skladu s tim, Ctrl je obrnuto djelovanje. Preporučam korištenje ovih funkcija za više razrade slike.

4. Spajanje sidrišta. Nakon što stvorite stazu oko automobila, povežite se s prvom točkom sidrišta kako biste stvorili čvrsti oblik. Sada sakrijte sloj kopije slike da vidite što se događa. [Kao što sam učinio na donjoj slici.] Sada počnimo manipulirati sidrišnim točkama kako bismo našem autu dali vitki oblik.

Ovako sada izgleda paleta slojeva s novim slojem Vector Shape označenim plavom bojom. Također, ako kliknete na karticu Putovi na paleti slojeva, vidjet ćete "put" verziju ovog sloja.

5. Pretvaranje sidrišnih točaka. Odaberite alat za pretvorbu točaka sidrišta i manipulirajte područjima koja trebaju transformacije kako biste dali jasnu granicu automobilu.

Provjerite je li odabran sloj Shape 2.
Počeo sam pretvarati bodove s kotačem. Kliknite na sidrišnu točku i pomaknite je u smjeru crne strelice [vidi. sl.] sve dok put ne počne pratiti konture kotača.

Savjet: Alat za pretvorbu stvara 2 Bezierove točke za podešavanje zakrivljenosti.

Manipulirajte s Bezierovim krivuljama kako biste postigli što preciznije ponavljanje staza.

Savjet: Nakon pretvaranja više sidrišnih točaka [ili sidrišnih točaka], vidjet ćete da neke od izvornih točaka uopće nisu potrebne. Zapravo, što je manje sidrišta, odabir će biti glatkiji. Stoga upotrijebite alat za uklanjanje točaka sidrišta.

Evo što sam dobio. Koristit ćemo ovaj obrazac kao osnovu.

Zatim sam napravio kopiju sloja Shape 2 i manipulirao točkama kako bih nacrtao dominantnu boju [plavu, u ovom slučaju] automobila. Kliknite na sličicu ovog sloja, uzmite kapaljku i promijenite crnu boju u plavu # 3672BD.

Ovako sada auto izgleda.

Poradimo sada na prozorima.
Ponovno uključite sloj kopije slike [crna] i sakrijte sloj kopije oblika 2 [plavi].
Uzmite alat Pen Tool i na traci s opcijama uključite opciju Oduzmi od oblika područja [ocrtao sam ga narančastom bojom].

Sakrijte sloj kopije oblika 2. Odaberite sloj Shape 2. Počnite s praćenjem prozora na suprotnoj strani automobila.

Isključite vidljivost sloja kopiranja slike, pogledajte rezultat.
Oduzimanje od crnog oblika stvorilo je iluziju transparentnosti.

Da biste ovaj efekt primijenili na druga dva prozora bez dodavanja novog sloja, samo držite Ctrl + Alt, kliknite i povucite ovu stazu oduzimanja da biste kopirali. [Učinite ovo dvaput.] Sada postavite duplikate na njihova mjesta. Ponovno upotrijebite alat za pretvorbu sidrišnih točaka kako biste zagladili kutove i precizno ih oblikovali.

Primijenite istu tehniku ​​na sloj kopije Shape 2 da dobijete istu sliku kao moja.

Sada kada imamo osnovu vektorskog oblika automobila, sve što ostaje je dodati nove oblike, linije i nekoliko tekstura. Kasnije ćemo napuniti prozore!

Sada pomoću alata elipsa u Toolboxu nacrtajte središte stražnjeg kotača, zatim držite Shift i učinite isto za prednji kotač.
Za precizno pozicioniranje, pritisnite Ctrl i kliknite na novu elipsu, zatim desnom tipkom miša kliknite na jednostavnu elipsu i odaberite Free Transform Path. Ponovno kliknite desnom tipkom miša i odaberite Distort. Također sam počeo raditi na farovima [na novom sloju] koristeći istu tehniku: Ellipse - Free Transform - Distort - Set to Position.

Budući da su novi slojevi dodani, mogli su se nakupljati, razumno ih je ispravno imenovati. [Mislio sam da je moguće koristiti što manje slojeva, ali ...]

Zatim sam dodao branik. Opet, pomoću alata olovke za praćenje, alata za pretvorbu sidrišnih točaka za izglađivanje kutova i precizno oblikovanje u odnosu na original. [Sve je ovo dugo uspostavljena i prihvaćena praksa uočavanja, iskreno!]

Zatim sam na odbojnik primijenio stil sloja kako bih mu dao kromirani efekt. Desnom tipkom miša kliknite sloj bumpera i primijenite sljedeće postavke.

Napravite novi sloj i nazovite ga Linije. Ovaj sloj bi trebao biti iznad svih ostalih. Dakle, na alatnoj traci je odabran alat olovka, na ploči s opcijama postavke odgovaraju navedenim, počinjemo dodavati sidrišne točke u smjeru bijele strelice.

Sada postavite aktivnu boju na crnu [ili samo pritisnite D], pritisnite tipku B za odabir alata za kist, sada na traci s opcijama, postavite birač unaprijed postavljenih kistova i odaberite mali kist s mekim rubovima otprilike 3 veličine. Ali promijenite promjer za 2 piksela [pokušajte čak 1], budući da čak 3 mogu biti puno.

Za ponovni odabir olovke, pritisnite P, aktivirajte sloj Lines, kliknite desnom tipkom miša i odaberite opciju Stroke Path.

Od vas će se tražiti da odaberete alat s kojim želite stvoriti novi potez. Odaberite Kist s padajućeg izbornika i kliknite U redu.

Promijenio sam neprozirnost sloja Lines na 54% da ga omekšam.

Zatim sam nastavio u istom duhu, koristeći istu tehniku ​​za dodavanje drugih redaka.
Dodano ogledalo, brisači i značka na haubi.
Savjet: Za područja koja su premala za rukovanje olovkom, upotrijebite poligonalni laso. Samo kliknite i dodajte sidrišne točke poput olovke, a kada ste gotovi, desnom tipkom miša kliknite odabir i odaberite opciju "Kreiraj radni put" ili "Popuni".

Za strukture kao što su istaknuti dijelovi, upotrijebite poligonalni laso [L] za praćenje ovih područja, kliknite desnom tipkom miša i Ispunite nježno plavom bojom [koristio sam # 86A9D7].

Sve što sada treba učiniti je dodati detalje. Detalj je na vama. Ispod je rezultat mog rada nakon dodavanja detalja na prednja svjetla, kotače i te teh.
Nadam se da ste uživali u tutorialu.

Iako se moja bilješka o maskama u Photoshopu nije ohladila, hitno želim istaknuti problem pretvaranja rastera u vektor. Prije dva dana ušao sam u svoj kronofag Google analitika i što sam vidio. Ispostavilo se da neki ljudi dolaze na moju stranicu na zahtjev "raster u vektor", a u međuvremenu na mojoj stranici nema nijedne razumne napomene o ova tema... Ljudi muče Google za pretvaranje rastera u vektor Corel Draw, ilustrator pa čak Adobe photoshop ... Počnimo s Photoshopom.

Raster u vektor. Zašto je ovo potrebno?

Photoshop je bitmap program. Vektor je u njemu prisutan u obliku vektorskih obrisa. Kao takvi, u Photoshopu nema vektorskih objekata. Ali postoje vektorske staze koje se mogu pretvoriti u vektorsku masku. Maska se primjenjuje na efekt ili objekt i vektor se dobiva u Photoshopu. Sadržaj takvog objekta je još uvijek rasterski, ali se može pretvoriti u vektor kada se sprema u nekim formatima.

Na primjer, možemo stvoriti ispunu i povući vektorsku masku preko nje. Photoshop ima čitavu grupu alata koji to rade besplatno i automatski, ovo je skupina vektorskih primitiva. Za više detalja pročitajte moj članak Vektorski primitivi u Photoshopu ili. Dakle, kontura će biti vektorska. Ispunite unutar rastera.

Photoshop ne radi s vektorima punim kapacitetom. Svoje prednosti koristi samo tamo i ovdje. Ali čak iu Photoshopu rasterski objekti se mogu pretvoriti u vektorske objekte. Zašto vam ovo treba ako imate Illustrator? Pa kako da ti kažem. Prilikom aktivnog rada s grafikom nastaju različite situacije. Ponekad je lakše prevesti odabir u stazu na licu mjesta nego bezglavo ući u Illustrator i tamo raditi trasiranje. Za plijevljenje kreveta s jagodama u zemlji, ne morate zvati kombajn. Na kraju, ne žele svi, niti znaju koristiti Illustrator, ne trebaju ga svi, ne mogu ga svi sami instalirati, a vi morate tu i sada prevesti squiggle u vektor. Nije uopće potrebno sjesti s tri sveska na Illustrator par tjedana.

Pretvorba rastera u vektor u Photoshopu

Što točno Photoshop može prevesti u vektor? Bilo što ako ovaj objekt odaberete unaprijed pomoću alata grupe Odaberi... Photoshop pretvara bilo koji odabir u obris. O alatima za odabir možete pročitati u članku Primitive za odabir u Photoshopu. Dopustite mi da vam dam radni primjer. Prije mnogo godina javio mi se jedan vrlo težak kupac i zatražio tešku stranicu. Za stranicu je bilo potrebno dovršiti razne umjetnine, a ja sam je odlučio nacrtati u Photoshopu. Tijekom crtanja sam ga pretvorio u vektor, a sada ću vam reći kako. Evo jedne od onih slika koje sam naslikao kistom tvrdog ruba na svom tabletu. Nacrtao sam oko originalnog Vitruvijskog čovjeka, modificirao ga i naslikao svoje, drugačije od originala, lice. Ideja o vektorizaciji umjetnosti nastala je slučajno. No, nakon što sam ga implementirao, dobio sam priliku skalirati osobu kako želim. Štoviše, prethodno poderani rubovi i nepravilnosti nakon vektorizacije su izglađene.

Pronalaženje slike koju treba pratiti

Tražio sam leptira na Google slikama. Pretvorit ćemo ga u vektor. Imajte na umu da što je veća slika, to će naš vektorski objekt biti glatkiji. To vrijedi i za Photoshop i za Illustrator. Pod velikom slikom mislim na sliku širine 1000 piksela ili više. Moj leptir je recimo od 2000 piksela.

Odabir objekta

Odaberite s izbornika Alat najčešći čarobni štapić Alat za čarobni štapić i kliknite na bijelo područje. Ovako smo stvorili područje odabira, ali moramo odabrati leptira.

Ići Odaberite > Inverzno ili kliknite na radni prostor i na izborniku koji se pojavi odaberite Odaberite inverzno... Poanta je da stvoreni odabir mora biti obrnut kako bi se izabrao leptir. Iskreno, nije me briga kako kreirate svoj odabir. Ručno iscrtajte laso, nije bitno.

Kako napraviti vektorski put

Imamo odabir, sada ga pretvorite u vektorski put staza... Odaberite bilo koji alat za odabir poput Alat za laso, alat za pravokutni okvir ili Alat za čarobni štapić... Kliknite na područje odabira desnom tipkom miša i odaberite Napravite radni put... U izborniku koji se pojavi postavite stupanj zaglađivanja Tolerancija ukus. Ovisnost je jednostavna. Što je veći broj, to je veće zaglađivanje. Što je manji broj, to je niži anti-aliasing. Visoki anti-aliasing znači manji broj vektorskih čvorova i nepreciznije praćenje rasterske putanje. U slučaju mog Vitruvijanskog čovjeka, to je upravo ono što sam želio.

Dakle, u paleti Staza sada imamo radni put. Ako nemate paletu Staza otvori Windows> Put Radni prostor palete Staza izgleda kao radna površina ili privremeno sklonište. Na njemu se mogu pojaviti različite konture, ali ako vodite računa o dosljednom spremanju, s vremenom će nestati. Dvaput kliknite na obris Radni put i posebno spremite obris. Konture u području Staza rade na isti način kao i slojevi u paleti Slojevi... Ako je obris odabran, tada je aktivan i možete raditi s njim.

Photoshop alati za rad s stazama - Alat za odabir staze i Alat za izravni odabir... Imamo put, ali nemamo objekt. Ako ste pročitali moj niz bilješki o vektorima u Photoshopu, već znate da je vektor u Photoshopu predstavljen kao vektorska maska ​​za neku vrstu efekta ili grafike. Vektor također može biti prisutan kao pametni sloj koji upućuje na uvezenu datoteku Illustrator, ali to ćemo ostaviti za drugu bilješku. Odaberite put pomoću alata Alat za odabir staze ili u paleti puteva Staza... Kliknite na Sloj> Novi sloj ispune> Puna boja Napravili smo sloj ispune, kojemu je odmah dodijeljena vektorska maska ​​u obliku naše putanje.

Rafiniranje obrisa vektora

Koristeći materijale koje sam opisao u člancima Alati za vektorsko crtanje u Photoshopu i Add, Subtract, Intersect i Exlude u Photoshopu, zakomplicirajmo crtanje. Uzeo sam alat Alat za olovke, odabrao masku sloja ispune. U postavkama Alat za olovke postaviti Oduzeti i dodao neke elemente našem leptiru. Izrezala sam šare na krilima, a noge i antene učinila debljima.

Izrada prilagođenog oblika Prilagođeni oblici

Dobiveni objekt uvijek možete spremiti u proizvoljne oblike Prilagođeni oblici... Prije nekog vremena spomenuo sam kako se to može učiniti u članku Custom Shape Tool u Photoshopu. Odaberite sloj leptira i pritisnite Uredi> Definiraj prilagođeni oblik Naš leptir se pojavio u oblicima instrumenta Alat za prilagođene oblike.

I evo što smo na kraju dobili:

Pretvaranje rasterske fotografije u vektorsku u Photoshopu je potpuno besmislena vježba. Ali ponekad ove tehnike mogu dobro doći za pomoćni rad s grafikom i ne samo.

Rastersko-vektorsko prijevod fotografija u Photoshopu

Photoshop nije dizajniran za prevođenje rasterske grafike u vektore. U njemu, međutim, postoji nekoliko specijalnih efekata koji vizualno stvaraju privid vektorska slika... A uz pomoć tehnike koju sam opisao, od njih možete napraviti i vektorsku sliku u Photoshopu. Uzmimo za primjer običnu fotografiju koju je napravio fotograf kojeg poznajem.

Jedan od učinaka koji sam spomenuo je Filtar> Umjetnički> Izrez Postavke ostavljam na tvojoj savjesti. Slika bi trebala biti što realističnija, ali snažno anti-aliased. Mogli bismo stati na ovome, slika već izgleda "vektorska", ali je još uvijek rasterska.

Sada moramo stvoriti vektorska područja jednaka broju boja na fotografiji. Odaberite štap Alat za čarobni štapić i provjerite da potvrdni okvir nije označen u postavkama Granični... Odaberite prvo područje i slijedite cijeli put koji sam gore opisao. Izradite put iz odabira, stvorite popunjenu vektorsku masku od putanje i tako dalje.

Ukupno se cijela fotografija pretvara u vektorska područja. Zadnje bijelo područje nećemo pretvoriti u vektor. Samo nacrtajte veliki bijeli kvadrat s alatom Alat za pravokutnik i stavite ga ispod svih slojeva. Nakon laganog čišćenja i oblikovanja, fotografija izgleda kao na slici ispod. I opet, ovakav rad nije namijenjen Photoshopu i prije je perverzija. Ali, to se može učiniti, au raznim situacijama takve tehnike mogu biti korisne. Za obradu fotografije trebalo mi je 10 minuta, tako da ovakav posao ne oduzima puno vremena. I zapamtite što veća veličina tako ćete položiti fotografiju u slojeve, što će bolje i elastičnije kontura moći obilaziti područje odabira. Manje uglati i grubi naš vektor će ispasti u Photoshopu. Razne postavke Tolerancija pri izradi konture također će dati različite rezultate. Sretni eksperimenti!

U ovom vodiču ćemo govoriti o tome kako pretvoriti bitmapu u vektorski oblik u Photoshopu. Naravno, program Photoshop prvenstveno je namijenjen za rad s rasterskim slikama, a vektor u njemu je svojevrsni dodatak u obliku staza s maskom vektorskog sloja, koji se nadograđuje na objekt i stvara vektorski oblik. U takvom vektorskom obliku (Shape), put će biti vektorski, a ispuna rasterska.

U ovoj lekciji razmotrite sljedeće korake:

Napravite dokument i nacrtajte objekt

Prvo, stvorimo novi dokument bilo koje veličine i sloja.

Sada nacrtajmo bilo koju sliku. Uzmite alat Brush s mekim rubovima i punom neprozirnošću. Nacrtajmo neki jednostavan geometrijski oblik, na primjer, kao što je prikazano na slici.

Odabir bitmap objekta

Za prijevod bitmap najprije ga morate odabrati bilo kojim alatom za odabir. Sada odaberite nacrtani objekt ili pomoću Wand Tool-a ili kliknite na sloj lijevom tipkom miša držeći pritisnutu tipku Ctrl.

Pretvorite odabrani objekt u vektorski put (Put)

Koristeći bilo koji alat tipa Select, pozovite kontekstni izbornik. Da biste to učinili, pomaknite alat preko odabranog objekta i pritisnite desnu tipku miša. U izborniku koji se pojavi odaberite "Napravi radni put ...".

Pojavit će se prozor u koji ćete morati unijeti parametar tolarencije, koji određuje koliko će kontrolnih točaka sadržavati vektorski oblik, što ih je više, to će vektorski objekt biti glatkiji, ali će kvaliteta kontrolnih točaka biti niska.

Napravite vektorsku masku za sloj iz vektorske staze

Idite na karticu Putevi, gdje bi se trebao pojaviti vektorski put koji smo upravo stvorili.

Dvaput kliknite na njega da biste dali ime.

Zatim odaberite "Layer -> New Fill Layer -> Solid Color..." iz glavnog izbornika. Novom sloju možete nešto imenovati, a zatim kliknite OK. Odaberite boju za budući oblik u dijaloškom okviru za odabir boje.

Sada bi se novi sloj s vektorskom maskom trebao pojaviti na kartici Layers.

Kako spremiti vektorski objekt u biblioteku vektorskih oblika u Photoshopu

Zatim će se od vas tražiti da imenujete novi vektorski objekt. Kliknite "ok", a zatim provjerite novi objekt u biblioteci pomoću alata za prilagođene oblike.

Ako vam se lekcija o pretvaranju rastera u vektor pokazala korisnom, podijelite je društvena mreža(ikone ispod).