Desenează forme personalizate

Formele au parcurs un drum lung în Photoshop și știind cum să le folosiți în aplicația dvs. poate însemna diferența dintre succes și eșec. Formele pot aduce adâncimea, echilibrul și unitatea aplicațiilor dvs. Acest tutorial vă va prezenta instrumentul de formă Photoshop și vă va învăța să desenați forme personalizate de bază. În acest proces, veți fi pregătit pentru următorul tutorial din această serie: crearea butoanelor.

Înainte de a începe, permiteți-mi să vă arăt ce înțeleg atunci când vorbesc despre relația dintre forme, profunzime, echilibru și unitate.

Să folosim, de exemplu, interfața implicită pentru telefoanele iPhone și Android. Butoanele, pictogramele sau comenzile rapide de pe ambele telefoane apar ca și cum acestea ar fi situate doar pe partea de sus a fundalului, care este profunzimea. În cazul în care telefoanele încep să difere, cu toate acestea, este în ceea ce privește echilibrul și unitatea.


Icoane iPhone

Apple se mândrește cu designul (la fel și ar trebui) și, în timp ce ambele telefoane fixează icoanele în loc, iPhone păstrează pictogramele împreună într-o anumită ordine. Telefoanele Android pot avea câteva pictograme în partea de sus și câteva pictograme de pe partea inferioară, ceea ce poate duce la șocul masiv al balansului ecranului. Schimbă funcționalitatea? Nu. Este utilizabil? Este obișnuit, așa că dacă funcționează pentru tine, atunci da. Arata cel mai bine? Nu. Nu arata cel mai bine pentru ca nu este echilibrat.


Android Icons

Același lucru se poate spune și pentru unitate. IPhone are o dimensiune și o formă standard pentru pictograme. Conținutul în mărimea și forma poate și nu variază. Android are doar o dimensiune standard, dar nu are o formă standard. Prin restrângerea tuturor pictogramelor la aceeași dimensiune și mai ales la aceeași formă, Apple creează o unitate perfectă. Nimic nu are loc. Dar acest lucru nu este și dezbaterea Apple versus Android, și în timp ce eu sunt un utilizator Mac, am ales să folosesc un telefon Android pe iPhone, așa că nu sunt părtinitoare acolo.


Acum hai să mergem mai departe cu învățarea despre instrumentul de formă Photoshop:

  1. Deschideți Photoshop și creați un document nou.
  2. Voi folosi următoarele setări presetate doar pentru a vă menține simplu.
  3. Selectați Shape Tool (U) din bara de instrumente.
    Faceți clic pentru a extinde opțiunile de formă. Puteți, de asemenea, să vă uitați la bara de opțiuni pentru a vedea diferitele forme disponibile.
  4. Există mai multe opțiuni în bara de opțiuni decât ceea ce vom acoperi, așa că ne vom concentra doar pe cele șase opțiuni reale pe care le avem. Vom primi mai mult în instrumentul stilou într-un tutorial viitoare.

  5. Pentru a desena o formă, selectați forma de care aveți nevoie din bara de opțiuni, am ales un cerc.
  6. Faceți clic și trageți pe panza pentru a crea forma.
  7. Observați cum nu am ales încă culoarea dorită. Nu vă frecați, putem schimba culoarea destul de ușor după ce forma este trasată. În paleta de straturi, căutați noul strat denumit "Shape-1".

  8. Faceți dublu clic pe modelul colorat al stratului Shape-1 din paleta de straturi pentru a deschide selectorul de culori.
  9. Alegeți o culoare și faceți clic pe OK.

Așa că a fost punctul de 30.000 de picioare pentru a crea o formă. În acest exemplu, am folosit doar forma ovală, dar există și mult mai mult cu alte forme.


Iată câteva mici sfaturi interioare care ar face ca lucrul cu formele să fie puțin mai eficient și mai ușor.

  1. Formați opțiunile
  2. Spațiu bar
  3. Cheia Alt
  4. Tasta Shift (fără forma existentă)
  5. Shift (cu forma existentă)
  6. Alt (cu forma existentă)
  7. T Ctrl +

Opțiunile formei

În mod implicit, fără a schimba presetările, Photoshop vă va oferi forme care arată ca acestea. Instrumentul pentru forme personalizate are, de asemenea, un întreg subset de forme din lista derulantă, oferindu-vă mai multă libertate creativă.

