Desenați un cub cu colțuri rotunjite în Photoshop. Cum să rotunjiți colțurile ascuțite în Photoshop

În această secțiune a site-ului meu am decis să plasez lecții de Photoshop, care vă poate fi util atunci când creați un design de site web. Cred că nu ar fi de prisos, din partea mea, înainte de a începe să învăț Photoshop, să vă prezint Taste rapide Photoshop. Folosind Taste rapide Photoshop, îți vei face munca mai ușoară și vei economisi timp. .

Prima mea Lecție de Photoshop iti va spune cum după colțuri fotografie.

Când creați site-uri web, de multe ori trebuie să vă ocupați de problema cum să rotunjiți colțurile unei imagini sau cum să după colțuri fotografie. În această lecție Photoshop Te voi învăța cum după colțuri atrăgând photoshop. De asemenea, acesta Lecție de Photoshop vă va permite după colțuri fotografii. Sper că acest lucru vă este clar. La urma urmei, pentru Photoshop atât poza cât și fotografia sunt toate la fel. În munca mea folosesc Adobe Photoshop SC5, versiunea rusă. Ei bine, nu mă pricep la limbi străine.

Lecția de astăzi este despre rotunjirea colțurilor unei fotografii în Photoshop. Să facem o fotografie împreună cu colțuri rotunjite ca în poza mea.

1. A implementa colțurile rotunjite în Photoshop, deschis cu Photoshop poza (foto) de care avem nevoie. De exemplu, am făcut una dintre fotografiile din arhiva mea foto.

2. Aducem dimensiunile desenului la parametrii de care avem nevoie. Pentru a face acest lucru, apăsați ALT+CTRL+I. Se deschide fereastra Dimensiune imagine. Stabilim dimensiunile de care avem nevoie. Puteți decupa pur și simplu imaginea mărimea potrivită.

3. Selectați imaginea (CTRL+A) (va apărea o linie punctată în jurul perimetrului) și copiați-o (CTRL+C); Copiem fotografia, astfel încât imaginea originală să rămână neschimbată după finalizarea colțurile rotunjite în Photoshop. Deși putem lucra la original, când colțurile rotunjite sunt gata, pur și simplu vom salva fotografia ca altă imagine.

4. Deschideți o nouă fereastră (CTRL+N), setați dimensiunile necesare imaginii și faceți clic pe „OK”. Vă rugăm să rețineți că am setat fundalul la „transparent”. Puteți seta imediat fundalul la culoarea dorită;

5. Lipiți imaginea copiată într-o fereastră nouă (CTRL+V) și creați strat nou(CTRL+SHIFT+N). În acest strat, utilizați instrumentul dreptunghi colturi rotunjite„Desenați un dreptunghi de dimensiunea necesară. Culoarea dreptunghiului nu contează. Instrumentul este selectat făcând clic pe butonul din dreapta al mouse-ului. Sau pur și simplu apăsând tasta (U). Setăm raza de curbură la discreția noastră ( vezi figura de mai jos);

Dacă este necesar, puteți muta forma desenată folosind tastele săgeți de pe tastatură sau folosind mouse-ul în timp ce țineți apăsat tasta stângă. În primul rând, nu uitați să activați „mutare” pe bara de instrumente (butonul de sus). Poti de asemenea redimensiona cifre. Pentru a face acest lucru, apăsați (CTRL+T) și întindeți forma la dimensiunea dorită folosind mouse-ul în timp ce țineți apăsată tasta din stânga. Dacă doriți să schimbați dimensiunea menținând proporțiile, trebuie să țineți apăsat SHIFT și să trageți de colțul formei.

6. Accesați panoul de straturi. Ținând apăsat CTRL, faceți clic stânga pe previzualizarea (imaginea) stratului dreptunghi. Apare un contur punctat al formei.

7. Treceți la stratul inferior. Pentru a face acest lucru, faceți clic pe partea dreaptă a imaginii din panoul de straturi. În cazul nostru, stratul 1. Evidențierea albastră va merge la stratul 1.

8. Apăsați CTRL+SHIFT+I. O selecție punctată va apărea de-a lungul marginii acelei părți a imaginii care se află în afara dreptunghiului nostru colturi rotunjite.

