Cómo Crear una Ilustración de Estilo de Vida Parisino en Sketch

Sketch es un fabuloso software que nos permite crear distintas clases de arte vectorial. Hoy estarás aprendiendo cómo crear sencillos elementos vectoriales, que vas a integrar en un bella y elegante escena inspirada por las películas "Desayuno con Diamantes" y "La Princesa Que Quería Vivir". Toma una taza de café y ¡comencemos!

1. Crea la Torre Eiffel

Paso 1

Comencemos por crear nuestra mesa de trabajo. Para hacer ésto, presiona A en el teclado y dibuja una mesa de trabajo de tamaño 850 px por 850 px.

Paso 2

Selecciona la herramienta Rectangle (Rectángulo) al presionar R en el teclado (o desde el menú Insert (Insertar) > Shape (Forma) en la barra de herramientas superior) y crea un rectángulo que sea del mismo tamaño de nuestra mesa de trabajo.  Desmarca los bordes, y luego haz click en el botón Fill (Relleno) y cambia e color a #C5E9F9, usando el Inspector Panel a la derecha.

Paso 3

Toma la herramienta Vector (V) y dibuja una silueta básica de la Torre Eiffel-o, más precisamente, solo una mitad de ella. No tiene que ser perfecta, ya que la Torre Eiffel será parte de nuestro paisaje urbano de fondo.

Paso 4

Duplica ésta forma al presionar Comando-D en el teclado y Flip Horizontal (Reflejar Horizontal) (Layer (Capa) > Transform (Transformar) > Flip Horizontal (Reflejar Horizontal)).

Paso 5

Mueve ésta forma a la derecha. Asegúrate de que las formas se superpongan al menos 1 px. Usa la imagen de abajo como una referencia.

Paso 6

Selecciona ambas mitades y luego combínalas con Union desde la barra de herramientas superior.

Paso 7

Finalmente, desmarca los bordes y establece el color en #A7D9ED usando el Inspector Panel en la derecha.

Nombra ésta forma "Eiffel Tower".

2. Crea un Paisaje Urbano

Paso 1

Toma la herramienta Vector (V) y dibuja una forma que representará el paisaje urbano. Piensa en ésta forma como la unión de edificios y casas de diferente tamaño. Usa la imagen de abajo como una referencia.

Da a ésta forma el nombre de "city".

Paso 2

Deshabilita los bordes y cambia el color a #B4E5F7.

Paso 3

Agreguemos algunas ventanas. Para hacer eso, utilizaremos rectángulos de diferente tamaño. Así que, elige la herramienta Rectangle (R) y comienza a crear ventanas. Para el color, usa #E4F7FD y deshabilita los bordes.

Paso 4

Continúa dibujando ventanas hasta que tengas algo como la imagen de abajo.

Selecciona la forma "city" y todas las ventanas creadas y colócalas en un grupo usando Comando-G en el teclado. Nombra éste grupo "cityscape".

3. Dibuja una Terraza de un Café

Paso 1

Dibuja un rectángulo como en la imagen de abajo usando Rectangle (R). Éste rectángulo será el piso de la terraza.

Paso 2

Desmarca los bordes, haz click en el botón Fill (Relleno), y cambia a Linear Gradient (Degradado Lineal), usando el Inspector Panel a la derecha. Crea un Linear Gradient (Degradado Lineal) usando los siguientes parámetros:

• 1: #969696
• 2: #CDCDCD
• 3: #B0B0B0

Paso 3

Agreguemos una pared a la terraza. Dibuja otro rectánglo usando Rectangle (R). Desmarca los bordes, y para el color usa #F2F2F2.

Paso 4

