Ekstrakt Photoshopa: proizvodnja mobilne grafike ide na naknadni

01 od 08

Šta je ekstraktna imovina

Napravite komp u Photoshopu.

Nova funkcija ekstraktne imovine Photoshop CC 2014 obrađuje naknadni rad na izuzetno potresnom toku posla za stvaranje slika za Responsive Web Design (RWD). Hajde da pogledamo kako komanda Extract Assets može brzo smanjiti web stranicu koja je spremna za montažu u roku od nekoliko minuta.

Počnimo sa očiglednim pitanjem: Šta je ekstraktna imovina?

Jednostavno rečeno, Extract Assets je nova funkcija u Photoshopu koja pruža Photoshopovu Generator funkciju pomoću interfejsa za automatizaciju stvaranja imidžing sredstava za web i dizajn ekrana iz vaših Photoshop datoteka. Komanda Extract Assets vam omogućava da definišete koji sloj ili slojeve želite da kreirate sredstva, njihovu fizičku veličinu, format datoteke i spremljenu lokaciju na disku. Ova funkcija nije namenjena za tekst osim ako namera nije pretvoriti tekst u bitnu sliku, što zaista nije dobra ideja.

Hajde da počnemo.

02 od 08

Otvorite Photoshop .psd datoteku

Počećemo sa kompjuterskom strankom pripremljenom u Photoshopu.

Primjer koji koristim sadrži Smart objekat iz Illustrator-a, neki tekst, herojska jedinica koja sadrži tekst, sliku i dugme i seriju spoljašnjih slika koje pojačavaju temu sajta. Ključ je organizovanje slojeva u grupe. Ovo je neophodno zato što je zadatak da izvučete sve ove stavke van kompata, tako da se mogu brzo dodati u web rasporede koji se prilagođavaju različitim rezolucijama i veličinama ekrana.

03 od 08

Dva načina za ekstrakciju imovine

Ekstraktna sredstva se mogu naći u File meniju ili desnim tasterom miša na sloj.

Za razliku od Generate, koji takođe izdvaja objekte dodavanjem grafičkog proširenja na ime sloja, Extract Assets koristi interfejs do kojeg se može doći tako što klikne desnim tasterom miša na sloj ili izborom sloja i odaberete File> Extract Assets .

04 od 08

Interfejs ekstraktnih sredstava

Dijaloški okvir ekstrakta.

Dijaloški okvir Extract Assets je prilično intuitivan. Prikazan vam je sloj ili izbor koji će biti izvučen. Iznad njega se prikazuje veličina datoteke i ispod nje je kontrola koja vam omogućava da zumirate i izlazite na objektu. Na desnoj strani dijaloga se nalazi magija. Četiri tastera na vrhu omogućavaju vam da odaberete rezoluciju / veličinu objekta. Sledeća traka pokazuje izabrani sloj i klikom na znak + omogućava vam da izlazite izabrani sloj iu drugom formatu. Trash Ca n uklanja sloj iz reda. U sledećoj traci dole možete odabrati tip datoteke i možete podesiti širinu i visinu izlazne slike.

05 od 08

Izvlačenje SVG slike

Izvlačenje svg slike.

Photoshop ne savršeno slanja slika svg, a pretraživači i uređaji ne mogu prikazati Illustrator sliku. Ovo je rezultiralo porastom SVG datoteka koje se koriste za vektorske umetničke radove, kao što je logotip Illustrator prikazan ovde. Budući da su vektori njihova rezolucija je nezavisno od uređaja, mogu se skalirati bez gubitka detalja ili slike. Da biste pretvorili Illustrator Smart Object u svg, izaberite svg iz pop up i kliknite Extract .

06 od 08

Proces ekstrahiranja imovine

Slike se smeštaju u fasciklu na istom mestu kao i .psd slika.

Nekoliko stvari će se desiti kada kliknete na dugme Extract. Prvo ćete biti upozoreni da se ime datoteke može promeniti. Ovo nije veliko pitanje. Zatim će vam se reći da se kreira novi folder za držanje imovine. Kada se proces završi, folder koji se nalazi na istoj lokaciji kao originalna .psd datoteka otvara se i prikazuje vam novu imovinu.

07 od 08

Dugme za podešavanja je vaš novi najbolji prijatelj

Rezolucija uređaja.

Klikom na dugme Podešavanja otvara se dijalog Postavke koji je ozbiljno koristan. Postavke sa leve strane su faktori skaliranja. Ono što rade je stvoriti različite kopije slike koje će programer koristiti u medijskim upitima kako bi ciljao rezoluciju ekrana određenog uređaja. Na primer, verzija 3x bi bila usmerena na iPhone ili iPad Retina displej, dok će 1.25 faktor biti uperen na Android uređaj. Sufiks se dodaje na kraj imena datoteke kako bi se vašem programeru omogućilo da lako identifikuje sliku koja će se koristiti u medijskom upitu. Kada završite, kliknite na dugme U redu i vaši izbori će se upaliti u oblasti ekstraktnih sredstava u dijalogu. Takođe možete pristupiti postavkama tako što ćete kliknuti na ikonu zupčanika u oblasti Extract Assets preko desne strane interfejsa

08 od 08

Završetak gore

Višestruke slike sa različitim formatima i rezolucijama su izvučene.

Kada kliknete na dugme Extract, sva sredstva će biti kreirana i dodata u fasciklu. U ovom trenutku sve što treba da uradite je da pošaljete vašeg programera kopiju fascikle i pređete na sledeći projekat.