Guía para principiantes de mapas de degradado

fdsfdsfdsa

Este tutorial fue creado como una colaboración entre Esra (https://profile.clip-studio.com/en-us/profile/362yzkvzw-o8) y yo (Toffl) para uno de los temas de este mes, "Corrección de color". Específicamente, hablaremos sobre las capas de corrección de mapas de degradado y cubriremos todas las cosas más importantes sobre ellas: qué son, cómo funcionan, cómo usarlas y cómo crear degradados. Los mapas de degradado son una herramienta extremadamente versátil, por lo que incluso en este tutorial solo rascamos la superficie de lo que es posible.

También hemos convertido este tutorial en un video de youtube: tanto la versión de video como la de texto cubren los mismos temas, así que elija el que prefiera. (El video está en inglés con subtítulos en inglés).

Ahora, sin más preámbulos, profundicemos en ello. Pero antes de que podamos hablar realmente de mapas de degradado, primero debemos aclarar qué es una capa de corrección y por qué son tan útiles.

Capas de corrección

En primer lugar, ¿qué es una capa de corrección de todos modos? En pocas palabras, una capa de corrección aplica un cierto efecto a todas las capas debajo de ella. Lo que hace exactamente depende del tipo de capa de corrección que elija. Y lo mejor de ellos es que no son destructivos. Eso significa que puede revertir el efecto o editar su configuración en cualquier momento.

Puede crear una capa de corrección haciendo clic con el botón derecho en la paleta de capas, luego en el menú contextual habrá nueve opciones para elegir en "Nueva capa de corrección".

Para casi todas las capas de corrección, aparecerá un cuadro de diálogo con configuraciones personalizables (que ignoraremos por ahora).

La propia capa de corrección se verá así:

Donde normalmente vería el contenido de una capa es un cuadro completamente gris, con un pequeño icono en la esquina. El icono indica qué tipo de capa de corrección es. Para cada nueva capa de corrección, también se crea automáticamente una máscara.

Puede hacer doble clic en el cuadro gris en cualquier momento más adelante para ajustar la configuración, que abrirá el mismo cuadro de diálogo que vio al crear la capa.

 

 

A continuación, ¿qué pueden hacer todas esas diferentes capas de corrección? He aquí un breve resumen:

Primero, Brillo / Contraste; como su nombre indica, este efecto puede cambiar tanto el brillo como el contraste de la imagen.

Tono / Saturación / Luminosidad puede ajustar, bueno, lo adivinó, el tono, la saturación y la luminosidad.

El efecto Curva de tono ajusta los canales RGB de la imagen utilizando puntos de control en un gráfico.

La corrección de nivel es muy similar a la curva de tono, pero usa controles deslizantes en un histograma.

El efecto Posterización reduce la cantidad de colores de una imagen a un número determinado.

Gradiente inverso invierte todos los colores. (Este es el único efecto que no tiene más configuraciones).

Balance de color le permite ajustar el balance de cada color RGB.

Y la binarización convierte todos los colores de la imagen en negro puro o blanco puro.

Pero todos estos efectos de corrección palidecen en comparación con la magnificencia de los mapas de gradiente. Los mapas de degradado son probablemente los más complejos de estos nueve y, lo que es más importante, mi favorito. Es por eso que creamos un tutorial completo dedicado a esta capa de corrección.

Mapas de degradado: qué son y cómo funcionan

Un mapa de degradado es una herramienta simple pero versátil para cambiar los colores de una imagen, tanto para imágenes en escala de grises como en color.

Al igual que cualquier otra capa de corrección, puede crear una capa de mapa de degradado haciendo clic derecho en la paleta "Capa", haciendo clic en "Nueva capa de corrección" y luego en "Mapa de degradado". Después de hacer eso, aparecerá la siguiente ventana:

En la parte superior verá la barra de color, que muestra el degradado que se aplicará al lienzo. En la parte inferior izquierda hay más degradados para elegir. Haga doble clic en cualquier degradado para copiarlo en la barra de colores.

Este grupo de gradientes se denomina conjunto de gradientes. Para acceder a otros conjuntos de degradados, haga clic en el nombre del conjunto de degradados actual. Esto abrirá un menú desplegable con los conjuntos de degradados que fueron preinstalados, que usted mismo creó o que descargó anteriormente.

Para el siguiente ejemplo, hemos seleccionado el degradado "Puesta de sol (violeta)" del conjunto de degradados "Cielo" preinstalado.

Si simplemente presiona Aceptar sin cambiar más configuraciones, tendrá el siguiente efecto en la imagen:

A la izquierda verá la versión sin editar; el lado derecho muestra la misma imagen pero con "Puesta de sol (violeta)" aplicado.

El efecto será diferente si cambia el modo de fusión o la opacidad de la capa de corrección, que explicaremos más adelante en secciones posteriores.

Básicamente, la capa de corrección del mapa de degradado lee el valor de la escala de grises (es decir, qué tan oscuro o claro es el color) de cada píxel de la imagen. Luego, a cada píxel se le asignará un nuevo color de acuerdo con el degradado: las áreas de blanco puro cambiarán al color de la derecha del degradado, mientras que el negro puro se convertirá en el color de la izquierda. Un color de rango medio cambiará a un color a lo largo del medio del degradado, y así sucesivamente.

La mayoría de los degradados con los que se encontrará van desde un color oscuro en el lado izquierdo hasta un color claro en el derecho. Pero eso no es todo lo que es posible para los mapas de degradado. Por ejemplo, no es necesario que los degradados tengan transiciones suaves. No necesitan pasar de oscuro a claro, y pueden tener tantos colores como desee.

Conceptos básicos de edición y creación de mapas de degradado

Debajo de la barra de color hay varias flechas pequeñas. Cada uno de estos nodos define un color específico. Todos los demás colores del degradado se crean mezclando estos colores.

Puede mover estos nodos a diferentes posiciones arrastrándolos o ingresando un número diferente en el cuadro "Posición" en la parte inferior derecha. Para crear un nuevo nodo, haga clic en cualquier lugar vacío del degradado. Al hacer clic en el icono del bote de basura en la parte inferior derecha, se eliminará el nodo seleccionado actualmente.

Para asignar un color diferente a un nodo, haga clic en el rectángulo de color debajo de "Color especificado". Esto abrirá un selector de color. (También puede seleccionar "Color de dibujo principal" o "Color de dibujo secundario" en su lugar; como los nombres implican, esto cambiará el color a cualquiera que sea el color principal o secundario seleccionado actualmente. Esto es útil para crear degradados para herramientas, pero ganamos profundizaré en eso, ya que ese no es el tema de este tutorial).

 

IMPORTANTE: Cualquier cambio que realice en la barra de color NO se guarda automáticamente en el conjunto de degradados. Para guardar un degradado en el conjunto, debe usar los botones debajo del conjunto de degradados.

1. El primer botón reemplaza el degradado resaltado actualmente con el degradado en la barra de color. Para resaltar un degradado diferente, haga clic en él una vez (dos veces sobrescribirá la barra de color).

2. El segundo botón hace lo mismo que hacer doble clic en el degradado resaltado; reemplaza el degradado en la barra de color.

3. El tercer botón crea una copia del degradado resaltado en el conjunto de degradados.

4. El cuarto botón guardará el degradado en la barra de colores como un nuevo degradado.

5. Y por último, el icono del bote de basura elimina el degradado resaltado del conjunto.

Ahora, si ha sobrescrito o eliminado accidentalmente un degradado que no quería, ¡no temas! Si hace clic en "Cancelar" en lugar de "Aceptar", todos los cambios realizados se revertirán. Pero eso incluye TODOS los cambios que ha realizado desde que abrió la ventana del mapa de degradado, así que téngalo en cuenta.

 

La última área de la interfaz que aún no hemos mencionado es la curva de velocidad de mezcla.

La curva de velocidad de mezcla de cada nodo determina cómo su color se mezcla con el color del siguiente nodo a la derecha. Por lo tanto, el nodo können más a la derecha no tiene una curva de velocidad de mezcla. Dado que las curvas de velocidad de mezcla determinan cómo se mezclan todos los colores entre los nodos, son uno de los factores más importantes para determinar el aspecto de un degradado.

El eje x describe la posición, que va desde la posición del nodo izquierdo hasta la posición del nodo derecho. El eje y, por otro lado, determina la proporción en la que el color derecho y el color izquierdo se mezclan en una posición determinada.

 

La siguiente imagen muestra la curva de velocidad de mezcla predeterminada (a la derecha, nodo negro). Cuando la casilla de verificación de la curva de velocidad de mezcla no está marcada, se comporta igual que la curva predeterminada que se muestra arriba.

Este gráfico no es perfectamente lineal; eso significa que el gradiente entre los dos nodos no es perfectamente uniforme. Para crear una gradación lineal, arrastre los dos puntos de control del medio fuera del gráfico para eliminarlos.

 

Una curva como la que se muestra a continuación resultará en una transición directa de un color al siguiente sin mezcla de colores.

 

Con negro en un extremo y blanco en el otro, la creación de una curva en S similar a la curva predeterminada da como resultado más grises muy oscuros y grises muy claros, y menos grises en el rango de tonos medios.

 

Por otro lado, una curva en S inversa crea más grises de tono medio y menos grises que son muy oscuros o muy claros.

 

También puede alternar entre el color izquierdo y derecho varias veces.

 

No solo puede editar los degradados de un conjunto, también puede crear conjuntos de degradados completamente nuevos. Haga clic en el icono de llave inglesa junto al nombre del conjunto de degradado. Allí no solo encontrará opciones para crear un conjunto de degradados; también puede cambiar el nombre de un conjunto o de un solo degradado.

Posibles usos de los mapas de degradado

Por supuesto, no está limitado solo a los usos enumerados a continuación. ¡Hay infinitas posibilidades sobre cómo utilizar mapas de degradado en su trabajo! Estos ejemplos son algunos de los usos más comunes y conocidos, así como métodos que personalmente uso mucho.

1. Colorear ilustraciones en escala de grises

Simplemente puede usar un mapa de degradado como se muestra antes al 100% de opacidad Normal para agregar color a bocetos o obras de arte monocromas. Esto puede hacer que un simple garabato sea mucho más interesante antes de publicarlo en las redes sociales, sin tener que colorearlo.

Pero también puede dar un paso más y agregar colores locales en la parte superior. Los colores locales deben estar en una capa de superposición o en una carpeta de superposición. Para hacer esto, recomiendo cambiar el color de su papel a un gris de tono medio, porque los colores en una capa de Superposición no se mostrarán en blanco puro.

En la imagen de abajo, hay una superposición púrpura aplicada tanto a la versión izquierda como a la derecha. Como puede ver, las áreas de papel blanco de la versión izquierda permanecieron completamente blancas.

 

Después de pintar algunos colores locales en la parte superior, así se ve el mismo dibujo de antes:

En la versión anterior utilicé un degradado sepia simple de tonos cálidos. Pero como las capas de corrección no son destructivas, aún puedo volver atrás y cambiar el degradado. Con solo dos clics, la obra de arte puede obtener una atmósfera completamente diferente.

2. Colorear lineart con opacidad

Si le gusta trabajar con opacidad variable en su lineart, los mapas de degradado son una herramienta simple pero efectiva para hacer que sus líneas parezcan mucho menos aburridas sin tener que colorearlas manualmente.

Primero, coloque sus capas de lineart en una carpeta. Debajo de las líneas, agregue otra capa y rellénela completamente con blanco puro. En la parte superior del lineart, cree una capa de corrección de mapa de degradado con el degradado de su elección.

El degradado debe tener blanco puro en su extremo derecho. Si ese no es el caso, el mapa de degradado afectará no solo al lineart, sino a todos los colores debajo. (Lo que podría usar a su favor si eso es lo que está buscando, pero en este caso queremos que las capas de color debajo del lineart no se vean afectadas).

El lineart debería verse así hasta ahora:

 

Y el paso final: cambie el modo de fusión de la carpeta de lineart a Multiplicar o Grabar lineal. Con ambos modos de fusión, las áreas blancas se vuelven transparentes, por lo que los colores de debajo serán visibles nuevamente.

 

La siguiente imagen muestra el antes y el después. Es un efecto más sutil que el método anterior, pero crea un bonito toque final.

 

Una cosa que debe tener en cuenta con este método es que si sus colores planos no están lo suficientemente limpios y el lineart es bastante claro, los bordes de los colores planos se vuelven visibles. Sin embargo, siempre que su lineart sea bastante oscuro en general, no debería ser un problema.

3. Ajuste del contraste con superposición

Este es otro truco rápido y simple para agregar un toque final a una obra de arte en color. Los mapas de degradado no solo pueden aumentar o disminuir el contraste, sino que también armonizarán el esquema de color.

Agregue una capa de mapa de degradado como lo haría normalmente. Para aumentar el contraste, el degradado debe pasar de oscuro a la izquierda a claro a la derecha. Por otro lado, una transición de degradado de claro a oscuro reducirá el contraste de la imagen.

 

Puede cambiar la dirección de un mapa de degradado con el botón en el lado derecho del degradado.

 

 

La capa de corrección del mapa de degradado debe estar por encima de todas las demás capas. A continuación, debe configurar el modo de fusión de la capa de corrección en Superposición y disminuir la opacidad si es necesario.

En este caso, utilicé un mapa de degradado de oscuro a claro (aumento de contraste). El lado izquierdo muestra la superposición del mapa de degradado al 100%, mientras que en el lado derecho la opacidad se reduce al 50%.

 

4. Cambio de imágenes a escala de grises

El uso de una capa de corrección de mapa de degradado es la forma más sencilla de convertir con precisión una imagen en escala de grises. Y "precisión" es la palabra importante aquí, porque técnicamente es más fácil agregar una capa de Tono / Saturación / Luminosidad y cambiar la Saturación a 0. Solía hacer lo último para verificar los valores de mi obra de arte, que es casi lo peor manera de hacerlo. No cometas los mismos errores que yo cometí.

No te molestaré con todos los detalles de por qué es así, pero como puedes ver por ti mismo, los resultados varían drásticamente.

La versión con 0% de saturación se ve muy diferente a las otras dos. El amarillo resulta mucho más oscuro de lo que debería y el azul es demasiado claro.

 

Para crear un mapa de degradado en escala de grises como el que se usa en el ejemplo, no puede simplemente agregar negro en un extremo y blanco en el otro. La curva de velocidad de mezcla del nodo negro debe ser lineal. Si deja la curva de velocidad de mezcla en su valor predeterminado, esto aumentará ligeramente el contraste de la imagen.

Cómo descargar mapas de degradado

Si desea tener más mapas de degradado disponibles sin tener que crear los suyos propios, puede descargar mapas de degradado de Clip Studio Assets.

(Muchos de los gradientes utilizados en este tutorial están disponibles para descargar de forma gratuita en Activos; simplemente busque mi nombre de usuario "toffl" o visite mi perfil)

Primero, como cualquier otro pincel o material, deberá ir a Activos, encontrar un conjunto de degradados que le guste y hacer clic en el botón de descarga en la parte superior derecha. A continuación, cree una capa de mapa de degradado, haga clic en el icono de llave inglesa junto al nombre del conjunto de degradado y haga clic en "Importar conjunto de material". Esto abrirá una nueva ventana con los conjuntos de degradados que haya descargado. Seleccionar uno y hacer clic en Aceptar lo agregará a su lista de conjuntos de degradados.

(Muchos de los degradados utilizados en este tutorial están disponibles para descargar de forma gratuita en Activos; simplemente busque mi nombre de usuario "toffl" o visite mi perfil)

Tutorial del proceso: creación de un mapa de degradado fiel al valor

En mi trabajo, utilizo casi exclusivamente gradientes "fiel al valor". (Yo mismo inventé ese término, no sé si hay algún otro término más común). Ahora, ¿qué significa eso exactamente?

Como explicamos al principio, un mapa de degradado asigna un nuevo color a cada color de una imagen según su valor. Un mapa de degradado fiel al valor asegura que el valor del nuevo color coincida con el valor del color subyacente. En otras palabras, el nuevo color puede tener un tono o saturación diferente al del color anterior, pero el valor sigue siendo el mismo.

En otras palabras, no debe preocuparse de que el degradado cambie los valores que ya eligió.

 

A continuación, lo guiaré a través del proceso de cómo hago para crear esos degradados.

Paso 1: Coloque los nodos de blanco puro y negro puro al final del degradado.

Paso 2: agregue los colores que desee que conste el degradado. Pueden ser tantos o pocos colores como desee, pero tenga en cuenta que cuantos más colores use, más tiempo necesitará para terminar su degradado.

En este caso agregué 4 nudos en verde oscuro, índigo, lavanda y amarillo.

El valor de posición de cada nodo de color debe coincidir con el valor de luminosidad HLS del color (al menos por ahora). De esa manera, cada color estará al menos aproximadamente en la posición correcta para que se considere fiel al valor.

Entonces, por ejemplo, si el HLS Lightness del amarillo es 90, muévalo a la posición 90 y repita eso para cada nodo.

Paso 3: Establezca la curva de velocidad de mezcla de cada nodo en lineal. Para hacerlo, marque la casilla "curva de velocidad de mezcla" y arrastre los dos puntos de control del medio fuera del gráfico para eliminarlos.

Paso 4: El último paso es ajustar los valores. Para hacer esto, primero debe configurar su lienzo de la siguiente manera:

Primero, cree una capa con un degradado perfectamente suave, de negro a blanco. El mapa de degradado que desea editar debe estar por encima. Y, por último, en la parte superior debe haber otra capa de mapa de degradado con un mapa de degradado en escala de grises.

Cuando active y desactive el mapa de degradado en el que hemos estado trabajando, probablemente notará que el resultado cambia ligeramente.

El objetivo ahora es cambiar el nuevo mapa de degradado de tal manera que el antes y el después se vean lo más similares posible. Puede hacerlo cambiando la luminosidad HLS de los colores o moviéndolos a una posición diferente. Luego, deberá verificar los valores nuevamente activando y desactivando su mapa de degradado. Probablemente deba repetir este proceso varias veces antes de que esté satisfecho con los resultados.

Por lo general, los azules y púrpuras deben moverse más cerca del lado izquierdo (oscuro), mientras que los amarillos y naranjas deben moverse hacia el lado derecho (claro).

(También es posible que notes algunos artefactos en el degradado cuando tanto el nuevo mapa de degradado como el mapa de degradado en escala de grises están activados y no puedes deshacerte de ellos. No tengo idea de por qué sucede eso a veces, así que elegí ignorarlo. )

Conclusión y redes sociales

Y ese ya es el final de nuestra breve digresión en el mundo de los mapas de degradado.

Esperamos que este tutorial haya sido útil de una forma u otra. Dado que solo cubrimos algunos métodos básicos para aplicar mapas de degradado, ¡hay muchas más posibilidades para explorar!

Como se mencionó al principio, este tutorial fue creado por dos artistas. Esra editó y animó el video mientras yo (Toffl) escribí el tutorial y grabé la voz en off. Todos los dibujos, animaciones y videos usados en este tutorial fueron creados por uno de nosotros, y todos los degradados usados fueron preinstalados en Clip Studio Paint o creados por mí.

Síganos en Instagram, Twitter o Artstation para ver más de nuestro arte y otros contenidos:

 

Esra: esra_arts (twitter, instagram)

(perfil de estudio de clip: https://profile.clip-studio.com/en-us/profile/362yzkvzw-o8)

 

Toffl: ktoffl (instagram, artstation)