DESIGNAID

Herramientas claves para representar tus ideas

Crea fondos de patrones coordinados con Photoshop.

Photoshop nunca dejará de hacerme sonreir. A pesar que lo uso desde la versión 3.0, cada vez que abro el programa encuentro una razón para seguirlo usando. Muchas de las cosas que puedes hacer con él son bastante sencillas pero la clave es saber como usarlo más rápidamente. Por ejemplo puedes lograr hacer muchos efectos y casi cualquier cosa que quieras. De hecho en un post anterior comenté como puedes usarlo para tus texturas web, pero también puedes crear fondos para otros diseños como tus impresos, artes, fondos de pantalla, etc.

Veamos como podemos generar un fondo como este:

El fondo listo.

Tomé el logo de Designaid y simplemente lo repetí varias veces en el arte.

Este fondo lo puedes usar en cualquier tamaño ya que tu figura principal se multiplicará en toda la pantalla. Es muy simple de hacer, ysólo es cuestión conocer un par de trucos sencillos.

Empecemos…

PASO 1: Crea un documento nuevo en Photoshop. no es necesario que tu documento sea tan grande, usa 320×320 pixeles. Ahora para esta practica usaremos las guia, estas nos permitirán ordenar la imagen y este paso es escencial para el efecto. Vete al menú y selecciona VIEW > NEW GUIDE en la ventana que te aparece crea 1 guia horizontal y otra vertical. Creála en la posición de la mitad de tu archivo, como yo usé 320px entonces usaré 160px. La idea es generar una cruz en tu documento para definir el centro exacto. Ahora coloca tu figura principal en el centro de la cruz, Algo así: (tu figura debe estar en una capa independiente)

Asi empezamos el fondo.

Ten mucho cuidado de colocar tu figura en el centro exacto para que los pasos que haremos ahora funcionen sin problemas. Tu imagen debe quedar en el centro absoluto.

PASO 2: Ahora sólo es cuestión de seleccionar la capa donde esta tu arte y luego ir al menu para aplicar: FILTER > OTHER > OFFSET este comando sólo hace una cosa y es mover nuestra capa. Ahora usa 160px para mover tu capa horizontal y verticalmente. Selecciona la opción WRAP AROUND. Con esto conseguimos que esta capa se repita a través de todo el documento.

Usa estos parámetros para el filtro de Offset.

PASO 3: El fondo ya está casi listo. Ahora lo que haremos es definir esta imagen completa como un PATTERN (un patrón) en Photoshop. Asi que vete a EDIT > DEFINE PATTERN… y ponle un nombre a tu patrón.

EL fondo del logo de designaid!

PASO 4: Ya puedes cerrar el documento que estamos trabajando porque ya no lo necesitarás más, no es necesario salvar este documento porque El patrón de esta imagen está guardado en Photoshop, asi que para usarlo sólo es cuestión de aplicar el patrón a cualquier imagen que necesites. Pero vamos a probar el patrón entonces, asi que genera un documento nuevo, usa cualquier tamaño que quieras yo usaré 1024×768 lo que podria usarse como fondo de escritorio. Luego, vete a EDIT > FILL… y de esta ventana selecciona: CONTENTS: PATTERN y en “custom pattern” busca el patrón que habiamos salvado anteriormente.

Aqui aparece tu patron ya listo.

Ya esta listo nuestro fondo. Si fijaste tu imagen en el centro absoluto del documento, entonces tu imagen se multiplicará varias veces dando la impresión de que es ahora una arte infinito o un fondo completo. Este truco se usa mucho sobre todo para el Web, pero lo puedes aplicar también en otros artes o cuando necesites un patrón coordinado. También puedes crear otras variaciones dejando capas extras o jugando con la misma forma de tu imagen. En este caso yo dejé una capa adicional con otro logo.

El fondo listo.

Espero te sirva de mucho, sigan enviandome sus comentarios, todavia le queda tiempo a la encuesta!

saludos a todos.

Luis S.

8 comentarios»

  marco wrote @

Enhorabuena por el contenido de tu web y gracias por compartir estos tutoriales.

Lamentablemente la navegación se hace insufrible por culpa de esas molestas ventanas que saltan constantemente cada vez que pasas el ratón sobre una imagen.

Desinstala cuanto antes el plugin de Snap Shot, porque hace tu web impracticable.

Un saludo,
marco

  Luis S. wrote @

Gracias por la acotacion Marco. Desde hace tiempo estaba pensando lo mismo. Es muy molesto sobretodo si estas viendo el blogroll. Ademas los snapshots ultimamente solo muestran las ultimas entradas RSS. Ya lo elimine del blog asi que ahora es mas simple “curiosear” en Designaid🙂

saludos.

Luis S.

  marco wrote @

Luis,

Me alegro de que hayas modificado el blog.

Como te decía, me parece impecable y el contenido es fabuloso. Ya te tengo entre mis favoritos.

Gracias por dejarte aconsejar y espero que no te haya molestado la sugerencia.
(Acabo de leerla de nuevo y la verdad es que podía haber usado un tono más amable, lo siento)

Un saludo,
marco🙂

  Morc pichi en diseño wrote @

¡Buenísimo!
¡Siempre quise saber cómo se hacía este tipo de pattern!

  morcdesigns wrote @

Una pregunta: ¿Esto se puede lograr con el GIMP? En este momento no tengo el Photoshop en mi máquina…

  Luis S. wrote @

De verdad que no sabria decirte Morc. no he trabajado nunca con gimp. pero estoy seguro que puedes buscar en internet algun tutorial para lograrlo hacer.

saludos.

Luis S.

  David wrote @

GRACIAS, GRACIAS, GRACIAS!!!

SOS GROSO!!!

jajaja… Que chevere, me ayudaste mucho.

Gracias de nuevo, super día😀

  ruku wrote @

muy bueno. la verdad me sirvio mucho ^^


Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s

A %d blogueros les gusta esto: