Cómo diseñar un gamepad realista

En este tutorial, aprenderá cómo crear una ilustración de un gamepad con la herramienta Pluma, Gradientes y Filtros. Puede usar esta ilustración como base de un icono o para un elemento decorativo en un diseño más grande.


Paso 1: Primera Forma

Abra un nuevo documento RGB con las dimensiones 600px por 400px. Elija la herramienta Rectángulo y cree un rectángulo con una dimensión de 328 px por 105 px, establezca el contorno en un color oscuro (R: 0, G: 0, B: 0) y rellénelo con un degradado similar como se muestra a continuación.


Paso 2: Agregando Formas

Con la herramienta Rectángulo, cree la siguiente forma con las dimensiones 38px por 26px, configure el contorno a un color oscuro (R: 0, G: 0, B: 0) y rellénelo con un degradado similar.


Paso 3: Más construcción de formas y gradientes

Cree una forma como la de abajo y configure el contorno en un color oscuro (R: 75, G: 78, B: 93) [Ilustración 1]. Refleja la forma recién creada [Pic.2]. Mueva las dos formas juntas, seleccione los puntos finales en la parte superior con la herramienta Selección directa y luego únalos. Repita lo mismo para los puntos inferiores [Pic.3]. Rellena la nueva forma con un degradado [Pic.4].


Paso 4: Trabajar con elipses y brillo interior

Elija la herramienta Elipse y cree dos elipsis con dimensiones: 140 px por 120 px y 95 px por 80 px [Pic.1]. Abra un Panel de Pathfinder, seleccione ambos puntos suspensivos y haga clic en el botón Unir [Pic.2]. Rellene la nueva forma con un degradado similar [Pic.3]. Ahora ve a Filter> Stylize> Inner Glow [Pic.4].


Paso 5: Crear el área del controlador izquierdo

Cree una forma como abajo [Pic.1] y rellénela con un degradado lineal [Pic.2]. En el siguiente paso, vaya a Filtro> Estilizar y use Resplandor interno [Pic.3]. Ahora haga clic en esta forma con el botón derecho del ratón y vaya a Organizar> Enviar hacia atrás [Imagen 4]


Paso 6: Añadir otra forma más grande

Cree una forma similar [Pic.1], rellénela con un degradado lineal [Pic.2] y vaya a Organizar> Enviar hacia atrás [Pic.3]


Paso 7: Añadir detalles de forma

Cree la siguiente forma similar [Pic.1], configure el contorno a negro (R: 0, G: 0, B: 0) y rellénelo con un degradado [Pic.2]


Paso 8: Crear un botón superior

Crea una forma como abajo [Pic.1]. Refleja la forma recién creada [Pic.2]. Mueva las dos formas juntas y seleccione los puntos finales en la parte superior con la herramienta Selección directa, y luego únalos. Repita lo mismo para los puntos inferiores [Pic.3]. Rellene la nueva forma con un degradado [Imagen 4], luego vaya a Filtro> Estilizar> Resplandor interior [Imagen 5], y vaya a Organizar> Enviar hacia atrás [Imagen 6]


Paso 9: Agregar una redondez suave

Elija la herramienta Elipse y cree dos elipsis con dimensiones: 132px por 110px y 90px por 75px [Pic.1]. Abra el Panel de Pathfinder, seleccione ambos puntos suspensivos y haga clic en el botón Unir [Pic.2]. Rellene la nueva forma con un degradado similar [Imagen 3] y luego vaya a Filtro> Estilizar> Resplandor interior [Imagen 4].


Paso 10: Agregar un controlador izquierdo

Elija la herramienta Elipse y cree una elipse con las dimensiones 60px por 50px y rellénela con negro [Pic.1]. Luego cree otra elipse con las dimensiones 55px por 45px y rellene esta forma con un color oscuro (R: 75, G: 78,0 B: 93) [Pic.2].


Paso 11: Área Cruzada

Elija la herramienta Pluma y cree una forma de cruz como la de [Pic.1] y rellénela con un Gradiente lineal [Pic.2]. Vaya a Efecto> Estilizar> Esquinas redondeadas y establezca el radio en 3px [Imagen 3], y luego vaya a Efecto> Estilizar> Resplandor interior [Imagen 4]


Paso 12: Refleja a la derecha

Elija la herramienta de selección y seleccione estas formas [Pic.1], y duplíquelas [Pic.2]. Luego vaya a Transformar> Reflejar (vertical) [Imagen 3] y colóquelos a la derecha como se muestra [Imagen 4].


Paso 13: Comience a agregar detalles del botón

Cree una elipse con las dimensiones 29px por 26px [Pic.1] y rellénela con un Gradiente lineal [Pic.2]. En el siguiente paso, vaya a Efecto> Estilizar> Resplandor interior [Pic.3], y vaya a Efecto> Estilizar> Sombra paralela [Pic.4]. Luego duplique esta elipse modificada tres veces y colóquela como se muestra [Foto 5].


Paso 14: Agregar detalles del botón en la izquierda

Elija la herramienta Pluma y cree la forma que se muestra en [Pic.1], rellénela con un degradado lineal [Pic.2] y agregue los efectos de Resplandor interior [Pic.3] y Sombra paralela [pic.4].


Paso 15: Añadir una flecha

Cree un triángulo con la herramienta Pluma, rellénelo con un color (R: 75, G: 78, B: 93) [Pic.1], y vaya a Efecto> Estilizar> Resplandor exterior [Pic.2]


Paso 16: Duplica los controles del juego

Elija la herramienta de selección y seleccione estas formas [Pic.1], y duplíquelas. Luego haga clic en el botón derecho del mouse y vaya a Transformar> Girar y establezca el ángulo a 180 grados [Pic.2]. En el siguiente paso, seleccione estas formas, duplíquelas y gire las copias como se muestra (ajuste el ángulo a 90 grados) [Pic.3]


Paso 17: Reorganizar las formas

Elija la herramienta de selección y seleccione "shape 1" [Pic.1], muévala 3px hacia abajo, luego seleccione "shape 2" [Pic.1] y muévala hacia la derecha 8px. Mueva "shape 3" a la derecha 3px, "shape 5" a la izquierda 8px y "shape 4" a la izquierda 3px. Debería verse similar a esta imagen [Foto 2]..


Paso 18: agregar brillo interno a los controles inferiores

Elija la herramienta de selección y seleccione la elipse [Imagen 1], use los efectos Resplandor interior [Imagen 2] y Sombra [Imagen 3]. Luego, seleccione la siguiente elipse y agregue Resplandor interno [Imagen 4] y Sombra caída [Imagen 5].


Paso 19: Añadir otra elipse

Elija la herramienta Elipse y cree una elipse con dimensiones de 30 px por 25 px [foto.1], rellénela con un degradado lineal [pic.2] y añada un efecto de brillo interior [pic.3].


Paso 20: Más pequeños detalles

Elija la herramienta Rectángulo y cree un rectángulo con las dimensiones 18px por 10px [Pic.1], rellénelo con un degradado lineal [Pic.2] y agregue un Efecto de Sombra paralela [Pic.3].


Paso 21: Agrega un triángulo pequeño

Elija la herramienta Pluma y cree una forma similar [Pic.1], rellénela con un degradado lineal [Pic.2] y agregue el efecto Sombra paralela [Pic.3].


Conclusión

Como puedes ver, he añadido algunos símbolos. Con un poco de edición, esta ilustración se puede utilizar para una variedad de diseños que incluyen sitios web, carteles y mucho más. Espero que disfrutes este tutorial.