Este tutorial fue escrito por Martijn Breeuwer especialmente para Lorelei Web

En estos tutoriales, te mostraré cómo crear esos pequeños patrones para darle vida a tus gráficos o diseños web. Los patrones no son difíciles de crear, pero pueden tener un gran efecto en el "atractivo sexual" de tus diseños.

Te mostraré la forma de crear algunos patrones populares y un patrón antidesgarros. También te mostraré algunos ejemplos de patrones alternativos.

Líneas de exploración diagonales
Empezaremos con un patrón muy popular. Las líneas de exploración diagonales.

Abra un nuevo documento en Photoshop y hágalo de 3 por 3 píxeles.
Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

Crea una nueva capa y elimina la "Antecedentes" capa para que la imagen se vuelva transparente.
Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

Ampliar hasta 1600% presionando CTRL + un par de veces.
Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

Coge la herramienta de lápiz y configúrelo en tamaño 1px Modo: Normal y Opacidad 100%
Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

Prensa D para restablecer sus colores a blanco y negro y pintar una línea de 3 puntos desde la parte superior derecha hasta la inferior izquierda.
Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

Ahora ve a Edita> Define Patrón y llámalo scanlines o como quieras llamarlo.
Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

Eso fue fácil ¿no?

Para usar su patrón seleccione el Herramienta Bote de pintura, Seleccione: Patrón de Costura en el cuadro desplegable y elija su patrón.
Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

O vaya a las opciones de fusión y aplique una superposición de patrón.

Asegúrate de crear una nueva capa antes de aplicar el patrón a tu trabajo. A veces el patrón se verá mejor cuando
la opacidad se reduce un poco.

Mira el resultado.
Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

Por supuesto, también puedes crear un patrón donde el espacio entre las líneas sea mayor. Para hacer esto, use el método anterior pero haga un lienzo de 5 por 5 píxeles.
Este será el resultado.
Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

Líneas de exploración horizontales
¿Qué tal algunas líneas de exploración horizontales? (Útil cuando estás creando algo como una pantalla de TV o PC, etc.)

Abra un nuevo documento en Photoshop y hágalo de 1 ancho por 2 píxeles de alto.
Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

Ahora cree una nueva capa y elimine la capa "Fondo" para que la imagen se vuelva transparente.

Acérquese hasta el 1600% presionando CTRL + un par de veces.

Ahora toma la herramienta de lápiz y configúrala en modo de tamaño 1px: Normal y Opacidad 100%. Misma configuración que antes

Presione D para restablecer sus colores a blanco y negro y pintar el píxel superior de negro.
Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

Ahora vaya a Editar>Definir patrón y asígnele el nombre líneas de escaneo horizontales.

Resultado.
Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

Pequeños puntos
Bien, ahora estamos creando algunos puntos pequeños.
Usamos el mismo método que usamos con las líneas de exploración.

Abra un nuevo documento en Photoshop y hágalo de 3 ancho por 3 píxeles de alto.

Ahora cree una nueva capa y elimine la capa "Fondo" para que la imagen se vuelva transparente.

Acérquese hasta el 1600% presionando CTRL + un par de veces.

Ahora toma la herramienta de lápiz y configúrala en modo de tamaño 1px: Normal y Opacidad 100%.

Presione D para restablecer sus colores a blanco y negro y pintar un punto en el medio del lienzo.
Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

Ahora ve a Editar>Definir patrón y llámalo puntos pequeños.

Resultado.
Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

Cruces
Hagamos un patrón cruzado. Cree un documento de 5 por 5 píxeles y utilice el método anterior

Pero ahora dibujas una cruz.
Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

vaya a Editar>Definir patrón y asígnele el nombre cross1 o lo que sea.

Resultado
Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

Patrón de protección ANTI RIP/derechos de autor
Por último, pero no menos importante, te enseñaré a hacer un patrón antidesgarros.

Abra un documento nuevo y asegúrese de tener suficiente espacio. 600 por 600 píxeles funcionarán bien. Lo recortaremos más adelante.

Cree una nueva capa y elimine la capa "Fondo" para que la imagen sea transparente.

Ahora toma la herramienta Texto y usa una fuente legible. Ariel, Tahoma, Verdana, Times, etc.

Usé estas configuraciones:
Verdana | negrita | 12 puntos | aa: ninguno

El tamaño debe ser de alrededor de 12 píxeles, no lo hagas demasiado grande, de lo contrario no funcionará bien como patrón.

Ahora escribe algo como: "creado por tu nombre" o "(c) tu nombre". Escribo (c) y luego mi nombre.
Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

Haga clic derecho en la capa de texto y seleccione rasterizar tipo o vaya a Seleccionar > rastarizar > escribir.
Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

Ahora presione CTRL T (Transformación libre) y gire el nombre unos -30 grados.
Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

Presiona Enter para confirmar la rotación. Acércate un poco y selecciona la herramienta de recorte.
Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

Coloque el mouse en la parte inferior del texto, haga clic y arrástrelo hacia la parte superior del texto. Asegúrate de seleccionar todo el texto y dejar algo de espacio en la parte superior e inferior.

Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

Ahora presiona enter.
Ahora deberías tener algo como esto.
Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

Vaya a Editar>Definir patrón y llámelo copyright.

Abra su último diseño web que desea proteger del destripador y cree una nueva capa.

Seleccione la herramienta Bote de pintura y seleccione el patrón de copyright. Baja la opacidad para que la imagen sea visible para quienes quieran verla.
pero más difícil para aquellos que quieren rasgar.

Apliqué esto a una plantilla en la que estoy trabajando. La opacidad es de aproximadamente el 20%.
Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

Combinando y experimentando
Ahora que conoces la forma de crear un patrón, es hora de combinarlo y experimentar con él.

Mira estos diferentes patrones. Las posibilidades son infinitas. Desde texto, formas (flores, etc.) y líneas, todos pueden usarse para crear patrones.

Todo lo que necesita saber sobre cómo trabajar con patrones: crear e implementar - Tutoriales de PS Lorelei Web Design

Gracias por ver estos tutoriales, espero que hayas aprendido algo.