Este es un tutorial para convertir una imagen de una textura en un fondo uniforme (pattern o patrón) muy útil para diseño gráfico o diseño web.
Para este tutorial me he bajado de internet una imagen de una textura ( http://rezalutions.com/awesome-collection-of-60-high-quality-free-textures ) aunque podéis hacerlo con cualquier foto de textura que tengáis.
Esta es la imagen
Como podéis observar, en principio no nos sirve como patrón o módulo ya que al unir varias veces esta misma imagen nos encontramos un problema: se notan mucho las uniones
Para evitarlo vamos a convertir esa textura en un módulo que podamos aplicar como fondo uniforme.
1. Abrimos la foto original con Photoshop
2. El primer paso va a ser editar un poco la textura: con la herramienta sobreexponer (a un 19% opacidad) iluminamos los bordes de la imagen para que no existan grandes diferencias de contraste
Así quedaría después de sobrexponer los bordes:
3. Bien ahora vamos a desplazar la imagen un poco hacia la izquierda (si no pudieses desplazarla porque la capa está bloqueada, dale doble click sobre ella en el panel de capas):
4. Duplica la capa arrastrándola hacia el icono de nueva capa:
5. Arrastra hacia la derecha la nueva capa que has creado hasta su borde izquierdo se una con el borde derecho de la capa anterior (no la desplaces verticalmente, sólo horizontalmente):
Ahí se observa claramente el salto que hay en la unión entre ambas capas (salto que vamos a hacer desaparecer con los siguientes pasos:
6. Fusionamos ambas capas, para ello en el panel de capas las seleccionamos (click sobre ambas manteniendo pulsada la tecla Shift) y control+E para fusionar
7. Usamos el tampón de clonar para evitar el salto entre ambas imágenes, con un tamaño de pincel bajo vamos trabajando esa diferencia hasta disminuirla(a la hora de clonar centrate en ese salto y no alteres los bordes extremos de la imagen)
Debería quedarte algo así:
8. Vale, los laterales ya funcionan como módulo, ahora sólo hay que repetir los mismos pasos en los bordes superior e inferior. Guarda la imagen como .jpeg y vamos a cambiar los extremos superior e inferior. Como antes, desplazamos unos pixeles la imagen pero esta vez hacia arriba:
9. duplicamos la capa como antes, pero esta vez desplazamos la nueva capa hacia abajo, hasta que su borde superior se una con el borde inferior de la capa anterior.
10. Fusionamos ambas capas y nuevamente con el tampón de clonar corregimos el salto entre una capa y otra. Guardamos y así obtenemos el resultado final:
Ahora esta imagen esta convertida en un módulo (patrón, pattern) Al repetirse no se notan los altos entre sus uniones y puede servirte como fondo (background) para diferentes diseños gráficos o fondos web.
Mira, vamos a probarla uniéndola varias veces:
Puedes probar este mismo tutorial con diferentes texturas.
Espero que sea de utilidad
Un saludo
Para este tutorial me he bajado de internet una imagen de una textura ( http://rezalutions.com/awesome-collection-of-60-high-quality-free-textures ) aunque podéis hacerlo con cualquier foto de textura que tengáis.
Esta es la imagen
Como podéis observar, en principio no nos sirve como patrón o módulo ya que al unir varias veces esta misma imagen nos encontramos un problema: se notan mucho las uniones
Para evitarlo vamos a convertir esa textura en un módulo que podamos aplicar como fondo uniforme.
1. Abrimos la foto original con Photoshop
2. El primer paso va a ser editar un poco la textura: con la herramienta sobreexponer (a un 19% opacidad) iluminamos los bordes de la imagen para que no existan grandes diferencias de contraste
Así quedaría después de sobrexponer los bordes:
3. Bien ahora vamos a desplazar la imagen un poco hacia la izquierda (si no pudieses desplazarla porque la capa está bloqueada, dale doble click sobre ella en el panel de capas):
4. Duplica la capa arrastrándola hacia el icono de nueva capa:
5. Arrastra hacia la derecha la nueva capa que has creado hasta su borde izquierdo se una con el borde derecho de la capa anterior (no la desplaces verticalmente, sólo horizontalmente):
Ahí se observa claramente el salto que hay en la unión entre ambas capas (salto que vamos a hacer desaparecer con los siguientes pasos:
6. Fusionamos ambas capas, para ello en el panel de capas las seleccionamos (click sobre ambas manteniendo pulsada la tecla Shift) y control+E para fusionar
7. Usamos el tampón de clonar para evitar el salto entre ambas imágenes, con un tamaño de pincel bajo vamos trabajando esa diferencia hasta disminuirla(a la hora de clonar centrate en ese salto y no alteres los bordes extremos de la imagen)
Debería quedarte algo así:
8. Vale, los laterales ya funcionan como módulo, ahora sólo hay que repetir los mismos pasos en los bordes superior e inferior. Guarda la imagen como .jpeg y vamos a cambiar los extremos superior e inferior. Como antes, desplazamos unos pixeles la imagen pero esta vez hacia arriba:
9. duplicamos la capa como antes, pero esta vez desplazamos la nueva capa hacia abajo, hasta que su borde superior se una con el borde inferior de la capa anterior.
10. Fusionamos ambas capas y nuevamente con el tampón de clonar corregimos el salto entre una capa y otra. Guardamos y así obtenemos el resultado final:
Ahora esta imagen esta convertida en un módulo (patrón, pattern) Al repetirse no se notan los altos entre sus uniones y puede servirte como fondo (background) para diferentes diseños gráficos o fondos web.
Mira, vamos a probarla uniéndola varias veces:
Puedes probar este mismo tutorial con diferentes texturas.
Espero que sea de utilidad
Un saludo