9. Apăsați DEL de pe tastatură. Partea din imagine care se află în afara dreptunghiului va fi ștearsă.

10. Reactivați stratul dreptunghi. Ștergeți-l făcând clic pe pictograma coșului de gunoi.

11. Apăsați tasta „M” și faceți clic stânga oriunde în imagine. Selecția a fost eliminată. gata. Puteți salva imaginea pe care am primit-o colțurile rotunjite în Photoshop, în formatul de care avem nevoie.

Dacă o astfel de imagine va fi folosită pentru a crea un site web, salvați-o pentru Web și dispozitive (ALT+SHIFT+CTRL+S).

12. Atentie! Dacă aveți imagini în jurul marginilor cu colturi rotunjite Există încă pixeli transparenți, trebuie să efectuați tăierea. Pentru a face acest lucru, faceți clic pe „Imagine”, selectați „Decupare”, în fereastra care apare, setați setările ca în imaginea mea și faceți clic pe „Ok”. Pânza va fi redimensionată la dimensiunea imaginii și orice pixeli transparenți suplimentari vor fi eliminați.

The lecție de Photoshop poate fi folosit și pentru a obține fotografii ovale, și pentru obținerea de fotografii figurate. Pentru a face acest lucru, la pasul 5, în loc de „dreptunghiul cu colturi rotunjite" selectați instrumentul "elipsă", "poligon" sau " orice figură„. Apoi facem aceleași acțiuni pe care le-am făcut pentru a obține colțurile rotunjite.

Colturi rotunjite Fotografiile arată destul de interesante și atractive. Cel mai adesea, astfel de imagini sunt folosite atunci când se realizează colaje sau se creează prezentări. De asemenea, imaginile cu colțuri rotunjite pot fi folosite ca miniaturi pentru postările de pe site.

Există multe opțiuni de utilizare, dar există o singură modalitate (corectă) de a obține o astfel de fotografie. În acest tutorial vă voi arăta cum să rotunjiți colțurile în Photoshop.

Deschideți fotografia în Photoshop pe care urmează să o editați.

Apoi creați o copie a stratului cascadă numit "Fundal". Pentru a economisi timp, utilizați tastele rapide CTRL+J.

Se creează o copie pentru a lăsa imaginea originală intactă. Dacă (brut) ceva nu merge bine, puteți șterge straturile eșuate și puteți începe din nou.

În acest caz, ne interesează doar una dintre setări – raza de rotunjire. Valoarea acestui parametru depinde de dimensiunea imaginii și de nevoi.

Voi seta valoarea la 30 de pixeli, astfel încât rezultatul va fi mai vizibil.

Acum trebuie să întindeți figura rezultată pe întreaga pânză. Apelarea funcției « Transformare liberă» taste rapide CTRL+T. Pe formă va apărea un cadru, pe care îl puteți utiliza pentru a muta, roti și redimensiona obiectul.

Suntem interesați de scalare. Întindeți silueta utilizând markerii indicați în captură de ecran. După ce scalarea este completă, faceți clic INTRODUCE.

Sfat: pentru a scala cât mai precis posibil, adică fără a trece dincolo de pânză, trebuie să activați așa-numitul "Legare" Uită-te la captura de ecran, arată unde această funcție situat.

Funcția face ca obiectele să se „lipească” automat de elementele auxiliare și chenarele pânzei.

După cum puteți vedea, în jurul figurii s-a format o selecție. Acum mergeți la stratul de copiere și eliminați vizibilitatea stratului cu forma (vezi captura de ecran).

Stratul cascadă este acum activ și gata pentru editare. Editarea constă în eliminarea lucrurilor inutile din colțurile imaginii.

Inversarea selecției folosind taste rapide CTRL+SHIFT+I. Acum selecția rămâne doar pe colțuri.

Ultima actualizare:18/01/16

Cum să rotunjiți colțurile unei imagini în Photoshop

