01 de 08
Que é Extract Assets
A nova característica Extract Assets de Photoshop CC 2014 tira un postcombustión no fluxo de traballo doutro xeito tedioso de creación de imaxes para Deseño Web Responsive (RWD). Vexamos a forma en que o comando Extract Assets pode reducir rapidamente un comp da páxina web aos activos listos para a montaxe nun par de minutos.
Empecemos por unha pregunta obvia: ¿Que é Extract Assets?
En términos simples, Extract Assets é unha característica nova en Photoshop que proporciona a característica de Photoshop's Generator cunha interface para axudar a automatizar a creación de activos de imaxe para o deseño web e pantalla dos seus arquivos de Photoshop. O comando Extract Assets permítelle definir a capa ou capas que desexa crear para o seu tamaño físico, formato de ficheiro e localización gardada no disco. Esta función non está destinada a textos a menos que a intención sexa converter o texto nun mapa de bits, o que realmente non é unha boa idea.
Comezamos.
02 de 08
Abre un ficheiro .psd de Photoshop
O exemplo que estou usando contén un obxecto intelixente de Illustrator, un texto, unha unidade de heroe que contén texto, unha imaxe e un botón e unha serie de imaxes ao aire libre que reforzan o tema do sitio. A clave aquí é organizar as capas en grupos. Isto é necesario porque a tarefa é tirar todos estes elementos fóra da compilación para que se poidan engadir rapidamente aos esquemas web que se adaptan a distintas resolucións e tamaños de pantalla.
03 de 08
Dúas formas de extraer activos
A diferenza de Xerar, que tamén extrae obxectos mediante a adición dunha extensión gráfica ao nome da capa, Extract Assets usa unha interface que se pode acceder premendo co botón dereito do rato nunha capa ou seleccionando unha capa e escollendo Ficheiro> Extract Assets .
04 de 08
A Extract Assets Interface
O cadro de diálogo Extract Assets é bastante intuitivo. Amosáraselle a extracción da capa ou da selección. Por riba del móstrase o tamaño dos ficheiros e debaixo está o control que permite achegar e ampliar o obxecto. O lado dereito da caixa de diálogo é onde se dá a maxia. Os catro botóns na parte superior permiten seleccionar a resolución / tamaño do obxecto. A seguinte franxa mostra a capa seleccionada e premendo no rótulo + permite saír a capa seleccionada noutro formato tamén. O lixo Ca n elimina a capa da fila. Na seguinte tira cara abaixo, pode escoller o tipo de ficheiro e pode axustar o ancho e alto da imaxe de saída.
05 de 08
Extraer unha imaxe SVG
O Photoshop non manipula as imaxes SVG ben e os navegadores e os dispositivos non poden amosar unha imaxe de Ilustrador. Isto provocou o aumento dos ficheiros svg que se usan para ilustracións de vectores, como o logotipo de Illustrator que se mostra aquí. Sendo vectores a súa resolución é independentemente do dispositivo que pode ser escalado sen perda de detalles nin imaxe. Para converter o Illustrator Smart Object en svg, seleccione svg desde o menú abaixo e prema Extract .
06 de 08
O proceso de Extracción de Activos
Acontecerase un par de cousas ao facer clic no botón Extraer. Primeiro será avisado de que o nome do ficheiro pode cambiar. Este non é un gran problema. Entón contaráselle que se está a crear unha nova carpeta para manter o activo. Unha vez finalizado o proceso, a carpeta, situada na mesma ubicación que o orixinal .psd, abre e mostra o novo recurso.
07 de 08
O botón Configuración é o teu novo mellor amigo
Ao facer clic no botón Configuración ábrese unha caixa de diálogo de Configuración que é moi útil. Os axustes á esquerda son os factores de escala. O que fan é crear as varias copias da imaxe que un desarrollador usará nas consultas multimedia para orientar a resolución da pantalla dun dispositivo específico. Por exemplo, a versión 3x estaría dirixida a unha pantalla de Retina iPhone ou iPad mentres que un factor de 1,25 sería apuntado a un dispositivo Android. O sufijo engádese ao final do nome do ficheiro para permitir que o seu desenvolvedor identifique facilmente a imaxe que se vai usar nunha consulta de medios. Unha vez rematado, fai clic no botón Aceptar e as súas seleccións encenderanse na área Extract Assets do cadro de diálogo. Tamén pode acceder á configuración premendo no ícono da engrenaxe na área Extract Assets que se atopa no lado dereito da interface
08 de 08
Finalizando
Ao facer clic no botón Extracto, todos os bens serán creados e engadidos ao cartafol. Neste punto, o único que tes que facer é enviarlle ao teu desarrollador unha copia do cartafol e pasar ao seguinte proxecto.