Transformar y Duplicar capas en Photoshop: un tutorial para crear elementos de la interfaz de metal
En el paso anterior de este tutorial, hemos guardado las imágenes con las texturas de metal que formarán la interfaz metalizada cromada. Ahora tenemos la materia prima necesaria para trabajar con las piezas básicas para crear más efectos realistas de metal y piezas de la interfaz.
De ahora en adelante, es importante que trabaje con píxeles (y no con estilos de capa). Esto le permitirá usar nuevas herramientas de Photoshop para crear nuevos elementos de la interfaz de metal a partir de las piezas básicas:
- Podemos duplicar las capas manteniendo el archivo de tamaño reducido y rápida respuesta.
- Podemos dibujar directamente, borrar o transformar partes de las piezas de metal de la interfaz, sin tener que alterar el efecto metalizado, o hacer que Photoshop recalcule el estilo de metal representado.
Comencemos con las opciones de duplicar capas en Photoshop. El primer paso para diseñar muchas piezas de aspecto metálico a partir de los elementos cromados básicos comienza duplicando las capas actuales (o parte de esas capas). Posteriormente, modificaremos las piezas duplicadas para crear más imágenes nuevas con aspecto de metal.
Comience con el diseño de la interfaz principal que guardó como una imagen acoplada preservando la transparencia.
Si cortamos la parte superior de la interfaz mientras tiene un estilo de capa aplicado, el margen inferior cambiaría al redibujar el estilo de capa.
Por contra, podemos cortar la parte superior de la barra exportada como una imagen TIFF sin que se produzcan transformaciones del estilo de metal.
Puede duplicar partes de la interfaz y borrar zonas para crear nuevos diseños para la interfaz de metal.
- Para duplicar una capa entera en Photoshop, basta con arrastrar la capa (en la ventana de capas) al icono de nueva capa de la parte inferior.
- Si quiere que Photoshop duplique una selección, utilice la opción de Capa > Nueva > Capa via Copiar (atajo de teclado: Control + J).
Puesto que los efectos de metal de las capas duplicadas están hechos de píxeles (y no de estilos de Photoshop), puede pintar o borrar parte de estos elementos duplicados para generar muchas piezas más de la interfaz, manteniendo los efectos de metal logrados a través de la aplicación del estilo de capa.
Ahora puede añadir o borrar elementos a una misma capa: el estilo de metal no se verá distorsionado. Simplemente, experimente creando más elementos metálicos de la interfaz a partir de los diseños de las piezas básicas de la interfaz que ya exportó en el paso anterior del tutorial.
A continuación le mostraré cómo puede utilizar la herramienta de transformación libre de Photoshop para diseñar secciones de la interfaz aún más atractivas e interesantes.
Transformar en Photoshop con la herramienta de Transformación Libre: 3D y perspectiva
Podemos ajustar dibujando directamente a mano las formas de la interfaz que duplicamos en el paso anterior del tutorial, rellenando selecciones o pintando con la herramienta Pincel. Pero otra buena idea sería aprovechar las ventajas de la potente Herramienta de Transformación Libre de Photoshop
para diseñar tantas variaciones como sea posible a partir de la interfaz básica de metal inicial.
Para usar la Herramienta Transformar sólo tiene que seleccionar la capa deseada en la ventana de capas, y pulsar el atajo del teclado Control + T.
Incluso las transformaciones libres más básicas como escala y rotación son formas muy interesantes de combinar las piezas duplicadas.
Existen múltiples operaciones de transformación libre que resultarán muy útiles a la hora de crear modernas interfaces con efectos de metal cromado a partir de las piezas básicas que diseñó. He aquí algunos trucos:
Para Escalar en Photoshop (Scale) mientras esté en el modo de Transformación Libre, pulse y arrastre
los controladores de escala (donde el puntero de ratón se transforma en una flecha recta de dos puntas). Mantenga pulsada Mayúsculas para crear un escalado proporcional, y deje pulsado ALT al arrastrar el tirador si desea escalar desde el centro.
Haga clic derecho con la transformación libre activa para abrir el menú contextual. Puede "Reflejar" la imagen editada, o restringir las trasformaciones a las útiles modificaciones de "Perspectiva" y añadir 3D al diseño.
No subestime la utilidad de la Transformación Libre en Photoshop: estos son algunos de los ejemplos de piezas de una interfaz tecnológica creadas duplicando las capas y aplicándoles una transformación libre.
Para Rotar en el modo de Transformación Libre, pulse y arrastre en puntos de fuera de la forma (donde el puntero del ratón se transforma en una flecha curvada con 2 puntas). Mantenga Mayúsculas mientras arrastra para restringir los incrementos de rotación a 15º.
También puede Distorsionar utilizando la herramienta de Transformación Libre: mantenga Control a la vez que pulsa y arrastra
cualquiera de los tiradores de escala.
Recuerde que un clic derecho en cualquier punto de la pantalla mientras se encuentre en el Modo de Transformación Libre abrirá un nuevo menú de opciones de transformar que le permitirá elegir qué tipo de transformación de Photoshop (escala, rotación, perspectiva, etc.) desea aplicar mediante las opciones de transformación libre.
También puede seleccionar otras operaciones de rotación y de Reflejo (Flip) desde el menú contextual de transformación.
Mediante las opciones del menú contextual de Transformación Libre, vamos a restringir las transformaciones a modificaciones de Perspectiva. Usando esta especie de transformación 3D en Photoshop podemos afilar las piezas de la interfaz, o bien añadir más profundidad y efectos tridimensionales al diseño básico de la interfaz. De hecho, la herramienta perspectiva es probablemente la forma más sencilla de darle un efecto de 3D a los elementos de la interfaz.
Una vez más, la clave está en experimentar. Le sorprenderá ver la enorme cantidad de piezas diferentes con efectos cromados metalizados que puede crear para su interfaz princpal simplemente aplicando la "transformación libre" a las capas que duplicó con Photoshop.