A continuación, dibuja un pequeño rectángulo en la parte inferior (para el color, usa #CBE3FF).

Paso 5

Luego una en la parte superior de la pared de la terraza.  Para éste, usa el color #FFFFFF.

Selecciona todos los rectángulos y agrúpalos (Comando-G) en el grupo "terrace".

4. Crea una Mesa de Bar

Paso 1

Toma la herramienta Rectangle (R) y dibuja la base de una mesa. En el Inspector Panel a la derecha, establece el Radio en 22 px.

Paso 2

Deshabilita los bordes y haz click en Fill (Relleno) y elige Linear Gradient (Degradado Lineal). Establece la detención de color izquierda en #DCD0CA y la derecha en #918084.

Paso 3

A continuación, dibuja una pata de la mesa usando la herramienta Rectangle (R). Usa el color #DCD0CA para la pata.

Paso 4

Duplica (Comando-D) la pata de la mesa, cambia el color a #A8959A, y reduce la altura como se muestra en la imagen de abajo.

Paso 5

Ingresa en el modo de edición de forma al presionar Enter en el teclado, o simplemente haciendo doble-click en el rectángulo. Verás un punto redondo en cada una de las esquinas. Toma el punto izquierdo inferior y muévelo un poco hacia arriba.

Paso 6

Crea otro rectángulo arriba, y para éste usa el color #6E606B.

Paso 7

Agreguemos alguna sombra en la parte superior. Toma la herramienta Rectangle (R) y dibuja un rectángulo que sea de la misma altura de la pata de la mesa, pero de la mitad de su anchura. Para el color, usa #000000.

Paso 8

Disminuye la Opacidad de éste rectángulo a 10%.

Paso 9

Ahora crearemos la parte superior de la mesa. Para hacer ésto, toma la herramienta Rectangle (R) y crea un rectángulo en la parte superior.

Paso 10

Cambia el Fill (Relleno) a Linear Gradient (Degradado Lineal) y crea un degradado con los siguientes parámetros para las detenciones de color:

• 1, 7, 11: #DACEC8
• 2, 8: #DBCFC9
• 3, 6: #F1E2D8
• 4: #DCD0CA
• 5: #DCCFC9
• 9: #EDDFD5
• 10: #DED2CB

Paso 11

Finalmente, crea un diminuto rectángulo cerca de la parte inferior de la mesa. Utiliza #FBF0E2 para el color.

Paso 12

Selecciona todas las formas y colócalas en el grupo "bar table" usando Comando-G.

5. Crea un Taburete

Paso 1

Primero crearemos la base del taburete. Toma la herramienta Rectangle (R) y dibuja la base. En el Inspector Panel de la derecha, establece el Radio en 22 px.

Paso 2

Deshabilita los bordes y haz click en Fill (Relleno) y elige Linear Gradient (Degradado Lineal). Establece la detención de color izquierda en #918084 y la de la derecha en #DCD0CA.

Paso 3

Crea la pata del taburete de la misma manera que lo hicimos en el paso previo para la pata de la mesa.

Paso 4

Ahora crearemos un reposa piernas en el taburete. Dibuja un rectángulo redondeado usando la herramienta Rounded (U) (Redondeado). Establece el Radio en 10 px en el Inspector Panel.

Paso 5

A continuación, crea un tríangulo usando Triangle desde Insert > Shape  (Insertar > Forma).

Paso 6

Selecciona ambas formas y fusiónalas usando Union desde la barra de herramientas superior. Cambia el Fill (Relleno) a Linear Gradient (Degradado Lineal). Para la detención de color izquierda, usa #DCD0CA, y para la de la derecha, usa #C5BAB5.

Paso 7

Ahora ajustemos el degradado. Primero, mueve la detención de color derecha hacia el centro, y luego mueve la detención de color izquierda también hacia el centro.

Paso 8

Creemos un asiento. Toma la herramienta Rectangle (R) y dibuja la forma de un asiento. Utiliza el color #F5A623.

Paso 9

Haz doble-click en el rectángulo para ingresar en el modo de edición de forma, selecciona los dos puntos superiores, y establece los Corners (Vértices) en 14 px en el Inspector Panel.

Paso 10

Ahora apliquemos Inner Shadows (Sombras Interiores) usando el Inspector Panel. Aplicaremos dos diferentes sombras interiores para agregar profundidad. Para la primera, utiliza los siguientes parámetros:

• Color: #FFFFFF
• X: 0 px
• Y: 0 px
• Blur (Desenfoque): 2 px
• Alpha: 80%

Paso 11

Para la segunda, utiliza los siguientes parámetros:

• Color: #000000
• X: 0 px
• Y: -9 px
• Blur (Desenfoque): 9 px
• Alpha: 15%

Paso 12

Dibuja un rectángulo en la parte inferior del asiento y elige Linear Gradient (Degradado Lineal) para el Fill (Relleno). Crea un degradado con los siguientes parámetros para las detenciones de color:

• 1, 2, 4, 5, 7, 10, 11: #EFEAE8
• 3, 6: #FFFFFF
• 9: #F8F6F6

Paso 13

Finalmente, crea un rectángulo diminuto cerca de la parte inferior del asiento. Usa #D8D8D8 para el color.

Selecciona todas las formas y colócalas en el grupo "bar stool" usando Comando-G. Coloca el grupo "bar stool" debajo del grupo "bar table" en la Layers List (Lista de Capas).

Paso 14

Usa la herramienta Oval (O) para crear una sombra debajo del taburete y la mesa. Usa el color #000000 para el Fill (Relleno), disminuye la Opacity (Opacidad) a 40%, y cambia el Blending (Modo de Fusión) a Soft Light (Luz Suave). En la Layers List (Lista de Capas), mueve ésta forma debajo de los grupos "bar table" y "bar stool".

6. Dibuja una Mujer

Paso 1

Usando la herramienta Vector (V), dibuja la forma de una cabeza. Para el color, usa #FDCCA2 y deshabilita los bordes.

Paso 2

Toma la herramienta Vector (V) y dibuja una boca.

Paso 3

Desmarca los bordes y rellena la forma de la boca del color #E77781.

Paso 4

Usando la herramienta Oval (O), crea un lunar justo arriba de la boca. Para el color, usa #F4BB94.

Paso 5

Dibuja la forma de las gafas de sol usando la herramienta Vector (V). Rellena la forma con el color #FFFFFF y asegúrate de que los bordes estén deshabilitados.

Paso 6

Luego, de nuevo usando la herramienta Vector (V), dibuja la forma de un lente.

Paso 7

Usando el Inspector Panel a la derecha, cambia el Fill (Relleno) a Linear Gradient (Degradado Lineal). Para la detención de color superior, usa #AFAAA8, y para la detención de color inferior, usa #0D0D0D.

Paso 8

Agrega el brillo del lente usando la herramienta Oval (O). Rellena la forma con #D8D8D8, disminuye la Opacity (Opacidad) a 50% y asegúrate de que los bordes estén deshabilitados.

Paso 9

Selecciona todas las formas que son parte de las gafas de sol, inclúyelas en el grupo "sunglasses" y aplica Shadow (Sombra) al grupo desde el Inspector Panel. Utiliza los siguientes parámetros:

• Shadow color (color de sombra): #EAA884.
• X: 2 px
• Y: 0 px
• Blur (Desenfoque): 2 px

Paso 10

Ahora, dibujemos el cabello. Contornea el cabello usando la herramienta Vector (V). Rellena la forma con el color #000000 y desmarca los bordes.

Paso 11

Usa la herramienta Vector (V) para contornear la bufanda alrededor de la cabeza de la mujer. Deshabilita los bordes y rellena la forma con el color #F7EADF.

Paso 12

Aplica Shadows (Sombras) usando el Inspector Panel de la derecha. Usa los siguientes parámetros:

• Color: #000000
• X: -1 px
• Y: 0 px
• Blur (Desenfoque): 2 px
• Alpha: 5%

Paso 13

Dibuja una forma sobre la bufanda como se muestra en la imagen de abajo con la herramienta Vector (V). Para el color, usa #000000.

Paso 14

En seguida, selecciona éstas dos formas que acabamos de crear al mantener presionada la tecla Mayúsculas y haciendo click en las capas, y luego elige Mask (Máscara) en la barra de herramientas superior.

Paso 15

Finalmente disminuye la Opacity (Opacidad) de la forma negra a 3%.

Selecciona todas las capas que utilicé para crear la cabeza de la mujer (forma de la cabeza, boca, lunar, gafas de sol, cabello y bufanda), e inclúyelas (Comando-G) en el grupo "head".

Paso 16

Usa la herramienta Rectangle (R) para crear un cuello. Establece el color en #FDCCA2 y deshabilita los bordes.

Paso 17

Toma la herramienta Oval (O) y dibuja una forma como la de la imagen de abajo, para agregar una sombra de la cabeza. Establece el color en #00000 y la Opacity (Opacidad) en 10%.

Paso 18

Selecciona el rectángulo del cuello y el óvalo de la sombra, y elige Mask (Máscara) de la barra de herramientas superior.

Paso 19

El resultado de ésta operación de enmascarar es automáticamente colocado en un nuevo grupo en la Layers List (Lista de Capas) a la izquierda. Nombra éste grupo "neck" y colócalo debajo del grupo "head" en la Layers List (Lista de Capas).

Paso 20

Pasemos al vestido de la mujer. Toma la herramienta Vector (V) y dibuja la forma de un vestido. Desmarca los bordes y establece el color en rosa (#FF5AA4).

Paso 21

Utiliza la herramienta Oval (O) para crear un motivo de lunares para el vestido. Dibuja un círclo de 4 px por 4 px. Establece el color en #FFFFFF y disminuye la Opacity (Opacidad) en 50%. Crea el motivo al simplemente duplicar y organizar círculos en una manera entrelazada.

Paso 22

Selecciona todos los círculos y agúpalos (Comando-G). Luego, selecciona el vestido y el grupo de círculos y elige Mask (Máscara) de la barra de herramientas superior. Ésto colocará puntos dentro de la forma del vestido y crea un nuevo grupo en la Layers List (Lista de Capas). Nombra éste grupo "dress".

Paso 23

Ahora, usando la herramienta Vector (V), dibuja un collar. Usa #FCF2E4 para el color.

Paso 24

Aplica Shadows (Sombras) usando el Inspector Panel de la derecha, utilizando los siguientes parámetros:

• Color: #000000
• X: 1 px
• Y: 1 px
• Blur (Desenfoque): 1 px
• Alpha: 5%

Selecciona el cuello y el grupo "dress" y pónlos en un grupo "collar dress" al usar Comando-G.

Paso 25

Ahora podemos continuar con las piernas de la mujer. Toma la herramienta Vector (V) y dibuja una pierna. Establece el color en #F6C695.

Paso 26

Forma la segunda pierna, la cual está cruzada, usando la herramienta Vector (V), pero ahora usa un tono de piel ligeramente más claro, #FDD0A2.

Paso 27

Usa la herramienta Vector (V) para crear la forma de un zapato. Para el color, usa #415378.

Paso 28

Haz el segundo zapato al copiar el primero y rotándolo un poco.

Paso 29

Selecciona ambas piernas y zapatos y agrúpalas en el grupo "legs", al presionar Comando-G en el teclado. Luego mueve éste grupo abajo del grupo "collar dress" en la Layers List (Lista de Capas).

Paso 30

Usa la herramienta Vector (V) para dibujar las manos de la mujer. Primero dibuja la que está atrás. Usa #FBD5A3 para el color.

Paso 31

Da a ésta forma el nombre de "right hand" y colócalo en la Layers List (Lista de Capas) debajo del grupo "collar dress".

Paso 32

Luego dibuja la mano que está en frente. Usa un color ligeramente más brillante para la piel, #FDDAAB. Nombra ésta forma "left hand".

Paso 33

Ésto es lo que tenemos hasta ahora.

Paso 34

Selecciona todos los grupos que usamos para dibujar una mujer y colócalos justo debajo del grupo "bar table", y arriba del grupo "bar stool".

7. Crea un Cigarro

Paso 1

Usa la herramienta Rectangle (R) para crear un cigarro. Primero dibuja un rectángulo blanco (#FFFFFF).

Paso 2

Presiona Enter para ingresar al modo de edición de forma, selecciona el punto superior derecho, y muévelo un poco hacia abajo.

Paso 3

Duplica (Comando-D) éste rectángulo, cambia el color a #F8AAF53, y hazla verticalmente más pequeño, como se muestra en la imagen de abajo, para crear un filtro.

Paso 4

Dibuja un pequeño rectángulo en la parte inferior de la forma del cigarro, para crear ceniza de cigarro, y establece el color en #324249.

Paso 5

Selecciona todas las formas, pónlos en el grupo "cigarette", y Rótalo 48^° y colócalo entre los dedos como se muestra en la imagen de abajo.

Paso 6

Toma la herramienta Vector (V) y dibuja humo de cigarro.

Paso 7

Haz click en Fill (Relleno) en el Inspector Panel y elige Linear Gradient (Degradado Lineal). Establece la detención de color izquierdo en #F0F0F0 y de la detención derecha en #C6E8F6. Disminuye la Opacity (Opacidad) en 80%.

8. Pon una Taza de Café en la Mesa

Paso 1

Toma la herramienta Rectangle (R) y dibuja un plato. Utiliza #FFFFFF para el color.

Paso 2

A continuación, crea la forma de una taza con la herramienta Rectangle (R). Haz doble-click en la forma de la taza para ingresar en el modo de edición de forma, selecciona ambos puntos inferiores, y cambia Corners (Vértices) a 8.

Paso 3

Dibuja un diminuto rectángulo cerca de la parte superior. Para el color, usa #FBD5A3.

Paso 4

En seguida, haremos la asa de la taza. Toma la herramienta Oval (O) y crea un círculo.

Paso 5

Duplica (Comando-D) éste círculo, escálalo hacia abajo un poco, y cambia el color a cualquier otro.

Paso 6

Selecciona ambos círculos y elige Subtract (Restar) de la barra de herramientas superior. Coloca ésta forma detrás de la forma de la taza.

Paso 7

Al final, cambia el color de la asa a #FFFFFF.

Paso 8

Selecciona todas las formas que conforman la taza de café, agrúpalas (Comando-G), dále el nombre "coffee", y coloca éste grupo justo debajo de la forma "left hand" en la Layers List (Lista de Capas).

9. Crea una Bufanda

Paso 1

Creemos fragmento de bufanda al aire que va detrás del cuello. Toma la herramienta Vector (V) y dibuja la forma de una bufanda. Para el color, utiliza #F7EADF.

Paso 2

Usa la herramienta Vector (V) y dibuja una forma como la de la imagen de abajo.

Paso 3

Cambia Fill (Relleno) a Linear Gradient (Degradado Lineal). Para la detención de color superior, usa #8C8C8C, y para la inferior #CEC0C0.

Paso 4

Dibuja otra forma usando la herramienta Vector (V), sobre la forma de la bufanda. Usa Linear Gradient (Degradado Lineal) para el Fill (Relleno). Establece la detención de color izquierda en #FFEEE0 y la derecha en #C8B6B5.

Paso 5

Selecciona la forma de la bufanda y ambas formas que acabamos de crear, y haz click en Mask (Máscara) en la barra de herramientas superior.

Paso 6

Ahora coloca éste justo debajo del grupo "neck" en la Layers List (Lista de Capas).

10. Realza la Ilustración al Añadir Sombras

Agreguemos sombras a nuestra ilustración para hacerla más intrincada y detallada.

Paso 1

Toma la herramienta Rectangle (R) y dibuja una forma como se muestra en la imagen de abajo: Cambia el Fill (Relleno) a Linear Gradient (Degradado Lineal). Para la detención de color izquierda, elige #9C9C9C, y para la de la derecha #000000.

Paso 2

Disminuye la Opacity (Opacidad) a 40%, y mueve ésta capa justo debajo de la forma "left arm".

Paso 3

Usando el mismo método, crea la primera sombra debajo de la mesa. Crea un Linear Gradient (Degradado Lineal) usando #000000 para la detención de color superior, y #9C9C9C para la detención de color inferior.

Paso 4

Establece la Opacity (Opacidad) en 40%, y coloca ésta forma justo debajo del grupo "bar table".

Paso 5

Luego crea una segunda sombra debajo de la mesa. De nuevo, establece el Fill (Relleno) en Linear Gradient (Degradado Lineal), establece la detención de color superior en #000000, y la detención de color inferior en #9C9C9C.

Paso 6

Ésta vez, disminuye la Opacity (Opacidad) a 20%.

Paso 7

En seguida, agrega una sombra justo sobre el asiento del taburete y debajo de la mujer, tal y como lo hicimos en los pasos previos.

Paso 8

Disminuye la Opacity (Opacidad) a 20% y coloca ésta forma sobre el grupo "bar stool" y debajo del grupo "collar dress".

Paso 9

Toma la herramienta Vector (V) y crea una sombra debajo del zapato y sobre la pata del taburete. Elige Linear Gradient (Degradado Lineal) para el Fill (Relleno). Usa #000000 para la detención de color superior y #C5BAB5 para la detención de color inferior.

Paso 10

Establece la Opacity (Opacidad) en 30% y mueve ésta forma sobre el grupo "bar stool".

Paso 11

Crearemos la última sombra detrás del grupo "bar stool". Usa la herramienta Vector (V) para crear ésta sombra. Una vez más, elige Linear Gradient (Degradado Lineal) para el Fill (Relleno). Para la detención de color superior, utiliza #000000, y para la detención de color inferior, usa #F2F2F2.

Paso 12

Disminuye la Opacity (Opacidad) a 10%, y colócalo en la Layers List (Lista de Capas) justo arriba del grupo "terrace".

Paso 13

Ésto es lo que tenemos hasta ahora, después de agregar las sombras.

11. Pasos Finales: Agrega el Sol y las Nubes

Paso 1

Creemos primero el sol. Toma la herramienta Oval (O) y dibuja un círculo. Usa #F8E71C para el color.

Paso 2

Aplica Gaussian Blur (Desenfoque Gaussiano) con la Amount (Cantidad) de 1 px, usando el Inspector Panel de la derecha.

Paso 3

Creemos una nube sobre el sol. La mejor manera de crear una nube es combinar círculos y un rectángulo. Primero, dibuja cuatro círculos de diferentes tamaños que se superpongan usando la herramienta Oval (O). Usa el color #FFFFFF para el Fill (Relleno).

Paso 4

Usa la herramienta Rectangle (R) y dibuja un rectángulo blanco (#FFFFFF).

Paso 5

Selecciona círculos y rectángulos, ve a Arrange (Organizar) > Align Object (Alinear Objeto) > Bottom (Abajo) para alinear cada elemento con la parte inferior. Luego combínalas usando Union de la barra de herramientas superior.

Paso 6

Duplica (Comando-D) la nube dos veces, escálala hacia abajo y colócala como se muestra en la imagen de abajo.

Paso 7

Selecciona la nube sobre la Torre Eiffel y disminuye la Opacity (Opacidad) a 45%.

¡Terminaste! ¡Debo decir que Estoy Sorprendido!

¡Magnífico trabajo-te has ganado un descanso para el café! Nuestra ilustración de estilo de vida Parisino está terminada. Espero que hayas logrado seguir cada paso del tutorial y aprendido algunos nuevos consejos y trucos. ¡Gracias por leer!