Jump to content

Steam Artwork Customizer by frozeNNN 2021


Recommended Posts

steamartworkprezentare.png

De cateva zile bune lucrez la poate cel mai frumos proiect pe care l-am facut.

Si mai exact un psd care face aproape automat un steam artwork , ceva unic pana acum pe planeta as putea zice😅

Cateva exemple :

 

Screenshot-37.png Screenshot-36.png Screenshot-38.png

Trebuie doar sa va jucati cu culorile si sa va faceti cel mai bun si unic Steam Artwork.

 

Foarte important !

Tutorialul este facut in PHOTOSHOP CC 2019. Este posibil ca in alte variante mai vechi sa nu mearga partea cu .gif-ul 

Daca intampinati probleme acolo , este din cauza Photoshop-ului.

 

Sa incepem si tutorialul.

 

In primul rand trebuie sa descarcati de aici psd-ul : Link download ! Parola : indungi.ro

Pachetul contine :

- 2 psd-uri , unu care contine cateva bg-uri animate si statice si unu care are doar un bg de demo. Nu am adaugat mai multe doarece deja incepea sa se incarce greu.

- 1 exemplu .gif

- 1 background size , care indica ce dimensiune trebuie sa fie background-ul.

- 2 save-uri pentru stanga si dreapta , care o sa va ajute sa salvati imaginiile ulterior.

 

Incepem prin a deschide unu din cele 2 psd-uri dupa preferinte.

 

In psd aveti urmatoarele: Screenshot-55.png

De sus in jos: Text-ul pe care daca vreti sa il modificati sau sa il scoateti. 

                       Frame stroke care reprezinta marginea frame-ului de mai jos si culoarea se schimba din Blending Option. Aici doar schimbati culoarea , nu modificati altceva

                       Frame reprezinta modelul de frame , inauntru daca dati Edit Contents veti gasi alte 10 frame-uri pe care le puteti schimba.

                       Background-ul tau , aici o sa gasiti mai multe modele de background-uri si unde va puteti pune propriu background.

 

Background-ul si Frame-ul se modifica doar cu Click dreapta>Edit Contents ! Nu altcumva. Si important dupa fiecare modificare apasati CTRL+S , altfel nu se va salva. 

 

In Frame doar se selecteaza si deselecteaza sa ramana doar 1 frame selectat. Nu suprapuneti frame-urile !

Screenshot-56.png

 

In Background la fel , selectati doar unu si deselectati restu. Pentru animatii durata minima si maxima este de 5 secunde. Nu adaugati video-uri sub 5 secunde. Daca adaugati peste 5 secunde , este ok.

Screenshot-57.png

 

Dupa ce sunteti multumiti de rezultat , salvam.

Pentru gif se salveaza cu Export>Save for Web. Aici e important sa fie la Loop option pe Forever

Pentru png se salveaza normal cu Save as.

 

Aici vine partea un pic mai grea. Ne trebuiesc 2 bucatii pentru Steam , o parte dreapta si una stanga.

 

Pentru GIF:

 

Deschidem savestanga.png

Dupa ce am deschis , intram neaparat la Window>Timeline daca nu e deja selectat.

Screenshot-46.png

Neaparat inainte de orice altceva. Altfel nu va merge animatia.

 

Deschidem fisierul .GIF salvat mai sus , ni-l va deschide intr-un tab nou.

Screenshot-39.png

IMPORTANT , TREBUIE APASAT BUTONUL DE MAI SUNT PENTRU A CONVERTI GIF-UL IN VIDEO.

Trebuie sa aveti asa :

 

Screenshot-58.png

 

Selectam toate frame-urile punand click pe Layer 1 si cu Shift apasat mergem sus la Layer 150 si il selectam. Acum ca avem toate frame-urile selectate facem grup. Poza mai jos.

Screenshot-41.pngScreenshot-42.png

Dupa ce avem grupul facult , apasam CTRL+C sa il avem copiat.

 

Mergem inapoi la tab-ul cu savestanga.png si dam CTRL+V acolo.

Normal ar trebuii sa ti-l pozitioneze perfect la partea asta , daca nu il mutati sa fie aliniat.

Screenshot-47.png

Verificam daca merge si daca totul e ok si salvam. 

Salveaza cu Export>Save for Web. Aici e important sa fie la Loop option pe Forever 

 

Repetam pasul si pentru savedreapta.png.

DAR IMPORTANT INAINTE SA SALVAM , TREBUIE SA MUTAM TOT GRUPUL IN STANGA.

Vezi pozele de mai jos.

Screenshot-50.pngScreenshot-51.png

Verificam colturile sa fie aliniate cu imaginea noastra. Si salvam.

Salveaza cu Export>Save for Web. Aici e important sa fie la Loop option pe Forever 

 

Pentru .PNG procesul este mult mai usor. 

Facem aceeasi pasi doar ca nu mai facem grupul si pur si simplu importam imaginea simpla.

 

Dupa toate astea ar trebuii sa avem 2 imagini (.gif sau .png). 

Pentru a putea pune de exemplu cum este profilul meu : https://steamcommunity.com/id/xfrozennnx

Trebuie facut urmatorul tutorial care nu este chiar asa de greu.

Urmati tutorialul asta https://steamcommunity.com/sharedfiles/filedetails/?id=748624905

 

La final ar trebuii sa aveti o imagine completa si sincronizata.

exemplu.gif

 

Sfaturi :

 

-Nu modificati , mutati , redimensionati sau orice altceva decat ce este in tutorial. Nu se va mai incadra in Steam si nu va merge.

-Pentru .GIF incercati sa folositi video-uri care nu au extrem de multe culori , se vor vedea foarte multi pixeli.

-Dimensiunea maxima admisa de Steam este de 8mb , daca imaginea depaseste marimea asta folositi https://ezgif.com/optimize si faceti-o sub 8mb.

 

Pe viitor daca este apreciat,folosit si va fi cerere. Voi face un update cu mai multe frame-uri , frame-uri animate si multe altele.

 

Se poate vedea pe profilul meu un frame animat la care lucrez. https://steamcommunity.com/id/xfrozennnx

Daca aveti nevoie de ajutor , postati aici , pm pe forum sau mesaj pe steam.

 

Tutorial creat si explicat de frozeNNN xD exclusiv pentru indungi.ro

 

 

 

 

 

 

 

  • Like 7
Link to post
Share on other sites
  • 1 month later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    No registered users viewing this page.

Despre noi

Suntem o comunitate aparuta in anul 2010 ce are ca scop sa prezinte si sa aduca in calculatoarele voastre socializare, competitie, public si foarte multa actiune. Alatura-te celor 200.000 de membri iar impreuna vom dezvolta cat mai mult termenul de 'comunitate'

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.