Fiecare formă, personalizată sau nu, are setări care vă permit să personalizați aceste forme și să vă ușurați viața în acest proces.

Opțiunea "Unconstrained" vă permite să creați o formă exactă a dimensiunii dorite fără a păstra proporția de forme (aceasta este cea implicită). Pentru formele dreptunghiulare, opțiunea "Square" vă permite să creați un pătrat perfect. De asemenea, puteți seta și o dimensiune și o proporție fixe. Dacă știți exact dimensiunea dorită, specificați-o aici și vă va ușura viața! Apoi sunt câteva casete de verificare. Caseta "De la centru" desenează forma în jurul originii mouse-ului în loc de direcția în care merge mouse-ul și opțiunea "Snap to Pixels" face doar că.


Sincer, nu folosiți aceste două opțiuni o mulțime, deoarece îmi place să folosesc mai repede comenzile rapide explicate mai jos. E doar mai repede!

Space Bar

Asta e unul dintre preferatele mele. Ținând jos bara de spațiu atunci când desenați o formă vă permite să repoziționați forma în timp ce desenați. Nu contează dacă o țineți înainte sau după ce faceți clic pentru a începe desenarea formei.

NOTĂ: Dacă ați lansat deja mouse-ul, este prea târziu. Trebuie să o mutați manual.

Faceți clic pentru a începe desenul, mențineți bara spațială în jos și apoi începeți să mutați mouse-ul. Forma trebuie să se miște cu tine. Acest lucru vă ajută să obțineți totul aliniat doar chiar după ce ați început să desenați forma.

SHIFT (fără forma existentă)

Înainte de a desena orice formă în cadrul stratului, puteți ține apăsată tasta SHIFT pentru a păstra totul perfect. Cercuri perfecte, pătrate perfecte, linii drepte perfecte și chiar și linii de 45 de grade înclinate. Acest lucru este foarte asemănător cu ceea ce am văzut cu instrumentul Marquee cu câteva săptămâni în urmă. Ținând în jos SHIFT, va păstra totul proporțional și poate înlocui selectarea butonului Radio în opțiunile de formă.

SHIFT (cu forma existentă)

După ce aveți deja o formă pe pânză, tasta SHIFT funcționează puțin diferit. Dacă aveți deja o formă pe pânză și selectată și în paleta de straturi, ținând apăsată tasta SHIFT vă va permite să adăugați dinamic forma existentă.

Țineți SHIFT în jos și veți vedea un simbol plus (+) lângă cursor. Adăugați la formă prin tragerea unei noi forme pe forma existentă. Observați în ecranul pe care l-am tăiat de la capătul dreptunghiului nostru rotunjit. Aș fi putut face acest lucru în câteva moduri diferite, dar asta ar presupune adăugarea multor pași mai mulți.

Ce vom face cu ceva de genul asta? Creați mai multe forme folosind instrumentul dreptunghi și terminați ultima dintr-un mod similar celui pe care l-ați făcut primul pentru a crea un set mic de butoane simple de navigare:

ALT (cu forma existentă)

Dacă țineți apăsată tasta ALT cu o formă existentă, veți elimina o porțiune. Cu o formă existentă pe pânză și selectată, țineți apăsată tasta ALT și va apărea un simbol minus (-) de lângă cursor. Aceasta indică faptul că sunteți pe cale să eliminați o parte a formei. În captura de ecran am luat forma personalizată a plicului și am scos acea secțiune a dreptunghiului. Acum trebuie doar să adăugăm un text și avem un buton de e-mail foarte simplu pentru aplicația noastră!

CTRL + T

Acesta este cel mai rapid și mai eficient mod de a redimensiona o formă existentă. Asigurați-vă că aveți forma selectată în paleta de straturi și utilizați comanda rapidă de la tastatură de la CTRL + T. Ar trebui să vedeți mânere pe forma care vă va permite să redimensionați după cum este necesar. Rapid și ușor, acest lucru funcționează pentru toate straturile, nu doar cu forme. Eu folosesc o tonă!


Învățați cum să utilizați instrumentul de formă este doar începutul. Trucul real este de a învăța cum să aplicați forme de bază în moduri unice și interesante. Puteți utiliza cu siguranță aceste forme pentru mai mult decât butoanele!

Pentru a vă crea creativitatea, iată câteva exemple unice și creative ale instrumentului de formă în acțiune!

Ceasuri

Dia Carta

dropbox

Domino Box

Cod