Filtrul de offset este o unealtă excelentă de folosit pentru a crea un model repetat pentru fundalul unui site. Din nefericire, pentru noi, filtrul offset funcționează doar pentru o imagine plat, un strat și nu funcționează în toate situațiile. În tutorialul de astăzi vom demonstra cum să creați un model repetat folosind obiecte inteligente și tehnica de nudging cu tastele săgeți.
Următoarele resurse au fost utilizate în timpul producerii acestui tutorial:
Înainte de a începe, să începem cu câteva principii de bază ale designului de model.
Orice lucru care se află în centru se va repeta cu ușurință. Nu trebuie să faceți nimic cu acest lucru (1).
Obiectele plasate pe margine vor fi tăiate (2a). Trebuie să o adăugați în partea opusă (2b).
Obiectele plasate pe colț vor fi tăiate (3a). Va trebui să îl adăugați în fiecare colț (3b).
Descărcați ornamentele florale și deschideți-o în Illustrator. Selectați unul dintre obiecte și apăsați Cmd + C pentru a copia.
Creați un fișier nou. Vom crea un model de 256 x 240 px.
Creați un nou strat. Completați-o cu orice culoare, dați clic dreapta și alegeți Conversie la Obiect inteligent. Acest obiect inteligent va deveni modelul nostru.
Faceți clic pe Imagine> Dimensiunea canvasului. Activați funcția Relativă și setați lățimea și înălțimea la 200%. Acest lucru va mări dimensiunea pânzei la 3 ori mai mare decât modelul nostru va fi.
Duplicați modelul obiect inteligent apăsând Cmd + J, apoi umpleți panza cu modelul. În acest moment, veți avea 9 obiecte inteligente pe pânză. Aceste 9 obiecte inteligente au fost create de la același părinte, editarea acestora va schimba celelalte 8. Aceasta înseamnă că vom putea vedea modificările pe care le facem pentru a schimba modelul nostru în timp real.
Faceți dublu clic pe unul din straturile miniatură ale obiectelor inteligente pentru a edita conținutul. Dacă găsiți această casetă de dialog, faceți clic pe OK. Obiectul inteligent va fi deschis ca fișier nou într-o filă nouă. Acesta este fișierul pe care îl vom pune obiectele pentru modelul nostru.
Faceți clic pe Fereastră> Aranjare> Float All în Windows pentru a vedea ambele fișiere în același timp.
În fișierul de model, lipiți (Cmd + V) forma vectorului din Illustrator. Plasați-l în mijlocul imaginii. Salvați fișierul model (Cmd + S) și automat fișierul mare va fi actualizat. Deoarece obiectul este în mijloc, modelul arată bine (Principii # 1).
Reveniți la Illustrator, copiați o altă formă. În Photoshop, lipiți obiectul și puneți-l pe marginea din stânga. Salvați fișierul și puteți vedea în fișierul mare o parte din obiect lipsește.
Strat duplicat (Cmd + J). Trebuie să punem acest lucru pe partea opusă, drept (Principii 2). Amintiți-vă că lățimea modelului este de 256 px. Îndreptați acest strat cu 256 de grade spre dreapta. De fiecare dată când apăsați tasta săgeată, faceți un obiect cu 1 px. Dacă apăsați Shift + Arrow veți urca 10 px. Deci, apăsați Shift + Săgeată dreapta de 25 ori, apoi Săgeată dreapta de 6 ori. Apăsați Cmd + S pentru a salva modelul și pentru a vedea cum se modifică modelul.
Luați altă formă de la Illustrator. De data aceasta a pus-o pe marginea de sus. Salvați fișierul și veți vedea că partea inferioară a modelului lipsește.
Încă mai folosim Principiul # 2. Strat duplicat (Cmd + J). Împingeți-l cu 240 de picioare în jos, adică apăsați tasta săgeată de 24 de ori. Salvați fișierul și vedeți modelul care funcționează.
Luați altă formă de la Illustrator. Puneți-l în colțul din dreapta jos. Salvați fișierul și veți vedea că în unele zone lipsește piesa.
Pentru obiectul în colț, trebuie să punem perechea în fiecare colț (Principiul # 3). Duplicați stratul și împingeți-l cu 240 de culori în sus. Salvați fișierul pentru a vedea rezultatul.
Duplicați stratul și lăsați-l să rămână 256 px. Salvați fișierul pentru a vedea rezultatul.
Acum, ultima piesă. Duplicați stratul și împingeți-l cu 240 de grade în jos. Salvați pentru a vedea rezultatul.
Umpleți spațiul gol cu forme mai mici din Illustrator fără a atinge marginea. Salvați pentru a vedea rezultatul.
Ștergeți stratul de fundal pentru a face acest model transparent.
Faceți clic pe File> Save for Web & Devices. Alegeți presetare: PNG-24. Activați transparența.
Deschideți fișierul PNG pe care tocmai l-am creat. Dați clic pe Editați> Definiți modelul.
Creați un fișier nou.
Adăugați un gradient radial de la alb la negru în fundal.
Creați un nou strat. Faceți clic pe Editați> Completați. Alegeți Utilizare: model și selectați modelul pe care tocmai l-am creat.
Adăugați nuanța ajustării stratului / saturației. Activați Culoare și mutați glisoarele pentru a adăuga un pic de culoare.
Asta e! Au fost efectuate. Puteți vedea imaginea finală de mai jos. Sper că v-ați bucurat de acest tutorial și ați învățat ceva nou. Încercați să utilizați această tehnică cu alte forme sau linii. Te vei uimi cu rezultatul.