Mockup Blister Packaging în Photoshop

Designerii și clienții au adesea idei diferite despre modul în care trebuie prezentat un produs finit. Designerii doresc să arate lucrările de artă finite, clienții doresc să știe exact cum va arăta designul lor pe rafturi. În acest tutorial, vom demonstra cum să creați un mockup pentru un ambalaj blister, astfel încât să puteți prezenta design-ul dvs. clienților dumneavoastră. Să începem!


Tutorial Active

Următoarele bunuri au fost utilizate în timpul producerii acestui tutorial.

  • Modelul de puncte (exemplu)
  • Tutoriale Icon (exemplu)

Înainte de a începe

Pentru a face fișierul scalabil și ușor de editat, vom lucra întotdeauna cu straturi de formă, deci asigurați-vă că selectați opțiunea Shape Layer în fiecare formă pe care o facem, nu contează dacă este un cerc, un dreptunghi sau chiar Instrumentul Pen (P) îl are întotdeauna selectat din meniul de instrumente.


Configurarea documentelor

Începeți cu un document RGB cu o dimensiune a panzei de 600 x 600 px la 72dpi, Conținutul de fundal setat pe White și numiți fișierul ca Expoziție Blister Mock-up.


Pasul 1 - Configurarea fundalului.

Faceți dublu clic pe stratul de fundal din fereastra Straturi pentru al face editabil și setați numele ca "Fundal". Accesați Layer> Styles Layer> Blending Options și aplly a Gradient Overlay așa cum se arată.

Selectați instrumentul Ellipse (U) și trageți un cerc cu diametrul de 600 de pixeli. Denumiți noul strat ca "Backlight" și setați Fill la 0% în fereastra Layers. Accesați Layer> Styles Layer> Blending Options și aplly a Gradient Overlay așa cum se arată.

Selectați instrumentul Ellipse (U) și trageți un cerc cu diametrul de 600 de pixeli. Denumiți noul strat ca "Backlight", setați Fill to 0% și modul la Light Light în fereastra Layers. Accesați Layer> Styles Layer> Blending Options și aplly a Gradient Overlay așa cum se arată.

Apăsați Command / Ctrl + T și în fereastra Tool setați poziția Y la 0 px și aplicați modificările. Accesați Layer> Obiecte inteligente> Conversie la obiect inteligent.

Notă: Această acțiune va seta stratul de umplere a fundalului "Backlight" la 100%.


Pasul 2 - Desenarea plăcii de blistere.

