Què és l'extracció d'actius
El nou Extracte d'actius La característica de Photoshop CC 2014 corregeix un postcombustible en el flux de treball d'altra manera tediós de la creació d'imatges per a Disseny Web Responsive (RWD). Anem a veure com la comanda Extract Assets pot reduir ràpidament un comp de la pàgina web als actius preparats per al muntatge en un parell de minuts.
Comencem amb una pregunta òbvia: Què és Extracte d'Actius?
En termes senzills, Extract Assets és una característica nova del Photoshop que proporciona la funció Generador de Photoshop amb una interfície per ajudar a automatitzar la creació d'actius d'imatges per al disseny web i la pantalla dels seus arxius de Photoshop. La comanda Extract Assets us permet definir quina capa o capes voleu crear els actius, la mida físic, el format del fitxer i la ubicació desada al disc. Aquesta característica no està pensada per a text, tret que la intenció és convertir el text en un mapa de bits, que en realitat no és una bona idea.
Anem a començar.
02 de 08Obre un fitxer .psd de Photoshop
L'exemple que utilitzo conté un objecte intel·ligent Illustrator, un text, una unitat heroïna que conté text, una imatge i un botó i una sèrie d'imatges a l'aire lliure que reforcen el tema del lloc. La clau aquí és organitzar les capes en grups. Això és necessari perquè la tasca consisteix a treure tots aquests elements fora de la compilació per tal que es puguin afegir ràpidament als dissenys web que s'adapten a diferents resolucions i mides de la pantalla.
Dues maneres d'extreure els actius
A diferència de Generar, que també extreu objectes mitjançant l'addició d'una extensió gràfica al nom de la capa, Extracte d'actius utilitza una interfície a la qual es pot accedir feu clic amb el botó dret una capa o seleccionant una capa i triantFitxer> Extracte d'actius.
04 de 08La interfície d'extracció d'actius
El quadre de diàleg Extract Assets és bastant intuïtiu. Us mostrem la capa o la selecció que voleu extreure. A sobre, es mostra la mida dels fitxers i, a sota, hi ha un control que us permet ampliar i allunyar l'objecte. El costat dret del quadre de diàleg és on passa la màgia. Els quatre botons de la part superior us permeten seleccionar la resolució / mida de l'objecte. La propera banda us mostra la capa seleccionada i feu clic al botó + El signe us permet mostrar la capa seleccionada en un altre format. El Paperera Ca n elimina la capa de la cua. A la propera tira cap avall, podeu triar el tipus de fitxer i podeu ajustar l'amplada i l'alçada de la imatge de sortida.
05 de 08Extracció d'una imatge SVG
Photoshop no controla les imatges de tot, els navegadors i els dispositius no poden mostrar una imatge d'Illustrator. Això ha donat lloc a l'augment dels fitxers svg que s'utilitzen per a obres d'art vectorial com el logotip d'Illustrator que es mostra aquí. Sent vectors la seva resolució és independent del dispositiu i es pot escalar amb cap pèrdua de detalls o d'imatge. Per convertir l'Illustrator Smart Object a svg, seleccioneu svg des del pop down i feu clic Extreure.
06 de 08El procés d'extracció d'actius
Hi haurà un parell de coses quan feu clic al botó Extracció. En primer lloc, se us avisarà que el nom del fitxer pot canviar. Això no és gran problema. A continuació, se us informarà que s'està creant una nova carpeta per mantenir l'actiu. Un cop finalitzat el procés, la carpeta, situada a la mateixa ubicació que el fitxer original .psd, s'obre i mostra el nou actiu.
07 de 08El botó Configuració és el vostre nou millor amic
En fer clic al Configuració s'obre el botó a Quadre de diàleg de configuració això és molt útil. Els paràmetres de l'esquerra són els factors d'escala. El que fan és crear les diverses còpies de la imatge que un desenvolupador utilitzarà a les consultes de mitjans per orientar-se a la resolució de pantalla d'un dispositiu específic. Per exemple, la versió 3x s'orientaria a una pantalla de Retina iPhone o iPad, mentre que un factor de 1,25 seria apuntat a un dispositiu Android. El sufix s'afegeix al final del nom del fitxer per permetre al desenvolupador identificar fàcilment la imatge que s'utilitzarà en una consulta multimèdia. Un cop hagueu acabat, feu clic a la icona D'acord i les vostres seleccions s'encendran a l'àrea Extreure els actius del quadre de diàleg. També podeu accedir a la configuració fent clic a la icona d'engranatge de l'àrea Extreure els actius a la part dreta de la interfície
08 de 08Acabant
Quan feu clic al botó Extracció, tots els elements es crearan i s'afegiran a la carpeta. En aquest moment, tot el que heu de fer és enviar al vostre desenvolupador una còpia de la carpeta i passar al vostre pròxim projecte.