Danas ću vam pokazati kako napraviti gladak prijelaz između dvije fotografije.
Napravio sam sliku unaprijed i rezultat je koji sam dobio:
Da bih dobio takvu sliku, napravit ću dvije fotografije koje ću iskombinirati.
Snimio sam prekrasnu pozadinu s morem i fotografiju djevojke koja se slikala na pozadini tmurnog drveća bez lišća.
Pa krenimo - učinit ću glatki prijelaz boja a za to ću slijediti dolje navedene korake:
Korak 1
Otvaranje mojih fotografija u Photoshopu i korištenje alata Kretanje povucite djevojčinu fotografiju na pozadinsku fotografiju mora.
Želim malo smanjiti fotografiju djevojke i za ovo zovem Slobodna transformacija pritiskom na tipkovni prečac CTRL+ T.
Okvir koji se pojavio oko fotografije s djevojkom ima kvržice za koje možete povući i smanjiti veličinu fotografije, držeći tipku Shift, kako se proporcije slike ne bi iskrivile.
Korak 2
Sada idem na paletu Slojevi i kada ste na sloju s djevojkom, kliknite na ikonu pod nazivom Dodajte vektorsku masku.
Kao što vidimo u paleti Slojevi na sloju s djevojkom formira se maska sloja koja je istaknuta okvirom, što ukazuje da je maska aktivna i da će se sav posao koji ću ja izvoditi obaviti, naime, na maski sloja.
Na gornjoj ploči, gdje se nalaze sve postavke alata Gradijent kliknem na strijela pored ikone alata i u prozoru gradijenta koji se pojavi, biram radijalni gradijent, koji ide od crne do prozirne.
Sada crtam linije gradijenta prije nego što dođem do oblika djevojke kao što je prikazano na slici (možda imate više smjerova). Dok crtate gradijentnu liniju, pozadina blijedi.
Trebalo mi je dva ili tri puta da nacrtam gradijentnu liniju u svakom od smjerova naznačenih na slici kako bih postigao rezultat koji vidite na donjoj slici.
4. korak
No, možemo primijetiti da se nestankom pozadine na fotografiji djevojke donekle promijenila i slika same djevojke, budući da je na nekim mjestima postala prozirna.
Ali to je vrlo lako popraviti.
Dok sam na sloj maski, uzimam mekani okrugli četka bijelim i naslikaj ovim kistom djevojku.
Bijela četka vraća sva izgubljena područja na slici djevojke.
Također vas želimo podsjetiti da uvijek možete razgovarati o temama Photoshopa na Photoshop forumu i pronaći odgovore na mnoga svoja pitanja.
Evo rezultata:
Spojio sam dvije fotografije pomoću mješavine.
Nadam se da sam jasno objasnio kako napraviti glatki prijelaz između dvije fotografije - kao što vidite prilično je jednostavno.
Također vam savjetujem da pogledate moju prethodnu lekciju. Valentinovo u Photoshopu, u kojoj ima mnogo zanimljivosti.
Želim vam nastavak uspjeha u savladavanju Photoshopa!
S vama je bila Galina Sokolova.
1 glasDobar dan, dragi čitatelji. Danas sam vam odlučio dokazati da je najbolji način učenja teorije kroz praksu. Čak i ako ste početnik, u doslovno sat vremena možete postići dobar rezultat, a da ništa ne razumijete u Photoshopu! Gledajte, ova slika je nastala isključivo zahvaljujući gradijentima. Primjenjuju se na različite elemente iu različitim varijacijama.
Ako pročitate ovaj članak do kraja, ne samo da ćete naučiti kako napraviti glatki prijelaz boja u Photoshopu, već ćete i primijeniti to znanje u praksi u odnosu na tekst, oblik, stvoriti prekrasne treperave rombove i još mnogo toga.
Već sam napravio ovu sliku. Ako želite, onda možete sami stvarati potpuno isto, ili možda čak i bolje, ali ja ću vas naučiti drugim primjerom. Koji? Saznajte na kraju članka. Crtat ću s vama i istovremeno opisivati proces, ni sam još ne znam što ću dobiti. Zahvaljujući tome, moći ću vidjeti na koje probleme možete naići i pomoći u njihovom rješavanju.
Osnovno znanje i jedna tajna uvijek dobitne opcije
Dakle, prvo moramo otvoriti Photoshop. Toplo preporučam da preuzmete ovaj program ( ovdje možete kupiti licenciranu verziju ). Nikada nećete naći bolju od nje. Ako se bojite da ga nećete svladati i da ćete potrošiti novac, potpuno zaboravivši na program nakon prvog pokušaja, možete isprobati online uslugu https://editor.0lik.ru/ ... Mnogo je praktičnije imati svoj program i vrlo brzo ćete shvatiti zašto.
Ovako izgleda verzija Photoshopa iz 2015., ako imate drugo izdanje, ne brinite. Sve će biti otprilike isto. Imate nešto manje mogućnosti i to je jedina razlika.
Napravite novi dokument.
Odabir veličine mi je jedno od najtežih pitanja. Kao osnovu uzeo sam maksimalnu veličinu slike za objavu na društvenim mrežama. 800x500, ali, kao što možete zamisliti, nije u tome stvar. Sve ovisi o ciljevima i ciljevima koje ćete ostvariti s Photoshopom.
Pogledajte, ploča s desne strane sadrži sve glavne gumbe, uključujući gradijent. Međutim, sada se ne može pronaći. Kako to? I sam sam se suočio s ovim problemom kada sam počeo učiti raditi s Photoshopom. Pročitali ste članak, a pola informacija morate potražiti u izvorima trećih strana. Google, Google, Google.
Neka mi oprosti jedan jako pametan čitatelj koji sve jako dobro zna za mala odstupanja od teme. Želim da svi posjetitelji bloga mogu raditi s mojim lekcijama. Možda će vam jednog dana biti od velike koristi. To će vam uštedjeti puno vremena.
U donjem desnom kutu gotovo svakog gumba, osim povećala, nalazi se nešto poput strelice. To znači da je u gumbu skriveno nekoliko alata.
Držite lijevu tipku miša na gumbu nekoliko sekundi da otvorite dodatni izbornik i odaberete gradijent.
Na vrhu se otvorio još jedan dodatni izbornik. Koristi se isključivo za gradijente. Kucnite u tekst - otvorit će se poseban tekstualni izbornik na vrhu, četkica i... pa, shvatili ste.
Kliknite na strelicu pored ikone boje. Ovdje se pohranjuju standardni prijelazi ili oni koje ste preuzeli.
Ako se ne smatrate dizajnerskim genijem, preporučujem da preuzmete besplatne predloške s Interneta. Ima ih dosta. Prvo, štedi vrijeme, a drugo, nekoliko sličnih opcija u pravilu se kombiniraju u temu stvorenu u istom stilu. ovo se lako može primijeniti na jednu sliku i gotovo će uvijek izgledati dobro.
Instaliranje novih predložaka nije problem. Preuzmite ih s interneta pa odaberite maticu u gornjem desnom kutu i pronađite poveznicu "Preuzmi...".
Odaberite mapu s preuzetim datotekama na računalu i spremite.
Oni će biti dodani na dno popisa.
Napunite
Sada ćemo naučiti kako ispuniti. Odaberite bilo koju opciju koja vam se sviđa (na kreiranje ćemo prijeći malo kasnije) i kliknite na nju. Bilo gdje na zaslonu, držite pritisnutu lijevu tipku miša i pomaknite se u bilo kojem smjeru. Mjesto prijelaza boja ovisi o tome.
Vidite razliku.
Možete se vrtjeti bilo gdje.
Kako biste spriječili pomicanje vaše linije i zamućenje gradijenta, držite pritisnutu tipku Shift dok postavljate smjer.
Vidite, prijelaz boja je sada u središtu. Pobliže ćemo pogledati postavke prilikom izrade vlastitog gradijenta. Sada ću govoriti samo o središnjem offsetu. Kliknemo na ovu ploču.
Zgrabite donju boju lijevom tipkom miša i pomaknite je lijevo ili desno.
Evo s čime sam završio.
Kako primijeniti gradijent na tekst kako bi slova izgledala moderno
Ajmo sad nešto napisati. Odabiremo odgovarajući gumb.
Ako trebate promijeniti veličinu ili sam font, obratite pozornost na ploču na vrhu zaslona. Tamo je sve jednostavno.
Sada pritisnite Ctrl i istovremeno kliknite na ikonu novog tekstualnog sloja. Budite oprezni, ne morate kliknuti na tekst, već na pravokutnik, kao što je prikazano na slici ispod.
Sada stvaramo novi sloj. Postoje tri opcije za rješavanje problema: istovremeno držite pritisnute Shift, ctrl, N; upotrijebite ploču na vrhu, pronađite tamo "Sloj - novo - stvori"; koristite gumb u brzom izborniku s desne strane. Na donjoj slici sam to pokazao strelicom.
Sada, da biste uklonili isticanje oko rubova slova, možete kliknuti na odabir, a zatim kliknuti na bilo koji dio slike. Dobivate sljedeći rezultat.
Rad s tekstom tu ne prestaje. Gledajte, imamo 2 sloja: jedan s gradijentom, a drugi sa slovima. Zašto se to dogodilo tamo? Objasnit ću koliko mogu. Napišite u komentarima ako vam nije jasno. Ti si napisao tekst. Photoshop je shvatio da su to slova i čak je predložio da ih povećate, smanjite, promijenite font i tako dalje.
Onda ste odabrali ovaj komad. Napravili smo novi sloj, ako povučemo analogiju, izrezali smo šablonu iz papira i ispunili je. U ovom trenutku, Photoshop se izgubio. Prestao je vidjeti tvoja pisma. Za njega je to samo dio neke slike, poput romba, kvadrata ili kruga u uklesanom središtu. Ako krenete raditi sa slovima na sloju, nećete uspjeti, ako želite primijeniti gradijent na tekst - ista stvar.
Ako sada odlučite premjestiti tekst negdje i popnete se na odgovarajući odjeljak, a zatim počnete pomicati strelicu, tada će se sve pomaknuti umjesto vas.
Uklanjamo tekstualni sloj kako bismo izbjegli zabunu. Kliknite na nju desnom tipkom miša i odaberite željenu opciju.
Gradijentni prikazi, ispune oblika i zvjezdice
Ako ste obratili pozornost na gradijent traku na vrhu, mogli biste otkriti da su oni različiti: linearni, radijalni, kutni, zrcalni ili u obliku dijamanta. Nije teško uočiti razlike, za to ne morate čitati članke, samo otvorite prazan list i pokušajte primijeniti jednu ili drugu opciju. Vidi što se dogodilo.
Jedino što vrijedi napomenuti je da ako želite vidjeti savršen rezultat, kao na mojoj slici, strelicu treba usmjeriti iz središta.
Sada se vratimo na našu sliku. Dopustite da vas naučim jednom zanimljivom triku. Prijelazi boja mogu se koristiti unutar oblika koje crtate. Ovo je vrlo korisno, posebno za one koji će izraditi web stranice.
Dakle, odaberite pravokutnik ili krug. Nije važno.
Sada boja ispune.
Idite na odjeljak s gradijentima.
Ovdje nam treba romb.
Vidite, ovo je zanimljiv efekt, ali bijela boja sve pokvari. Trebamo transparentan. Pronađen unutar predložaka. Ako vidite takvu mrežu unutar predloška, to je ono što nam treba.
Poigrajte se postavkama i imat ćete svoju idealnu.
Sada klonimo ovaj bljesak. Odabir poteza. Samo kliknite na gumb.
Sada držite alt i povucite duplikat u stranu.
Dobio sam sljedeći rezultat.
Kako stvoriti novi gradijent i gumbe za web stranice
I na kraju, reći ću vam kako sam stvoriti gradijente od nule, a istovremeno shvatiti njihove postavke. Idemo napraviti lijep gumb? Svojoj slici ću dodati zaobljeni pravokutnik.
Ovako to izgleda. Ovaj put nećemo koristiti unutarnju ispunu. Nije baš zgodno raditi s novim predloškom kroz njega. Neka za sada bude samo crno.
Odaberite poznati alat i kliknite na ploču.
Novi gradijenti temelje se na starim. Kliknite na bilo koji. Stara verzija neće nikuda nestati. Zatim samo smislite novi naziv za njega i spremite ga.
Gornje kontrolne točke mogu se koristiti za kontrolu razina transparentnosti.
Uz pomoć donjih izvodi se rad s bojom. Da biste proširili raspon, kliknite pored bilo koje točke i ona će se duplicirati.
Možete kreirati koliko god želite.
Kako bi prijelaz izgledao moderno, morate izgladiti boje. Ne dirajte ovaj indikator i sve će biti u redu. Trebalo bi biti 100%. Spreman. Možete kliknuti na "U redu" ili "Spremi" - sve ovisi o vašoj želji.
Sada ponavljamo ono što smo već nedavno učinili s tekstom. Držite pritisnut ctrl, gurnite gumb željenog stila u sredinu i na temelju njega stvorite novi.
Sada dodajte prijelaz i voila.
Dodajte tekst na gumb i to je to. Nije jasno zašto je potrebna naprava gotova. Usput, možete preuzeti moj izvor ako želite ( Preuzmite gradient.psd izvor ). Možete ga otvoriti u Photoshopu i poboljšati moju sliku. Mislim da neće biti teško.
OK, sada je sve gotovo. Sada znate dosta o gradijentima. Ako ste dizajner, dizajner izgleda, graditelj web stranica ili želite to postati, a ova vam je lekcija bila jako korisna, pretplatite se na newsletter i saznajte više o onome što vas zanima. Također možete obratiti pažnju na ovu stranicu: https://photoshop-master.org/disc149/ ... Ovdje možete pronaći mnoštvo plaćenih i besplatnih tečajeva koji će vas naučiti stvarnom, profesionalnom radu s Photoshopom.
Sretno i vidimo se uskoro.
Izrada kolaža nije samo kombiniranje više fotografija u jednu. Ispravan kolaž pokazuje vještinu autora, a također pokazuje njegovu sposobnost da lijepo i kompetentno uredi fotografije tako da izgleda elegantno i atraktivno. Uspješan i uočljiv će biti kolaž u kojem nema vidljivih granica između fotografija – umjesto toga, fotografije kao da se prelijevaju jedna u drugu. Ovaj se učinak može postići jednostavnim koracima u Adobe Photoshopu.
Trebat će vam
- - program Adobe Photoshop
Upute
Premjestite drugu fotografiju na prethodno otvorenu.
Više o pridruživanju fotografija možete pročitati.
Zatim pomoću alata za premještanje postavite željeno mjesto fotografija jedna u odnosu na drugu. Potrebno je paziti da se jedna fotografija preklapa s drugom, a na mjesto preklapanja bit će montiran glatki prijelaz. Radi praktičnosti, možete privremeno smanjiti neprozirnost slika na ploči slojeva, također je dobra ideja staviti vodilice na granice preklapanja.
Sada ćemo odrediti koja će fotografija biti na vrhu i, ako je potrebno, promijeniti položaj slojeva na ploči slojeva. Imam sliku na Twitteru na vrhu.
Zatim vratite neprozirnost slojeva slike na sto posto.
A sada, idemo na stvaranje glatkog prijelaza između fotografija, u ovom primjeru to ćemo učiniti pomoću maske sloja i primjene crno-bijelog gradijenta.
Dodajte masku sloja sloju s gornjom fotografijom klikom na odgovarajuću ikonu na dnu palete, dok su se boje u paleti boja automatski promijenile u crnu kao glavnu boju i bijelu kao boju pozadine, ikona maske na odgovarajući sloj će se pojaviti na ploči slojeva. Zatim otvorite Gradient Tool u paleti alata. U gornjem lijevom kutu radnog prozora Photoshopa kliknite na trokut da otvorite paletu gradijenta i odaberite prvu, koja ima naziv "Od glavne boje do pozadine". Zatim povlačimo liniju od jedne vodilice do druge u smjeru prikazanom na slici.
Da biste nacrtali liniju gradijenta strogo vodoravno (ili, u drugim slučajevima, strogo okomito), držite pritisnutu tipku Shift.
Kao rezultat, dobit ćemo glatki prijelaz na prozirnost desnog ruba gornje slike, što daje efekt glatkog prijelaza između dvije fotografije.
Na ikoni maske u panelu slojeva vidjet ćemo sljedeće promjene, crna boja pokazuje punu transparentnost, a bijela, naprotiv, punu neprozirnost slike na koju je primijenjena maska sloja.
To je, zapravo, sve, zadatak je obavljen!
Pozdrav dragi webmasteri početnici. opet .
U ovom članku ću vam reći kako napraviti prijelaz iz tamnih u svjetlije nijanse, kao i iz jedne boje u drugu.
Ova se radnja naziva gradijent, a budući da je u biti pozadinska slika, izvršava se pomoću svojstva pozadine, koje uzima dvije vrijednosti:
1.linearni gradijent - prijelaz boje s jednog ruba ili kuta u drugi.
2. radijalno-gradijent - prijelaz boje od središta do rubova.
Napisano je kako slijedi:
pozadina: -moz-linear-gradient (vrh, # ff0000, #ffcfcf);
vrh, # ff0000, #ffcfcf);
U nastavku ćemo, koristeći primjer, detaljno analizirati svaki element ovog zapisa.
Nažalost, gradijent još uvijek ima problema s renderiranjem u preglednicima, te sa W3C specifikacijom, tako da i dalje morate koristiti prefikse u vrijednostima.
Prefiks se stavlja na početak vrijednosti i počinje crticom.
Morat ćemo umetnuti takav popis u selektor elemenata, stvarajući za njega gradijent, kako bi se vaša vrlo lijepa pozadina ispravno odrazila u svim preglednicima. Ljepota zahtijeva žrtvu.
Ovo je najjednostavniji, dvobojni gradijent. Analizirajmo detaljno vrijednosti svojstva pozadine
Prvi red postavlja pozadinu za preglednike koji ne podržavaju linearne gradijente.
Sljedećih 5 redaka služi za prikaz pozadine u različitim preglednicima. Prvo, vrijednost gradijenta se ispisuje s prefiksom na početku.
Zatim, u zagradama:
vrh - smjer iz kojeg počinje prva boja (može biti dolje, lijevo, desno)
# ff0000 - prva boja odvojena zarezima; 
#ffcfcf - druga boja odvojena zarezima;
Safari do verzije 5 i Chrome do desetak imali su vlastitu sintaksu, što značajno povećava kod. Vjerojatno zbog toga gradijent za ove verzije često nije naveden, pogotovo kada ima puno boja.
Prijelaz boje možete napraviti ne vodoravno ili okomito, već od kuta do kuta. Za to postoje sljedeći smjerovi:
dolje desno - od donjeg desnog kuta do lijevog gornjeg;
dolje lijevo - od dolje lijevo prema gore desno;
gore desno - od gore desno do dolje lijevo;
gore lijevo - od gore lijevo do dolje desno;
Možete napraviti prijelaz boje od središta bloka do rubova. Zatim u značenju umjesto riječi linearno (linearno) stavite radijalno (radijalno)
#gradient (
pozadina: # ff0000;
pozadina: -moz-radial-gradient ( središte, poklopac elipse, # ff0000, #ffcfcf);
pozadina: -webkit-radial-gradient ( središte, poklopac elipse, # ff0000, #ffcfcf);
središte, poklopac elipse, # ff0000, #ffcfcf);
središte, poklopac elipse, # ff0000, #ffcfcf);
širina: 600px;
visina: 400px;
obrub: 1px čvrsta # 333;
}
Sada napravimo nešto poput duge, da tako kažem. Da biste to učinili, dodajte još nekoliko boja u gornji kod i postavite glasnoću svake boje kao postotak (broj boja nije ograničen)
Volumen boje je postavljen od 0% do 100%, (prvi - 0%, zadnji - 100%, ostatak između njih u redoslijedu). Razmotrite ovu opciju na radijalnom gradijentu. Na linearnom se sve radi na isti način.
#gradient (
pozadina: # ff0000;
pozadina: -moz-radial-gradient ();
pozadina: -webkit-radial-gradien t ( središte, poklopac elipse, # ff0000 0%, # 00b630 30%, # 6ff5f5 70%, #ffcfcf 100%);
pozadina: -o-radial-gradient ( središte, poklopac elipse, # ff0000 0%, # 00b630 30%, # 6ff5f5 70%, # ffcfcf1005);
pozadina: -ms-radial-gradient ( središte, poklopac elipse, # ff0000 0%, # 00b630 30%, # 6ff5f5 70%, #ffcfcf 100%);
širina: 600px;
visina: 400px;
obrub: 1px čvrsta # 333;
}
Princip je, mislim, jasan. Dakle, redak za Safari do pete verzije, a Chrome do desete, pokušajte je napisati sami.
Gradijent se može postaviti za bilo koji HTML blok (tijelo, div, h1-6, p, ul, ol), globalni i inline stil (ovo je za web-mjesto WordPress).
Sada nekoliko riječi o tome kako i gdje odabrati boje. Postoje usluge gradijenta koje nude boju, postotak glasnoće i gradijentni kod, ali su njihove mogućnosti ograničene.
Stoga koristim alat colorscheme.ru, u kojem možete odabrati boju u neograničenom rasponu, te optimalno odabrane sekvence i kombinacije.
Broj kombiniranih boja odabire se u gornjem redu ploče. Nakon prolaska kroz "Kut 30 °" raspon odabira se mijenja.
U "Shemi podešavanja" ton je tamniji ili svjetliji. U "Popisu boja" sve boje prisutne u shemi su raspoređene po zasićenosti, te s kodom u potpisu.
Općenito, neograničene mogućnosti za odabir boja za stvaranje gradijenta.
Želim vam kreativni uspjeh.
- Rabinoviču! Imate li kusur od sto dolara?
- Ne, ali hvala na komplimentu!
Dvije žene iz Odese:
- Rose, kako ti se sviđa moja nova haljina?
- Oprosti, Sarah, žurim, sad mi nije do skandala!