Mergeți la Layer> New> Group și denumiți-o pe Display Board. Setați culoarea primului la alb (# 000000). Selectați Instrumentul rotunjit dreptunghi (U), setați Radiusul la 8 px și trageți un dreptunghi așa cum este arătat. Denumiți noul strat "Formă principală".

Selectați instrumentul Pen (P), selectați opțiunea Subtractare de la suprafața de formă din fereastra Instrument și desenați o formă așa cum este arătat.


Pasul 3 - Salvarea pentru viitor.

Trageți stratul "Formă principală" în pictograma "Nou strat" ​​de trei ori în fereastra "Straturi" și denumiți aceste trei noi straturi ca "Lumină principală", "Lumină de sus" și "Umbră".


Pasul 4

Selectați stratul "Umbre", setați modul la suprapunere cu o opacitate de 9%, umpleți la 0% și mergeți la Layer> Styles Layer> Blending Options și aplicați o suprapunere de gradient cu următoarele setări.


Pasul 5

Selectați stratul "Principal luminos", setați modul la suprapunere cu o opacitate de 75%, umpleți la 0% și mergeți la Layer> Styles Layer> Blending Options și aplicați Bevel and Emboss cu următoarele setări.

Încă în fereastra Bevel and Emboss, faceți clic pe miniatură Gloss contour și în Contour Editor setați maparea după cum urmează. Faceți clic pe OK.

Faceți clic pe fila Contur în fereastra Stratul stratului, setați intervalul la 55%, faceți clic pe miniatură Contur și în fereastra Editor contur setați maparea așa cum este prezentat. Faceți clic pe OK. Din nou, faceți clic pe OK în fereastra Strat de Strat pentru a aplica setările.


Pasul 6

Faceți clic pe stratul "Top Light", selectați Instrumentul de selecție directă (A) și apoi selectați instrumentul Rectangle (U); dați clic pe pictograma Extragere din figura de formă și desenați un dreptunghi așa cum este prezentat.

Selectați Instrumentul de selecție a traseului (A), faceți o selecție în jurul pânzei și faceți clic pe butonul Combine din fereastra de instrumente.


Pasul 7

Duplicați stratul "Backlight" trăgând stratul în pictograma New Layer din fereastra Layer și plasați-l deasupra stratului "Top Light". Acum, faceți clic și trageți miniatura Vector Mask layer "Top Light" pe stratul "Copie de fundal" și eliberați-o peste ea. Ștergeți stratul "Top Light" și redenumiți stratul "Backlight Copy" în "Top Light", setați opacitatea la 55% și Modul la Normal.


Pasul 8

Selectați stratul "Main Shape" și mergeți la Layer> Styles Layer> Blending Options. Faceți clic pe miniatură Pattern și din lista de miniaturi faceți clic pe săgeata din dreapta sus, selectați din meniul derulant Artist Surfaces și faceți clic pe Append.

Selectați piatra patrată (80 de 80 de pixeli, modul în nuanțe de gri) și aplicați o suprapunere modelată cu următoarele setări. Faceți clic pe OK.


Pasul 9

Selectați Instrumentul dreptunghi (U) și desenați un dreptunghi așa cum este arătat. Denumiți noul layer "Design" și plasați-l deasupra stratului "Main Shape".

Accesați Layer> Obiecte inteligente> Conversie la Obiect inteligent și apoi mergeți la Layer> Creare mască de tăiere.


Pasul 10 - Configurarea conținutului.

Accesați Layer> New> Group și denumiți-o Conținutul de afișare. Setați culoarea primului la alb (# 000000). Selectați Instrumentul rotunjit dreptunghi (U), setați Radiusul la 16 px și trageți un dreptunghi așa cum este arătat. Denumiți noul strat "Side".


Pasul 11

Glisați stratul "Side" pe pictograma New Layer din fereastra Layers de două ori și denumiți aceste două noi straturi ca "Top" și "Exterior".


Pasul 12

Selectați stratul "Side", setați Fill to 0% și mergeți la Layer> Styles Layer> Blending Options, selectați tab-ul Stroke și selectați Pattern din meniul vertical Fill Type. Faceți clic pe miniatură Pattern și din lista de miniaturi faceți clic pe săgeata din partea dreaptă sus, selectați din meniul drop-down Load Patterns, căutați fișierul model "Side_Dot" și faceți clic pe Încărcați.

Selectați modelul lateral și aplicați o cursă cu următoarele setări. Faceți clic pe OK.


Pasul 13

Selectați stratul "Top", setați Fill to 0% și mergeți la Layer> Styles Layer> Blending Options, selectați fila Stroke și aplicați următoarele setări. Faceți clic pe OK.


Pasul 14

Selectați stratul "Outer", setați Fill to 0% și mergeți la Layer> Styles Layer> Blending Options și aplicați Bevel and Emboss cu următoarele setări.

Încă în fereastra Bevel and Emboss, faceți clic pe miniatură Gloss contour și în Contour Editor setați maparea după cum urmează. Faceți clic pe OK.

Faceți clic pe fila Contur în fereastra Stratul stratului, setați intervalul la 55%, faceți clic pe miniatură Contur și în fereastra Editor contur setați maparea așa cum este prezentat. Faceți clic pe OK. Din nou, faceți clic pe OK în fereastra Strat de Strat pentru a aplica setările.


Pasul 15

Setați culoarea primului rând în roșu (# ff0000). Selectați Instrumentul rotunjit dreptunghi (U), setați Radiusul la 6 px și desenați un dreptunghi așa cum este arătat. Denumiți noul layer "Container" și plasați-l sub stratul "Exterior".


Pasul 16

Glisați stratul "Container" în pictograma New Layer din fereastra Layers și denumiți noul strat ca "Soft Shadow". Setați opacitatea la 41% în fereastra Straturi și faceți dublu clic pe miniatură roșie a stratului "Soft Shadow"; alegeți o culoare neagră (# 000000) și faceți clic pe OK.

Selectați Instrumentul de selecție a traseului (A) și trageți o selecție în jurul întregului strat "Soft Shadow". Accesați Edit> Copy și mergeți la Edit> Paste. Cu ajutorul tastei săgeată, deplasați selecția lipită cu 3 px apăsând de trei ori pe săgeata sus; selectați opțiunea Subtract From From Shape Area din fereastra Tool și faceți clic pe butonul Combine.


Pasul 17

Setați culoarea prim-planului în alb (#ffffff). Selectați Instrumentul dreptunghi (U) și desenați un dreptunghi așa cum este arătat. Denumiți noul layer "Conținut" și plasați-l deasupra stratului "Container".

Accesați Layer> Obiecte inteligente> Conversie la obiect inteligent. Accesați Layer> Creare mască de tăiere.


Pasul 18

Selectați stratul "Container", mergeți la Layer> Style Layer> Blending Options și aplicați o Shadow Drop cu următoarele setări.


Pasul 19

Selectați Instrumentul rotunjit dreptunghi (U), setați un Radius de 16 px și desenați un dreptunghi așa cum este arătat. Denumiți stratul nou "Inner" și plasați-l deasupra stratului "Exterior".

Trageți stratul "Inner" la pictograma New Layer din fereastra Layers și denumiți noul strat ca "Container de lumină".


Pasul 20

Selectați stratul "Inner" și setați Fill la 0%. Accesați Layer> Styles Layer> Blending Options și aplige a Bevel and Emboss cu următoarele setări.

Faceți clic pe fila Contur și în săgeata de lângă miniatură Contur; din lista de miniaturi, faceți clic pe săgeata din partea dreaptă sus, selectați din meniul derulant Contururi și faceți clic pe fila AppendContour din fereastra Style, setați intervalul la 100%, faceți clic pe săgeata cu miniaturi de contur și selectați din lista contururilor miniatură selectați conturul semi-rotunjit. Faceți clic pe OK. Din nou, faceți clic pe OK în fereastra Strat de Strat pentru a aplica setările.

Selectați conturul Half Rounded din lista verticală și setați intervalul la 100%. Faceți clic pe OK. Din nou, faceți clic pe OK în fereastra Strat de Strat pentru a aplica setările.


Pasul 21

Faceți clic pe stratul "Luminos container", selectați Instrumentul de selecție directă (A) și trageți toate punctele de ancorare dreapta 150 px spre stânga. Faceți acest lucru ținând apăsat Shift + apăsând de 15 ori săgeata stânga de pe tastatură.


Pasul 22

Trageți de trei ori stratul "Backlight" în pictograma New Layer din fereastra Layers și denumiți aceste straturi noi ca "Lumină frontală", "Shadow de conținut" și "Conținut lumină".

Plasați stratul "Luminozitate frontală", "Conținut Shadow" și "Conținut lumină" deasupra stratului "Container de lumină" din grupul de nivel "Conținut afișaj".


Pasul 23

Selectați stratul "Luminozitate frontală", mergeți la Edit> Free Transform și aplicați următoarele setări.

Selectați stratul "Container light", trageți miniatura Vector Mask în stratul "Front Light" și eliberați-l pe acesta. Ștergeți stratul "Container de lumină".

Setați stratul "Lumină față" pe Normal și modificați opacitatea la 45%.


Pasul 24

Selectați stratul "Content Shadow", mergeți la Layer> Styles Layer> Blending Options și aplicați o suprapunere de culoare cu Modul de amestecare setat la Normal și Opacitate de 100% și o culoare neagră (# 000000). Faceți clic pe OK. Setați modul de strat la Normal și modificați opacitatea la 18%.


Pasul 25

Setați culoarea primului rând în roșu (# ff0000) și selectați Instrumentul dreptunghi (U), apoi desenați un dreptunghi așa cum se arată. Denumiți noul strat ca "Container Shadow".

Trageți stratul "Shadow Container" la pictograma New Layer din fereastra Layers și denumiți noul strat ca "Container de lumină". Mergeți la Edit> Free Transform și setați valoarea Y la 192 px și aplicați modificările.


Pasul 26

Selectați stratul "Conținutul luminii", mergeți la Edit> Transformare liberă și setați următoarele valori. Aplicați modificările.

Acum, selectați layerul "Content Shadow", mergeți la Edit> Free Transform și setați următoarele valori. Aplicați modificările.


Pasul 27

Trageți miniatura Vector Mască "Conteiner de lumină" în stratul "Conținut de lumină" și eliberați-o peste ea. Ștergeți stratul "Container de lumină".

Glisați miniatura de strat Vector Vector Mască "Shadow Container" la layerul "Content Shadow" și eliberați-o peste ea. Ștergeți layer-ul "Shadow Container".


Pasul 28

Trageți și plasați stratul "Backlight" în pictograma New Layer din fereastra Layers și denumiți noul strat ca "Fantasy Shadow", setați modul la Normal.

Mergeți la Edit> Free Transform și aplicați următoarele valori.

Accesați Layer> Stil Layer> Blending Options și aplicați o suprapunere de culoare așa cum este prezentat.


Pasul 29

Selectați instrumentul Rectangle (U) și desenați un dreptunghi așa cum este arătat. Denumiți noul strat ca "Container de Fantasy".

Glisați miniatura stratului "Fantasy Container" pentru stratul "Vector Fantasy Mask" spre stratul "Fantasy Shadow" și eliberați-l peste acesta. Ștergeți layer-ul "Fantasy Container".


Pasul 30 - Punerea unui design pe ea.

În cadrul grupului "Display Board", selectați layerul "Design" și faceți dublu clic pe miniatură obiect inteligent. În noua fereastră de document selectați stratul "Design" și mergeți la Layer> Style Layer> Blending Options și aplicați o suprapunere de gradient cu următoarele setări.

Selectați instrumentul tip orizontal (T) și scrieți "tutoriale". Ia niște icoane frumoase și pune-le în design. Salvați fișierul și închideți-l.

Notă: Am folosit textul de tip Lubalin și pictograma site-ului tutoriale, dar puteți folosi orice tip de text care vă place și orice imagine, nu trebuie să fie neapărat o pictogramă.


Pasul 31

În grupul "Conținutul în Rețeaua de display", selectați stratul "Conținut" și faceți dublu clic pe miniatură obiect inteligent. În noua fereastră de document lipiți o captură de ecran (sau orice design care vă place) de pe piața de tutoriale. Dacă este necesar, ajustați captura de ecran la dimensiunea panzei, faceți acest lucru accesând Edit> Free Transfom. Salvați documentul și închideți-l.


Imagine finală