En el siguiente tutorial, aprenderá a crear un conjunto atractivo de iconos de emoticonos. Aprenda un flujo de trabajo fácil de seguir para crear cada una de estas pequeñas caras emocionales en Adobe Illustrator.
Cree un documento RGB de 60 px por 60 px. Primero, active la cuadrícula (Ver> Cuadrícula) y la función Ajustar a la cuadrícula (Ver> Ajustar a la cuadrícula). A continuación, necesitará una cuadrícula cada 1px. Vaya a Edición> Preferencias> Guías y cuadrícula, ingrese 1 en la cuadrícula de cada cuadro y 1 en el cuadro de subdivisiones.
También puede abrir el panel Información (Ventana> Información) para obtener una vista previa en vivo con el tamaño y la posición de sus formas. No olvide reemplazar la unidad de medida por píxeles en Editar> Preferencias> Unidad> General. Todas estas opciones aumentarán significativamente tu velocidad de trabajo..
Elija la herramienta Elipse (L), cree una forma de 40 por 40 px y llénela con R = 255, G = 222, B = 23.
Seleccione la forma creada en el paso anterior y asegúrese de que esté colocada en el centro de su mesa de trabajo. Active las Reglas (Comando + R) y las Guías (Ver> Guías> Mostrar Guías), luego arrastre una guía vertical y horizontal como se muestra en la siguiente imagen. Desactive las reglas y mantenga las guías visibles. Lo ayudará en los siguientes pasos, a medida que agregue algunas nuevas formas..
Desactive la función Ajustar a la cuadrícula, luego vaya a Edición> Preferencias> General e ingrese 0.5 en el cuadro Incremento del teclado. Vuelva a seleccionar el círculo amarillo y haga dos copias al frente (Comando + C> Comando + F> Comando + F). Seleccione la copia superior y presione la flecha hacia abajo una vez (para moverla 0.5px hacia abajo). Vuelva a seleccionar ambas copias y haga clic en el botón Frontal Frontal del panel de Pathfinder. Rellena la forma resultante con blanco..
Vuelva a habilitar el ajuste a la cuadrícula. Vuelva a seleccionar el círculo amarillo y vaya al panel Apariencia. Seleccione el relleno existente y haga clic en el botón Duplicar elemento seleccionado ubicado en la parte inferior del panel Apariencia. Obviamente, esto creará una copia del relleno seleccionado. Seleccione este nuevo relleno, baje su opacidad al 75% y rellénelo con el degradado lineal que se muestra en la siguiente imagen.
Presta atención a la imagen del degradado. El "0" amarillo representa el porcentaje de opacidad. Esto significa que debe seleccionar el control deslizante de degradado y disminuir su opacidad al 0%. Sigue enfocándote en este círculo amarillo. Vuelva a seleccionarlo y añada un simple trazo. Hazlo de 1 pt de ancho, alinéalo con el exterior y establece su color en R = 237, G = 147, B = 39.
Vuelva a seleccionar la forma editada en el paso anterior. Vaya al panel Apariencia, seleccione el relleno amarillo y vaya a Efecto Estilizar> Resplandor interior. Ingrese los datos que se muestran a continuación, haga clic en Aceptar y luego vaya a Efecto> Estilizar> Sombra. De nuevo, ingrese los datos que se muestran a continuación y haga clic en Aceptar. Al final, su forma debe verse como la siguiente imagen. Esta será la forma de la cara que usarás para la mayoría de los emoticonos.
Ahora, vamos a añadir un estado de ánimo para esta cara. Primero, vuelva a habilitar el ajuste a la cuadrícula, luego seleccione la herramienta Rectángulo (M). Cree dos formas de 4 por 8 píxeles y una forma de 12 por 8 píxeles, luego colóquelas como se muestra.
The Snap to Grid y las Guías facilitarán su trabajo. Llénelos todos con R = 96, G = 57, B = 19, luego vaya a Efecto> Estilizar> Esquinas redondeadas. Ingrese un radio de 2px, haga clic en Aceptar, luego vaya a Efecto> Estilizar> Sombra. Ingrese los datos que se muestran a continuación y haga clic en Aceptar.
Elija la herramienta Elipse (L), cree una forma de 26 por 16 píxeles y colóquela como se muestra. Rellénelo con el gradiente lineal que se muestra a continuación, luego baje su Opacidad al 50%. Ahora, vamos a organizar las formas existentes..
Vaya al panel Capas, seleccione la capa existente y haga clic en el botón Crear nueva subcapa en la parte inferior del panel Capas. Seleccione todas las formas creadas hasta ahora y muévalas dentro de esta nueva subcapa. Haz doble clic en esta subcapa y llámala "No está entretenida". Ahora tu primer emoticon esta completo.
Seleccione la subcapa creada en el paso anterior y haga una copia al frente. Concéntrese en esta nueva subcapa, seleccione la forma de la boca y vaya a Efecto> Warp> Arc. Ingrese los datos que se muestran debajo de la imagen # 1 y haga clic en Aceptar.
Nombre esta segunda subcapa "Triste" y duplíquela. Seleccione la forma de la boca de esta nueva subcapa, luego vaya al panel Apariencia y abra el efecto de deformación existente. Arrastre el control deslizante Doblar a -50%, luego haga clic en Aceptar. Nombra esta tercera subcapa "Feliz".
Seleccione la subcapa "Feliz" y haga una copia al frente. Centrémonos en esta subcapa fresca. Primero, cámbiele el nombre a "Grin", luego seleccione la forma de boca de salida y elimínela. Elija la herramienta Elipse (L), cree una forma de 16 x 7 píxeles y colóquela como se muestra en la primera imagen. Rellénelo con R = 96, G = 57, B = 19. Luego ve a Efecto> Deformación> Arco. Ingrese los datos que se muestran a continuación, haga clic en Aceptar, luego vaya a Objeto> Expandir apariencia.
Seleccione la forma resultante y haga dos copias al frente, luego desactive la función Ajustar a la cuadrícula. Seleccione la copia superior y presione la flecha hacia abajo cuatro veces, luego vuelva a seleccionar ambas copias y haga clic en el botón Frontal Inferior del panel de Pathfinder. Rellena la forma resultante con blanco..
Vuelva a habilitar el ajuste a la cuadrícula. Elija la herramienta Pluma (P), dibuje tres trayectorias verticales y colóquelas como se muestra en la primera imagen. Agregue un trazo de 1 punto para estas rutas y establezca su color en R = 39, G = 170, B = 225.
Agruparlos (Comando + G). Seleccione la forma blanca creada en el paso anterior, haga una copia y llévela al frente (Shift> Command + Right Bracket key). Seleccione esta forma fresca y blanca junto con el grupo nuevo y vaya al panel Transparencia. Abra el menú desplegable y haga clic en Crear máscara de opacidad..
Vuelva a seleccionar la forma de la boca y vaya a Efecto> Estilizar> Sombra. Ingrese los datos que se muestran a continuación, haga clic en Aceptar y luego agregue un trazo de 1 pt. Alinéelo al exterior y establezca su color en R = 237, G = 147, B = 39.
Seleccione la subcapa "Grin" y haga una copia al frente. Centrémonos en esta subcapa fresca. Primero, cámbiele el nombre a "Guiño", luego seleccione la forma del ojo derecho y elimínela. Elija la herramienta Rectángulo (M), cree una forma de 5 por 3px y colóquela como se muestra.
Rellénelo con R = 96, G = 57, B = 19. Luego ve a Efecto> Estilizar> Esquinas redondeadas. Ingrese un radio de 2px, haga clic en OK, luego vaya a Efecto> Warp> Arc. Ingrese los datos que se muestran a continuación, haga clic en Aceptar y luego vaya a Efecto> Estilizar> Sombra. Una vez más, ingrese los datos que se muestran a continuación y haga clic en Aceptar.
Seleccione la subcapa "Guiño" y haga una copia al frente. Centrémonos en esta subcapa fresca. Primero, cámbiele el nombre a "Llorando", luego seleccione los ojos y los componentes de la boca y elimínelos. Elija la herramienta Rectángulo (M), cree dos formas de 6 por 4px y colóquelas como se muestra en la siguiente imagen. Rellénelos con R = 96, G = 57, B = 19. Luego ve a Efecto> Estilizar> Esquinas redondeadas. Ingrese un radio de 2px, haga clic en OK, luego vaya a Efecto> Warp> Arc. Ingrese los datos que se muestran a continuación, haga clic en Aceptar y luego vaya a Objeto> Expandir apariencia.
Seleccione la forma del ojo izquierdo y vaya a Objeto> Transformar> Rotar. Ingrese un ángulo de 45 grados, luego haga clic en Aceptar. Seleccione la forma del ojo derecho y vaya a Objeto> Transformar> Girar. Ingrese un ángulo de -45 grados, luego haga clic en Aceptar. Vuelva a seleccionar las formas de ambos ojos y vaya a Efecto> Estilizar> Sombra. Ingrese los datos que se muestran en la imagen final, luego haga clic en Aceptar.
Sigue enfocándote en la subcapa "Llorona". Elija la herramienta Elipse (L), cree una forma de 16 por 7px y colóquela como se muestra. Rellénelo con R = 96, G = 57, B = 19, y vaya a Efecto> Warp> Arch. Ingrese los datos que se muestran a continuación, haga clic en Aceptar, luego vaya a Objeto> Expandir apariencia.
Seleccione la forma resultante, haga dos copias al frente y desactive la función Ajustar a la cuadrícula. Selecciona la copia superior y pulsa la flecha hacia arriba diez veces. Vuelva a seleccionar ambas copias y haga clic en el botón Intersectar del panel de Pathfinder. Rellena la forma resultante con blanco..
Vuelva a habilitar el ajuste a la cuadrícula. Elija la herramienta Pluma (P), dibuje tres trayectorias verticales y colóquelas como se muestra en la primera imagen. Agregue un trazo de 1 punto para estas rutas y establezca su color en R = 39, G = 170, B = 225. Agruparlos (Comando + G). Seleccione la forma blanca creada en el paso anterior, haga una copia y llévela al frente (Shift> Command + Right Bracket key). Seleccione esta forma fresca y blanca junto con el grupo nuevo y vaya al panel Transparencia. Abra el menú desplegable y haga clic en Crear máscara de opacidad..
Vuelva a seleccionar la forma de la boca y vaya a Efecto> Estilizar> Sombra. Ingrese los datos que se muestran a continuación, haga clic en Aceptar y luego agregue un trazo de 1 pt. Alinéelo al exterior y establezca su color en R = 237, G = 147, B = 39.
Elija la herramienta Elipse (L), cree una forma de 4 por 4px y rellénela con R = 39, G = 170, B = 255. Elija la herramienta Convertir punto de anclaje (Mayús + C) y haga clic en el punto de anclaje inferior. Esto hará que tu círculo se vea como en la segunda imagen. Elija la herramienta de selección directa (A), seleccione el punto de anclaje inferior y muévalo 2px hacia abajo. Ahora, enfócate en los puntos de anclaje izquierdo y derecho. Usa la misma herramienta para arrastrar los controles 1px hacia abajo.
Seleccione la forma creada en el paso anterior y vaya a Efecto> Deformar> Arco. Ingrese los datos que se muestran a continuación, haga clic en Aceptar, luego vaya a Objeto> Expandir apariencia. Duplica la forma resultante. Gire estas dos formas azules y colóquelas como se muestra. Finalmente, agregue un trazo de 0.5 pts para ambas formas. Alinéelo al interior y establezca su color en R = 28, G = 117, B = 188.
Seleccione la subcapa "Feliz", haga una copia y muévala a la parte superior del panel Capa. Centrémonos en esta subcapa fresca. Primero, renómbrelo como "Amor", luego seleccione las formas de los ojos y elimínelas. Vaya al panel Símbolos (Ventana> Símbolos), abra el menú desplegable y vaya a Abrir biblioteca de símbolos> Iconos web. Se abrirá una ventana con un conjunto de símbolos..
Seleccione el símbolo "Favorito", arrástrelo a su mesa de trabajo, luego vaya a Objeto> Expandir. Centrarse en la forma resultante. Primero, elija la Herramienta de selección directa (A), seleccione los puntos de anclaje resaltados en la segunda imagen y presione el botón Eliminar. Ahora, el corazón debe parecerse a la tercera imagen..
A continuación, debe agregar un efecto de redondez discreta para el punto de anclaje inferior. Necesitarás la secuencia de comandos Round Any Corner. Guárdelo en su disco duro, seleccione el punto de anclaje inferior con la Herramienta de selección directa (A), luego vaya a Archivo> Secuencias de comandos> Otras secuencias de comandos. Abra el script Round Any Corner, ingrese un radio de 7px y haga clic en Aceptar. Rellene la forma resultante con R = 242, G = 41, B = 17. Al final debería verse como la cuarta imagen..
Seleccione la forma hecha en el paso anterior y duplíquela. Seleccione estas dos formas de corazón, cambie su tamaño y colóquelas como se muestra. Ahora ve a Efecto> Estilizar> Sombra. Ingrese los datos que se muestran a continuación, haga clic en Aceptar y luego agregue un trazo de 0.75 puntos. Alinéelo al interior y establezca su color en R = 190, G = 30, B = 45.
Seleccione la subcapa "Love" y haga una copia al frente. Centrémonos en esta subcapa fresca. Primero, cámbiele el nombre a "Sorpresa", luego seleccione los componentes ojo y boca y elimínelos. Elija la herramienta Rectángulo (M), cree una forma de 10 por 5 píxeles y colóquela como se muestra en la siguiente imagen. Rellénelo con R = 96, G = 57, B = 19. Luego ve a Efecto> Estilizar> Esquinas redondeadas. Ingrese un radio de 3px, haga clic en Aceptar, luego vaya a Efecto> Estilizar> Sombra. Ingrese los datos que se muestran a continuación y haga clic en Aceptar.
Elija la herramienta Elipse (L), cree dos formas de 8 por 8 píxeles y colóquelas como se muestra en la primera imagen. Rellénelos con R = 241, G = 242, B = 242 y agregue un trazo de 1 pt. Alinéelo al exterior y establezca su color en R = 237, G = 147, B = 39.
Vuelva a seleccionar ambos círculos y vaya a Efecto> Estilizar> Sombra. Ingrese los datos que se muestran en la primera imagen y haga clic en Aceptar. Nuevamente, elija la herramienta Ellipse (L) y cree dos formas de 2 por 2px. Rellénelos con R = 96, G = 57, B = 19, y colóquelos como se muestra en la segunda imagen.
Elija la herramienta Pluma (P), dibuje dos trayectorias verticales (6px de altura) y colóquelas como se muestra en la siguiente imagen. Agregue un trazo de 1 punto para ambas rutas, establezca el color en R = 237, G = 147, B = 39, y vaya al panel Trazo (Ventana> Trazo).
Haga clic en el botón Round Cap, luego vaya a Efecto> Estilizar> Sombra. Ingrese los datos que se muestran a continuación, haga clic en Aceptar, luego seleccione solo la ruta de la izquierda. Vaya a Efecto> Deformación> Arco, ingrese los datos que se muestran a continuación, haga clic en Aceptar y luego seleccione la ruta correcta. Una vez más, vaya a Efecto> Warp> Arc, ingrese los datos que se muestran a continuación, luego haga clic en OK.
Seleccione la subcapa "Love", haga una copia y muévala en la parte superior del panel Capas. Centrémonos en esta subcapa fresca. Primero, cámbiele el nombre a "Blushing", luego seleccione los componentes del ojo y elimínelos. Elija la herramienta Rectángulo (M), cree dos formas de 4 por 6 píxeles y colóquelas como se muestra en la siguiente imagen. Rellénelos con R = 96, G = 57, B = 19, luego vaya a Efecto> Estilizar> Esquinas redondeadas. Ingrese un radio de 2px, haga clic en Aceptar, luego vaya a Efecto> Estilizar> Sombra. Ingrese los datos que se muestran a continuación y haga clic en Aceptar.
Elija la herramienta Pluma (P), dibuje dos trayectorias horizontales (4px de largo) y colóquelas como se muestra en la siguiente imagen. Agregue un trazo de 1 punto para ambas rutas, establezca el color en R = 96, G = 57, B = 19, y vaya al panel Trazo. Haga clic en el botón Round Cap, luego vaya a Efecto> Estilizar> Sombra. Ingrese los datos que se muestran a continuación, haga clic en Aceptar, luego vaya a Efecto> Urdimbre> Arco. De nuevo, ingrese los datos que se muestran a continuación y haga clic en Aceptar.
Elija la herramienta Elipse (L), cree dos formas de 5 por 5 píxeles y colóquelas como se muestra. Rellénelos con R = 237, G = 28, B = 36, y vaya a Efecto> Desenfoque> Desenfoque gaussiano. Ingrese un radio de 2px y haga clic en OK.
Seleccione la subcapa "Blushing" y haga una copia al frente. Centrémonos en esta subcapa fresca. Primero, renómbrelo como "Enfermo", luego elimine los componentes de los ojos y la boca. Ahora, necesitas cambiar el color de toda la cara..
Vaya al panel Apariencia y céntrese en el primer relleno. Reemplace el amarillo con R = 171, G = 223, B = 35, luego abra el efecto Resplandor interno y reemplace el color existente con el que se muestra a continuación. Vaya al segundo relleno y reemplace el degradado existente por el que se muestra. Finalmente, seleccione el trazo y reemplace el color existente con R = 57, G = 181, B = 74.
Continuemos con los ojos. Elija la herramienta Rectángulo (M), cree dos formas de 4 por 8 píxeles y colóquela como se muestra en la siguiente imagen. Rellénelos con R = 0, G = 104, B = 56, luego vaya a Efecto> Estilizar> Esquinas redondeadas. Ingrese un radio de 2px, haga clic en Aceptar, luego vaya a Efecto> Estilizar> Sombra. Ingrese los datos que se muestran a continuación y haga clic en Aceptar.
Elija la herramienta Pluma (P), dibuje dos trayectorias verticales (6px de altura) y colóquelas como se muestra en la siguiente imagen. Agregue un trazo de 1 punto para ambas rutas, establezca el color en R = 0, G = 104, B = 56, y vaya al panel Trazo (Ventana> Trazo). Haga clic en el botón Round Cap, luego vaya a Efecto> Estilizar> Sombra. Ingrese los datos que se muestran a continuación, haga clic en Aceptar, luego seleccione solo la ruta de la izquierda. Vaya a Efecto> Deformación> Arco, ingrese los datos que se muestran a continuación, haga clic en Aceptar y luego seleccione la ruta correcta. De nuevo, vaya a Efecto> Warp> Arc, ingrese los datos que se muestran a continuación y haga clic en OK.
Elija la herramienta Rectángulo (M), cree una forma de 6 por 4px y colóquela como se muestra en la siguiente imagen. Llénelo con R = 0, G = 104, B = 56, luego vaya a Efecto> Estilizar> Esquinas redondeadas. Ingrese un radio de 2px, haga clic en Aceptar, luego vaya a Efecto> Estilizar> Sombra. Ingrese los datos que se muestran a continuación y haga clic en Aceptar.
Una vez más, elija la herramienta Pluma (P), dibuje dos trayectorias verticales (6px de altura) y colóquelas como se muestra. Agregue un trazo de 1 punto para ambas rutas, establezca el color en R = 0, G = 104, B = 56, y vaya al panel Trazo (Ventana> Trazo). Haga clic en el botón Round Cap, luego vaya a Effect> Stylize> Drop Shadow.
Ingrese los datos que se muestran a continuación, haga clic en Aceptar, luego seleccione solo la ruta de la izquierda. Vaya a Efecto> Deformación> Arco, ingrese los datos que se muestran a continuación, haga clic en Aceptar. Ahora seleccione el camino correcto. De nuevo, vaya a Efecto> Warp> Arc, ingrese los datos que se muestran a continuación y haga clic en OK.
Seleccione la subcapa "Enferma" y haga una copia al frente. Centrémonos en esta subcapa fresca. Primero, renómbrelo como "Enojado", luego borre los componentes de los ojos y la boca. De nuevo, necesitas cambiar el color de toda la cara. Abajo tienes toda la información que necesitas..
Elija la herramienta Rectángulo (M), cree una forma de 12 por 4px y colóquela como se muestra en la siguiente imagen. Llénelo con R = 60, G = 36, B = 21, luego vaya a Efecto> Estilizar> Esquinas redondeadas. Ingrese un radio de 2px, haga clic en Aceptar, luego vaya a Efecto> Estilizar> Sombra. Ingrese los datos que se muestran a continuación y haga clic en Aceptar.
Continuemos con los ojos. Elija la herramienta Rectángulo (M), cree dos formas de 4 por 8 píxeles y colóquela como se muestra en la siguiente imagen. Rellénelos con R = 60, G = 36, B = 21, luego vaya a Efecto> Estilizar> Esquinas redondeadas. Ingrese un radio de 2px, haga clic en Aceptar, luego vaya a Efecto> Estilizar> Sombra. Ingrese los datos que se muestran a continuación y haga clic en Aceptar.
Elija la herramienta Pluma (P), dibuje las dos rutas que se muestran a continuación y colóquelas como se muestra en la siguiente imagen. Agregue un trazo de 1 punto para ambas rutas, establezca el color en R = 0, G = 104, B = 56, y vaya al panel Trazo (Ventana> Trazo). Haga clic en el botón Round Cap, luego vaya a Efecto> Estilizar> Sombra. Ingrese los datos que se muestran a continuación y haga clic en Aceptar.
Elija la herramienta Rectángulo (M), cree una forma de 2 por 5px y rellénela con R = 0, G = 104, B = 56. Elija la Herramienta de selección directa (A), seleccione los puntos de anclaje inferiores y vaya a Objeto> Ruta> Promedio. Marque ambos y haga clic en Aceptar. Esto convertirá tu rectángulo en un triángulo bastante afilado. Selecciónelo y vaya a Efecto> Estilizar> Esquinas redondeadas. Ingrese un radio de 1px, haga clic en Aceptar, luego haga tres copias. Gíralos y colócalos como se muestra en la imagen final..
El conjunto de iconos de los emoticones finales está abajo..