La proiectarea blogurilor, am făcut în mod repetat colțuri rotunjite pe imagini, dar ceea ce se face nu atât de des și nu suficient de automat se uită repede. Și m-am plâns din nou de necesitatea de a descrie imediat munca făcută. Prin urmare, acum, aproape fără întârziere, voi descrie succesiunea acțiunilor. Adevărat, din cauza bolii, „pimele fierbinți” nu mai erau fierbinți.

Pentru cei cărora le place să urmărească totul, un scurt videoclip despre „cum să rotunjesc colțurile în Photoshop”:

În primul rând, ai nevoie de Photoshop. De unde să-l obțineți, există două opțiuni:

  • cumpărați de pe site-ul oficial
  • găsiți pe torrente

Ce opțiune să alegi depinde de tine.

Deci, hai să lansăm Photoshop. Deschideți imaginea ale cărei colțuri trebuie rotunjite în Photoshop (Fișier → Deschidere). Dacă dimensiunea imaginii este mai mare decât aveți nevoie, puteți modifica dimensiunea (Imagine → Dimensiune imagine).

În dreapta, în imaginea de previzualizare, există un mic lacăt care blochează editarea imaginea originală(stratul de fundal). Pentru a crea un nou strat și a lucra cu el, faceți dublu clic pe el cu butonul stâng al mouse-ului, nu modificați nimic în fereastra care apare, faceți clic pe „Da”.

Dacă nu există blocare, atunci unul dintre cele două lucruri:

sau în versiunea dvs. de Photoshop stratul de fundal poate fi editat (ceea ce este îndoielnic, dar brusc)

sau cele de mai sus se pot face folosind o altă operațiune: de sus, în bara de meniu, selectați „Straturi”, în submeniul care se deschide, selectați „Nou” și urmați săgeata - „din fundal”, iar în aceeași fereastră care se deschide, faceți clic pe „Da”.

Selectați „Dreptunghi cu colțuri rotunjite” în instrumente.

Selectați modul din partea de sus a panoului de setări: „Contururi”. Setați raza la colțuri rotunjite în Photoshop. Eu am ales 40 de pixeli, îl poți alege pe cel care se potrivește cu imaginea ta.

Desenați un dreptunghi de dimensiunea dorită în imagine: plasați cursorul (acesta are forma unei cruci) în punctul dorit din stânga sus și, fără a elibera butonul mouse-ului, treceți în colțul opus până punctul dorit. Poza noastră are un dreptunghi transparent cu colțuri rotunjite.

Faceți clic dreapta pe dreptunghi. ÎN meniul contextual selectați „Creați zona selectată”, setați raza de pene la 1 pixel și faceți clic pe butonul „Da”.

Folosind meniul Selectare → Inversare, selectați totul în afara dreptunghiului rotunjit și ștergeți selecția cu tasta Ștergere.

Dacă nu ați suprapus un dreptunghi peste întreaga imagine, atunci excesul de fundal transparent poate fi îndepărtat folosind secvența de comenzi Imagine → Decupare → Pe baza pixelilor transparenți → Da.

Am primit o poză de la colturi rotunjite. Îl salvăm pentru Web: Fișier → Salvare pentru Web și dispozitive. Selectați Presetare: PNG-24, Transparență și faceți clic pe Salvare. Imaginea este salvată în format PNG-24 din fundal transparent, astfel încât să poată fi integrat în orice design de site web.

Același lucru se poate face cu instrumentul Elipse, atunci veți obține poza rotunda sau într-un cadru eliptic.

Așadar, astăzi am învățat cum să rotunjim colțurile oricărei imagini în Photoshop.

In aceea lecție scurtă Vă voi arăta cum puteți face colțuri rotunjite în Photoshop folosind metode simple mascare si filtre.

Puteți ajusta raza colțului pentru a rotunji marginea formei, textului etc. Aceasta este o metodă rapidă și ușoară care va crea colțuri rotunjite. Pentru a le crea puteți folosi o mască de strat.

Folosind o serie pași simpliîn Photoshop, puteți face un dreptunghi cu colțuri rotunjite. Photoshop nu are un filtru sau vreun instrument de făcut imediat colt rotunjit dar o poți face cu folosind Illustrator. Vă va permite să creați un efect de colț rotunjit pentru aproape fiecare obiect. În ea trebuie să mergeți la meniu Efecte > Stilizare > Colțuri rotunjite(Efecte > Stilizare > Colțuri rotunjite).

