04.07.2016 27.01.2018

U ovom ćete vodiču naučiti kako izraditi plosnate ikone društvenih medija.

Što ćete stvoriti:

Za izradu ravnih ikona, počet ćemo s pozadinom, zatim ćemo ikonama dodati efekte kako bismo im dali originalnost, a zatim ćemo nacrtati duge sjene. Za ponavljanje ovog vodiča trebat će vam Photoshop CS3 ili noviji.

Resursi:

• Font 1 - http://fontawesome.io/cheatsheet/
• Font 2 - http://fontawesome.io/

Korak 1

Napravite novu datoteku (Ctrl + N) veličina 500 × 400 piksela.

Stvorite novu grupu (CTRL+G) i nazovite ga "Pozadina".

Korak 2

Ispunite pozadinu boja # e7e9ea pomoću Alat za kantu.

3. korak

Da bismo dodali više efekata pozadini, dodat ćemo gradijent. Kliknite na ikonu Sloj za prilagodbu i odaberite Gradijent (Gradijent), koristite sljedeće postavke:

Način stapanja slojeva Meko svjetlo (Meko Svjetlo) | Neprozirnost: 25%

Korak 4

Napravite novu grupu i nazovite je "simboli".

Korak 5

Prije nego što počnemo, moramo postaviti jelovnik Vladari I Rešetke (ravnala i mreže). Idite na izbornik Ravnala za prikaz (Pogled- Vladari) I Pogled-Prikaži-mreže (Pogled— Pokazati— Rešetke) . Ovdje su moje postavke za Ravnala i mreže(mogu se otvoriti odlaskom na Uredi-Postavke:

Stvoriti Linija vodilja, samo ga trebate kliknuti i povući s ravnala. Za izradu okomite vodilice povucite s okomitog ravnala i obrnuto. Ovako sam podijelio platno (svaka ikona je jednaka 50 × 50 piksela i udaljenost između svake ikone 25 piksela):

Korak 6

U ovom vodiču radimo s fontom Awesome, možete dodati prilagođene ikone za svoje web mjesto. Obično se to radi postavljanjem CSS fonta na vašu web-lokaciju, ali budući da radimo s Photoshopom, morat ćemo kopirati svaku ikonu koju želite koristiti s varalice. Idite na stranicu, odaberite ikonu koju želite nacrtati. Koristio sam ikone za sljedeće ( društveni mediji) stranice: Twitter; facebook; Tumblr; Google+;Instagram; YouTube; Trzaj; Dropbox; DeviantArt; Pinterest; Skype; hraniti se.

Korak 7

Nakon što pronađete ikonu koju želite koristiti, kopirajte je ( Odaberite ga, a zatim desnom tipkom miša kliknite-Kopiraj)

Zatim se vratite u Photoshop i odaberite Alat za tekst (Tekstalat) na alatnoj traci. Promijenite postavke fonta kao što je prikazano na slici:

Sada zalijepite ikonu koju ste upravo kopirali. ( Desni klik-Zalijepi)

Korak 8

Ponavljajte prethodni korak dok ne umetnete sve ikone koje želite koristiti.

Korak 9

Napravite novu grupu i preimenujte je u "icon bg", postavite grupu ispod grupe "symbols".

Korak 10

Napravite novi sloj i smjestite ga u grupu stvorenu u prethodnom koraku. Preimenovao sam sloj u "icon bg".

Korak 11

Korištenje alata Pravokutnik sa zaobljenim kutovima (PravokutanAlat za oblik kruga)(nalazi se na alatnoj traci ispod alat za tekst) Napravio sam pozadinu ikona,

Evo svih boja koje sam koristila:
Twitter: # 6bd1f4;
Facebook: # 5a93cb;
Tumblr: # 3c6a9c;
Google +:# e44940;
Instagram:# 9bd29d;
Youtube:# f4504c;
Trzaj:# a96db6;
Dropbox:# 81d5ed;
Deviantart:# 6e8e61;
Pinterest:# f25f5f;
Skype:# 67d5f4;
Feed: # e9951d;

Možete koristiti ove boje ili možete koristiti boje po vlastitom nahođenju - na taj će način rad dobiti originalnost.

Ako vam se ne sviđa izgled zaobljenih pravokutnika, možete odabrati drugačiji oblik, poput kvadrata ili kruga. Kako biste napravili savršen krug ili kvadrat, ne zaboravite držati Tipka SHIFT u trenutku njihovog nastanka.

Korak 12

Ako ste zadovoljni rezultatima u ovom trenutku, možete nastaviti, ali ako želite dodati malo života ikonama, nastavimo s poboljšanjima. Počnimo s stil sloja Sjena (Drop Shadow). Otvorite grupu "simboli", odaberite jednu od ikona i kliknite na ikonu Fx-Sjena (Fx-Drop Shadow)

Korak 13

Ponovite prethodni korak s preostalim ikonama. Kako biste si olakšali rad kliknite desni klik na sloj - Kopiraj stil sloja. Zatim odaberite preostale slojeve ikona, kliknite desni klik-Zalijepi stil sloja.

Korak 14

Sad dodajmo unutarnja sjena na pozadinu svake ikone. Otvorite grupu “icons bg”, odaberite sloj s ikonom, kliknite na ikonu Fx-Unutarnja sjena (Fx-InnerSjena) . Koristite sljedeće opcije:

Korak 15

Napravite novi sloj i nazovite ga "Gloss Effect". Promijenite boju prednjeg plana u # ffffff; i uz pomoć Alat za pravokutni okvir napravite nekoliko pravokutnika polovice veličine ikona (cca. 50x25 piksela). Učinite to za sve ikone.

Zatim promijenite način miješanja u Soft Light, smanjiti Neprozirnost naslagati se 20% , A ispuniti prije 80% .

Korak 16

Isključite vidljivost sloja "Gloss Effect". Napravite novi sloj i nazovite ga "Long Shadow". Ovaj korak je malo kompliciraniji u usporedbi s ostalim efektima. Postavite novi sloj ispod sloja "Gloss Effect".

Korak 17

Uzeti Alat za poligonalni laso i počnite stvarati pravokutnu sjenu tako da dodirnete rub ikone samo na donjoj desnoj strani, zatim napravite dijagonalnu liniju dok ne dođe do donjeg desnog ruba pozadine ikone, napravite ravnu liniju dok ne dođe do središta pozadine, zatim povežite linije. Na slici možete jasnije vidjeti kako nacrtati dugu sjenu.

Korak 18

Posljednji korak! Smanjiti Neprozirnost sloj sjene do 10% , I napuniti (Fill) prije 0% .

Sada kliknite na ikonu Fx i odaberite Prekrivanjeboje (Bojapreklapanje). Koristite sljedeće opcije:

Sada odaberite Prekrivanjegradijent (Gradijentpreklapanje) i koristite ove postavke:

Konačni rezultati:

Svi znaju da standardna računalna tipkovnica ima malo više
stotine tipki, što znači da ne može prikazati sve znakove koji
koriste ljudi u svakodnevnom životu. Ali to ne znaju svi
osim unosa znakova koje vidimo na
na vašoj tipkovnici, Windows vam omogućuje korištenje i drugih simbola. Na primjer:

Ali
unatoč činjenici da ovi (i mnogi drugi) simboli nisu na
tipkovnice, možemo ih vrlo jednostavno koristiti kada upisujemo naše
tekstovi. Pokušajmo to učiniti...
Pretpostavimo najjednostavniju opciju - upisujemo tekst u Notepad ( Start - Svi programi - Pribor - Notepad) i trebamo u tekst umetnuti simbol autorskog prava:

Da bismo to učinili moramo otvoriti tzv Tablica simbola, koji postoji u operacijski sustav Windows. To je vrlo jednostavno učiniti: Start - Svi programi - Pribor - Alati sustava - Tablica znakova.
Pred nama će se otvoriti tablica simbola Unicode, u kojem trebamo pronaći simbol koji nam je potreban:

Nakon toga trebate kliknuti na ovaj simbol lijevom tipkom miša, a zatim pritisnuti tipku Odaberite i gumb Kopirati:

Ovo će kopirati odabrani simbol u međuspremnik.

Nakon toga u tekstu će se pojaviti simbol koji nam je potreban:

Kao što vidite, u ovome nema ništa teško! Ovo je najjednostavniji i najrazumljiviji (na
moje mišljenje) metoda, iako možete malo promijeniti redoslijed radnji i
unos znakova bez otvaranja Tablica simbola. Da biste to učinili, samo trebate znati određenu kombinaciju tipki.
Činjenica je da je u sustavu Windows mnogim znakovima dodijeljen jedinstveni kod koji se unosi pomoću ključa Alt.
Na primjer, za unos istog simbola autorskog prava morate pritisnuti kombinaciju tipki Alt+0169, tj. pritisnite (i držite) tipku Alt, zatim pritisnite brojčane tipke 0 , 1 , 6 I 9 .
Imajte na umu da kada se pritisne tipka Alt
brojevi na glavnom polju tipkovnice mogu se blokirati, i stoga, za
Za unos brojeva možete koristiti dodatno polje tipkovnice
(prethodno ga uključivši ključem NumLock

Koja kombinacija tipki odgovara odabranom simbolu možete vidjeti u donjem desnom kutu Tablice simbola:

Ako stalno koristite neke simbole, onda sam ja
Preporučujem da napravite podsjetnik za sebe (tabelu s opisom često
korišteni kodovi) i ispisati na pisaču. Na primjer, ovako:

Ali imajte na umu da nema svaki simbol iz tablice sličan
kombinacija i stoga se neki znakovi moraju unijeti kako je gore opisano
put.
Kako biste lakše pronašli željeni simbol u tablici,
možete koristiti dodatne opcije i pregled
simboli po skupinama.
Da biste to učinili, potvrdite okvir Dodatne mogućnosti a zatim odaberite željene opcije u poljima Skup znakova I Grupiranje. Na primjer, ova slika pokazuje kako možete prikazati samo numeričke znakove:

Ili, na primjer, možemo prikazati samo onu koja nam odgovara Windows kodiranje"Ćirilica":

Pa, zaključno, želio bih napomenuti da neki programi imaju ugrađenu mogućnost umetanja posebnih znakova.
Na primjer, u izborniku Word programi može birati Umetni - Simbol(fotografija iz Worda 2010):

Ovo uvelike ubrzava vaše tipkanje, jer... nema potrebe pribjegavati Windows tablici simbola.

Vrlo često postavljaju pitanje kako umetnuti specijalce dok ste u Windowsima (bilo u Wordu, Notepadu ili Photoshopu - nije važno). simboli?

Za neupućene, objasnit ću za svaki slučaj: poseban. simboli su različite ikone i simboli, kao što su autorsko pravo (©), stupanj (5²) ili razlomak (¼). Sve su to posebni znakovi.

Pa evo ga. Recimo da trebate staviti razlomak ¼. Kako to učiniti? I vrlo je jednostavno za napraviti!

Kako umetnuti poseban znak u Photoshop ili bilo koji drugi program

I zato, prije svega, pogledajmo kakvi simboli i posebni simboli postoje. Da biste to učinili, otvorite tablicu simbola.

Nalazi se ovdje: Start -> Svi programi -> Pribor -> Alati sustava -> Tablica znakova

Pred vama se otvara sljedeći prozor: U kojem možete vidjeti razne simbole. Odaberite simbol koji vas zanima i u donjem desnom kutu (označeno plavim krugom) pojavit će se tipkovnička prečaca za umetanje tog simbola.

Na ovaj trenutak označen je simbol autorskog prava © i, prema tome, da biste ga umetnuli potrebno je učiniti sljedeće: Kliknite Tipka Alt i držeći je na numeričkoj tipkovnici (onoj sa strelicama, pogledajte sliku ispod) upišite broj 0169, zatim otpustite alt. To je sve!

Imajte na umu da nestandardni fontovi možda neće podržavati posebne znakove. Također u prozoru za pregled posebnih znakova možete vidjeti koji fontovi podržavaju koje znakove. Da biste to učinili, jednostavno odaberite font koji želite na vrhu prozora!

Za većinu korisnika Word aplikacije, ovaj problem je riješen vrlo jednostavno. U tekstu Uređivač riječi pritisnite “Umetni” -> “Simbol”. Pojavit će se prozor u kojem možete odabrati simboli. Kada kliknete gumb "Umetni", automatski će se pojaviti u glavnom polju uređivača teksta.

Osnove rada s alatima grupe Tekst u Photoshopu: upravljačka ploča, postavke, funkcije i mogućnosti.

Grupa se nalazi na alatnoj traci ispod gumba sa slovom “T”. Otvorite ga na bilo koji način:

• klikom na crni donji desni kut ikone;
• desnim klikom na ikonu

Tekst možete aktivirati pritiskom na tipku T (rusko E) na tipkovnici. I nije važno koji je raspored tipkovnice u ovom trenutku. Dok držite pritisnutu tipku Shift, nekoliko puta pritisnite tipku "T" naizmjenično će aktivirati sva četiri alata u ovoj grupi.

Sl. 1. Grupa alata za tekst

Ovdje je sve intuitivno.

1. Horizontalno – za stvaranje uobičajenog snimanja u vodoravnom položaju.
2. Okomito – postavlja natpis odozgo prema dolje.
3. i 4. Stvorite brze maske s vodoravnim i okomitim odabirom.

Najčešće se koristi horizontalni smjer.

Upravljačka ploča grupe alata za tekst

Kada je alat aktivan, gornja upravljačka ploča izgleda ovako:

sl.2. Gornja alatna traka Tekst

U Photoshop verzije CS6 je predstavio izbornik Font koji sadrži nekoliko opcija za postavke. O tome će biti riječi u drugom članku. Sada pogledajmo postavke gornje upravljačke ploče.

Pažnja! Bolje je postaviti sve postavke gornje ploče za alate za tekst u Photoshopu prije upisivanja natpisa. Ali kasnije možete napraviti promjene tako da prvo odaberete tekst ili njegov dio koji treba promijeniti.

• Iznad broja 1 sl. 2 – spremanje parametara. Vrlo zgodna značajka za spremanje instalirane postavke(naziv fonta, njegova veličina, itd.) ako im se povremeno morate vraćati ili prije rasterizacije sloja teksta.

Kliknite na malu strelicu da otvorite prozor. Odaberite “Novi skup parametara za alat. Otvara se drugi prozor u kojem možete postaviti naziv parametra. Pritisnite OK. Urednik pamti postavke.

sl.3. Spremanje parametara teksta u Photoshopu

Na popisu se pojavljuje novi redak. Radi jasnoće, u prethodnom koraku upisan je naziv “Primjer novog spremanja”.

sl.4. Spremljene postavke

Sada, da biste na ploči postavili sve vrijednosti koje su bile tamo prilikom spremanja, morate kliknuti na ovu liniju.

Da biste izbrisali liniju, desnom tipkom miša kliknite na nju i odaberite Izbriši.

• Iznad broja 2, sl. 2 – promijeniti orijentaciju teksta. Pritiskom na tipku sa slovom T i strelicama - smjer natpisa se mijenja iz vodoravnog u okomiti i natrag. Ne zaboravite da ovaj tekstualni sloj mora biti aktivan u paleti slojeva.
• Iznad broja 3, sl. 2 – tip fonta. Klikom na gumb sa strelicom otvara se cijeli popis fontova dostupnih na vašem računalu. Možete odabrati onaj koji vam je potreban s popisa ili ga unijeti u prozor ručno, a zatim pritisnite Enter.
• Iznad broja 4 sl. 2 – stil fonta. Gumb sa strelicom otvara popis stilova koje odabrani font podržava. Ako je gumb neaktivan, tada odabrani font podržava samo jedan predloženi stil.
• Gumb iznad 5 sl. 2 – veličina fonta, zvani Kegl. Padajući popis nudi opcije od 6 do 72 piksela. Možete unijeti bilo koju od svojih vrijednosti u prozor ručno, a zatim pritisnite Enter. Dovoljno je unijeti samo brojeve, a editor će automatski umetnuti slova “pt”.

Veličinu možete odabrati na sljedeći način: pomaknite kursor ulijevo od prozora kada izgleda kao prst sa strelicama, držite lijevu tipku miša i povucite udesno da povećate veličinu ili ulijevo da je smanjite. Digitalna vrijednost u prozoru će se promijeniti. Čim pustite miš, veličina teksta će se promijeniti.

• Iznad broja 6 sl. 2 – stil fonta. Klikom na ovaj gumb otvara se popis stilova koje odabrani font podržava: kurziv, podebljano, podebljano... Ne podržavaju svi fontovi puni popis stilova, tako da može postojati različit broj opcija. Ako gumb nije aktivan, tada odabrani font podržava samo jedan predloženi stil.
• Iznad broja 7 sl. 2 – poravnanje teksta s jedne strane ili u sredini. Gumbi rade na isti način kao u Word dokument. Postavke su na ploči Odlomak. Pročitajte o tome u nastavku.
• Iznad broja 8, sl. 2 – izbor boja. Okvir prikazuje boju koja će se primijeniti na tekst. Možete ga promijeniti klikom na ovaj prozor i odabirom bilo kojeg drugog u paleti koja se otvori. Ako je tekst već unesen, prvo ga je potrebno označiti.
• Iznad broja 9 sl. 2 – deformacija teksta. Kliknite na ovaj gumb, zatim otvorite stilove i imamo razne mogućnosti deformacije. Eksperiment.

sl.5. Iskrivljeni tekst

• Iznad broja 10, sl. 2 – otvara/zatvara Ploče znakova, odlomaka. Više o ovome.

Ploče znakova, odlomaka

Ploče Character i Paragraph otvaraju se u Photoshopu pomoću gumba na gornjoj upravljačkoj ploči ili na desnoj ploči. Ako nisu na desnoj ploči, usput uključite izbornik Prozor - odaberite Simbol ili Odlomak. Odgovarajuće ikone pojavljuju se na desnoj ploči. Ako su obje odabrane, pojavit će se dvije ikone iste grupe, ali kada otvorite bilo koju od njih, u prozoru će se pojaviti dvije kartice za praktično prebacivanje između ovih ploča.

Pažnja! Ploča Znakovi, kada radite s alatima grupe Tekst, ima prednost nad pločom Odlomak.

sl.6. Ploče znakova, odlomaka

Ploča sa simbolima

Neke od postavki na ovoj kartici dupliciraju funkcije gornje upravljačke ploče i o njima je već bilo riječi. Nemojmo ponavljati. Vrijednosti u njima bit će postavljene na iste one koje ste postavili na gornjoj ploči - font, njegova veličina itd.

Ostali su prikazani na gornjoj slici 6:

1. Razmak između redova. Definira razmak između redaka.
2. Kerning za podešavanje udaljenosti između dva znaka. Na primjer, od cijelog teksta samo dva lika treba približiti ili udaljiti jedan od drugog. Postavite kursor između njih, otvorite popis i odaberite prava opcija, ili ga unesite u prozor ručno.
3. Razmak između znakova za postavljanje udaljenosti između znakova teksta.
4. Vertikalna ljestvica za povećanje/smanjenje visine znakova postavljena je kao postotak. Unesite broj u kućicu ručno. Ne morate stavljati znak %; Photoshop će ga automatski staviti čim pritisnete Enter.
5. Horizontalna skala rasteže/sabija šav. Kao i prethodni parametar, unosi se u postotku.
6. Osnovni pomak. Pogodna funkcija pri uvođenju matematičkih formula i drugih zapisa s nadindeksom i podindeksom. Omogućuje vam podizanje/spuštanje dijela retka ili riječi. Ovaj dio najprije mora biti odabran. Ručno unesite vrijednost u prozor. Sljedeći redak pruža slične mogućnosti – pseudo-parametre.
7. Pseudo-parametri. Postavke fonta u ovom retku jasno su vidljive - podebljano, kurziv, tekst napisan velikim slovima itd.
8. Ligature, odnosno simboli koji se dobivaju spajanjem više slova ili znakova, odnosno spajanjem u jedan znak. Vrlo rijetko korišten. Bit će aktivni samo oni koji podržavaju odabrani font.
9. Otvara popis jezika za provjeru pravopisa.

Ploča s odlomkom

Postavljanje parametara odlomka kao što su uvlačenje, prelamanje itd.

sl.7. Ploča s odlomkom

U prvom retku, prva tri gumba su duplicirana s gornje upravljačke ploče. O njima je već bilo riječi. Preostali gumbi će najvjerojatnije biti neaktivni. Sljedeća tri gumba u ovom retku dizajnirana su za poravnavanje donjeg retka teksta, a posljednji je za poravnavanje cijele širine.

Drugi blok ima tri prozora u kojima se u pikselima postavljaju uvlake s desnog ili lijevog ruba te uvlaka prvog retka.

Treći blok označava uvlake prije ili iza odlomka

U sljedećem bloku omogućeno je/onemogućeno automatsko spajanje.

Upotrijebite ploču Glifovi za umetanje interpunkcijskih znakova, nadnaslova, indeksa, simbola valuta, brojeva, posebnih znakova i glifova iz drugih jezika u tekst u Photoshopu.

Za otvaranje ploče odaberite Tekst > Ploče > Glifi ili Prozor > Glifi.

Ploča s glifovima

A. Nedavno korišteni utori za glifove | B. Odabir obitelji fontova | C. Odabir stila | D. Odabir kategorije fonta | E. Utori za glifove | F. Smanji | G. Kontrola zumiranja | H. Povećaj | ja Smanjenje glifa | J. Zumiranje glifa |

• Da biste promijenili glif u sloju aktivnog teksta, slijedite ove korake:
  1. Odaberite gdje ćete umetnuti glif pomoću alata Tekst.
  2. Dvaput kliknite na glif na ploči Glifovi.
• Panel Glyphs podržava latinicu, grčku i ćirilicu. Ograničena podrška Hebrejsko, arapsko i druga složena pisma poput indijskog.

• Za svaki font, glifovi su organizirani u različite kategorije, kao što su osnovna latinica, proširena latinica A, proširena latinica B, brojevi, valute, simboli i mnoge druge.
• Glifi su također organizirani prema tome koje značajke OpenType podržavaju, kao što su: zamjene, ukrasi, proširene ligature, brojnici, nazivnici, setovi stilova, jednorazredni brojevi, redni brojevi i mnogi drugi.

A. Kategorija fonta | B. Skripta | C. Značajke OpenType

• Ploča Glifovi automatski pronalazi alternative za prvi odabrani znak u tekstu.
• Utori za glifove s punim crnim pravokutnikom u donjem desnom kutu pokazuju da postoje opcije za taj određeni glif. Ove opcije mogu se vidjeti u skočnom izborniku. Da biste ga otvorili, kliknite i držite utor ili ga pritisnite tipkom Alt ili Option. Povucite pokazivač miša preko varijante glifa i otpustite ga da biste ga zalijepili u aktivni sloj.

Utor za glif s punim crnim pravokutnikom u donjem desnom kutu

Opcije glifa

Detalji glifa

• Klizač na dnu dijaloškog okvira omogućuje vam povećanje ili smanjenje veličine glifova na ploči.
• Izbornik Font prošireni je izbornik koji sadrži iste stavke koje se nalaze na pločama Znakovi i Opcije. Međutim, pretraživanje fontova nije podržano.
• Kada je više fontova u odabiru na tekstualnom sloju, ploče Znakovi, Opcije i Glifovi ne prikazuju font.
• Možete raditi s pločom Glyphs bez pokretanja tekstualnog sloja.

Dok dodajete glifove u svoj dokument, oni se automatski dodaju u nedavno korišteni redak glifova na vrhu ploče Glifovi. Nedavno korišten niz glifa:

• može sadržavati do 25 razni likovi. Kada se prekorači ograničenje od 25 znakova, novi se glifovi dodaju s lijeve strane, a prethodni se glifovi uklanjaju s desne strane.
• sadrži iste znakove. Simboli se ne mijenjaju kada se program pokreće u različito vrijeme.
• čuva stil glifa i ne uzima u obzir njegov stil na pločama Opcije, Znak i Glifi.
• određuje veličinu točke, boju i druge vrijednosti glifa u skladu s onima u pločama Znak i Opcije.