Pasul 1

In aceea lecție rapidă Vă voi arăta o metodă simplă care vă va permite să creați colțuri rotunjite în Photoshop folosind text rasterizat, o formă sau o imagine. Hai sa luam imagine vectorială stele cu unghiuri ascuțite (această metodă va funcționa bine și cu unghiuri drepte).

Pasul 2

Acum trebuie să rasterizați stratul. Pentru a face acest lucru, faceți clic Click dreapta mouse-ul peste miniatura stratului stea din paleta de straturi și selectați din meniul contextual Rasterizați stratul(Rasterizare strat). Ar trebui să faceți același lucru dacă utilizați un strat de text.

Pasul 3

Accesați meniu Filtru > Estompare(Filtru > Blur) și selectați estompare gaussiană(Neclaritate Gaussiană). Raza de estompare va depinde de dimensiunea imaginii și de rezultatul pe care doriți să-l obțineți. Voi alege o rază de 5 pixeli.

Pasul 4

Țineți apăsată tasta Ctrl și faceți clic pe miniatura stratului pentru a activa selecția imaginii. Apoi mergem la meniu Selecţieși alegeți Rafinați marginea(Selectați > Rafinați marginea). Puteți experimenta cu parametrii Antialiasing(Neted) și Umbrire(Pene) pentru a selecta efectul dorit. Contrast(Contrast) face 100.

Pasul 5

Luați culoarea formei, în cazul nostru este galbenși umpleți întreaga selecție cu această culoare. Puteți face acest lucru apăsând combinația de taste „Shift + F5”.

Pasul 6

Fără a elimina selecția, trebuie să adăugați o mască de strat făcând clic pe pictograma care se află în partea de jos a paletei de straturi. Atât, acum vedeta are colțuri rotunjite.

Puteți folosi aceeași metodă pentru a crea text cu colțuri rotunjite, așa cum se arată în imaginea de mai jos. Acum puteți veni cu propriul font.

Toată lumea s-a săturat de mult de colțurile dreptunghiulare tradiționale în designul site-urilor web. La modă sunt colțurile rotunjite, care sunt realizate nu folosind imagini, ci prin stiluri, pentru care se folosește proprietatea border-radius. Această proprietate poate avea una, două, trei sau patru valori separate printr-un spațiu, care determină raza tuturor colțurilor sau fiecare în parte.

În tabel 1 arată un număr diferit de valori și tipul de bloc care se obține în acest caz.

Cod Descriere Vedere
div ( chenar-rază: 10px; ) Raza de rotunjire pentru toate colțurile simultan.
div ( chenar-rază: 0 10px; ) Prima valoare stabilește raza colțurilor din stânga sus și din dreapta jos, a doua valoare setează raza din dreapta sus și din stânga jos.
div ( chenar-rază: 20px 10px 0; ) Prima valoare stabilește raza colțului din stânga sus, a doua - atât dreapta sus, cât și stânga jos, iar a treia valoare - dreapta jos.
div ( chenar-rază: 20px 10px 5px 0; ) Setează secvenţial raza colţurilor din stânga sus, din dreapta sus, din dreapta jos şi din stânga jos.

Exemplul 1 arată cum să creați un bloc cu colțuri rotunjite.

Exemplul 1. Colțurile unui bloc

HTML5 CSS3 IE 9+ Cr Op Sa Fx

Rază

Me este forma supletivă a cazului acuzativ al lui I.


Rezultat acest exemplu prezentată în fig. 1.

Orez. 1. Bloc cu colțuri rotunjite

Un efect interesant poate fi obținut dacă setați raza de rotunjire mai mare de jumătate din înălțimea și lățimea elementului. În acest caz, veți obține un cerc. Exemplul 2 arată cum să creați un buton rotund cu o imagine.

Exemplul 2: Buton rotund

HTML5 CSS3 IE 9+ Cr Op Sa Fx

Buton

Rezultatul acestui exemplu este prezentat în Fig. 2.

Orez. 2. Buton rotund

ÎN browser Opera rotunjire la