Share
Lo que vas a crearEn el tutorial de hoy, vamos a observar de cerca el proceso de creación de un paquete de íconos particularmente interesante, ya que vamos a ilustrar algunos objetos tradicionales rumanos que son la definición viva de lo que “hogar” había vuelto antes de lo digital. años. Como siempre, vamos a utilizar y abusar de las formas geométricas de Illustrator, en combinación con algunas herramientas básicas como el panel Alinear y el buscador de rutas..
Dicho esto, toma un nuevo lote de café y vamos a bucear!
Además, si está buscando expandir el proyecto, puede hacerlo dirigiéndose a GraphicRiver y comprobando algunos de sus íconos con temas caseros..
Ya que espero que ya tenga Illustrator funcionando en segundo plano, créelo y configuremos un Nuevo documento (Archivo> Nuevo o Control-N) usando los siguientes ajustes:
Y desde el Avanzado lengüeta:
Ya que vamos a crear los íconos utilizando un flujo de trabajo de píxeles perfectos, queremos configurar un poco Cuadrícula Para que podamos tener control total sobre nuestras formas..
Ve a la Edición> Preferencias> Guías y cuadrícula submenú, y ajustar las siguientes configuraciones:
Consejo rapido: puede aprender más acerca de las cuadrículas leyendo este detallado artículo sobre cómo funciona el sistema de cuadrículas de Illustrator..
Una vez que hemos configurado nuestra cuadrícula personalizada, todo lo que tenemos que hacer para asegurarnos de que nuestras formas se vean nítidas es habilitar la Encajar a la cuadricula opción encontrada bajo el Ver menú, que se transformará en Ajustar a Pixel cada vez que entras Vista previa de píxeles modo.
Ahora, si eres nuevo en todo el "flujo de trabajo de píxeles perfectos", te recomiendo que sigas mi tutorial de creación de ilustraciones de píxeles perfectos, que te ayudará a ampliar tus habilidades técnicas en poco tiempo..
Con el Nuevo documento creado, sería una buena idea estructurar nuestro proyecto utilizando un par de capas, ya que de esta manera podemos mantener un flujo de trabajo constante al concentrarnos en un ícono a la vez..
Dicho esto, trae la Capas y cree un total de cuatro capas, a las que cambiaremos el nombre de la siguiente manera:
losLas cuadrículas de referencia (o cuadrículas de base) son un conjunto de superficies de referencia delimitadas con precisión, que nos permiten construir nuestros iconos al enfocarnos en el tamaño y la consistencia..
Por lo general, el tamaño de las cuadrículas determina el tamaño de los íconos reales, y siempre deben ser la primera decisión que tomes al comenzar un nuevo proyecto, ya que siempre querrás comenzar desde el tamaño más pequeño posible y construir sobre eso..
Ahora, en nuestro caso, vamos a crear el paquete de iconos utilizando un solo tamaño, más exactamente 128 x 128 px, que es bastante grande.
Comience por bloquear todas las capas excepto las "rejillas de referencia", y luego tome la Herramienta Rectangular (M) y crea un 128 x 128 px naranja (# F15A24) cuadrado, que ayudará a definir el tamaño total de nuestros iconos.
Añadir una más pequeña 120 x 120 px uno (#FFFFFF) que actuará como nuestra área de dibujo activa, dándonos así una 4 px relleno.
Agrupe los dos cuadrados que componen la cuadrícula de referencia usando el Control-G teclado y luego cree tres copias a una distancia de 40 px unos de otros, asegurándose de alinearlos al centro de la Mesa de trabajo.
Una vez que haya terminado, bloquee la capa actual y pase a la siguiente donde comenzaremos a trabajar en nuestro primer icono.
La flauta de pan, también conocida como panpipes, es un instrumento musical simple pero interesante que se remonta a los antiguos griegos. Toma su nombre de Pan, el dios de la naturaleza y protector de los pastores. El nombre en sí mismo es un derivado de la palabra "paein" que significa "pastar", que es probablemente la razón por la cual tantas culturas, incluida la mía, han asociado el instrumento con el acto de pastoreo..
Para mí, este pequeño objeto tiene un significado especial, ya que logra llevarme a un lugar y un momento en que la vida era más sencilla y el hogar no era solo el lugar, sino la gente que lo hacía..
Ahora, sin perder más tiempo, asegúrese de estar en la capa correcta (esa sería la segunda) y comencemos el proyecto recreando.
Comience a trabajar en la sección superior de la flauta de pan, creando un 8 x 6 px rectángulo, el cual colorearemos usando # 899E47 y luego alinee con el borde superior del área de dibujo activa, posicionándolo a una distancia de 4 px desde su borde superior y 20 px de su izquierda.
Dale a la forma un contorno usando la Carrera método, creando una copia del mismo (Control-C) que pegaremos delante (Control-f) y luego ajustar cambiando su color a # 2B3249 y luego volteando su Llenar con su Carrera (Shift-X). Selecciona el Carreraes Peso a 4 px, seleccionando y agrupando ambas formas después usando la Control-G atajo de teclado.
Crea nueve copias de la forma que acabamos de agrupar (Control-C> Control-F nueve veces), y luego distribúyalos horizontalmente en el lado derecho del original, usando el Alinear Panel para que sus contornos terminen superpuestos..
Crea los tubos utilizando diez rectángulos (# A8755A-ver las dimensiones a continuación) con una 4 px contorno grueso (# 2B3249), que apilaremos horizontalmente uno junto al otro, agrupando (Control-G) y luego colocándolos debajo de los rectángulos más pequeños.
Añadir un 8 px amplio 4 px grueso Carrera línea# 2B3249) a la primera, cuarta y séptima sección inferior de la tubería, colocándola a una distancia de 2 px desde sus esquemas. Una vez que haya terminado, seleccione y agrupe todas las formas que tenemos hasta ahora usando el Control-G atajo de teclado.
Cree la sección horizontal que mantiene todos los tubos juntos utilizando un 92 x 16 px rectángulo# CE9D78) con un 4 px contorno grueso (# 2B3249), que agruparemos (Control-G) y luego alinee el centro con los tubos, colocándolo a una distancia de 12 px desde el borde superior del área de dibujo activa.
Comience a agregar detalles a la sección del paso anterior, creando la flor central usando ocho 2 x 2 px círculos (# 2B3249), que posicionaremos alrededor de otro 2 x 2 px uno (2B3249). Una vez que los tengas en su lugar, no olvides seleccionar y agrupar (Control-G) juntos para que no se separen por accidente.
Consejo rapido: Para el paso actual y siguiente te recomiendo que enciendas Vista previa de píxeles modo (Alt-Control-Y) ya que le dará la posibilidad de colocar cuidadosamente cada círculo como se ve en la imagen de referencia. Una vez que haya terminado, salga del modo presionando Alt-Control-Y otra vez.
Comience a trabajar en el patrón de onda decorativo izquierdo usando un par de 2 x 2 px círculos (# 2B3249), que posicionaremos como se ve en la imagen de referencia. Una vez que hayas terminado, selecciona y agrupa (Control-G) todos los círculos juntos antes de pasar al siguiente paso.
Termine el ícono actual agregando el segmento correcto del patrón decorativo, usando una copia del del paso anterior (Control-C> Control-F), que colocaremos en el lado opuesto de la flor, asegurándonos de reflejarla verticalmente una vez que la tengamos en su lugar (clic derecho> Transformar> Reflejar> Vertical). Una vez que hayas terminado, selecciona y agrupa (Control-G) el patrón decorativo de la sección subyacente, haciendo lo mismo para todas las formas de composición del ícono después.
Vivir en una era digital realmente puede borrar algunas de las artes más antiguas de la mente de uno, especialmente si esa persona nunca las encontró en la vida real. La costura, que se cree que se originó en la Edad de Piedra, fue y en algunos lugares todavía es una parte poderosa de la cultura y tradición rumanas, ya que se ha utilizado como un medio de decoración tanto del hogar como de la ropa y herramientas usadas en el dia.
Para mí, personalmente, la costura me trae muchos recuerdos de mi infancia, cuando solía sentarme junto a mi abuela y verla pasar horas creando bellas piezas de arte para decorar su hogar..
Dicho esto, volvamos a nuestro propio arte, primero asegurándonos de que estamos en la capa correcta (esa sería la tercera) y luego creamos nuestro segundo icono.
Comience a trabajar en el cuerpo principal del marco creando un 106 x 106 px circulo (# CE9D78) con un 4 px contorno grueso (# 2B3249), que agruparemos (Control-G) y luego alinee el centro con el borde superior del área de dibujo activa subyacente.
Crea un pequeño 90 x 90 px circulo (# A8755A) con un 4 px contorno grueso (# 2B3249), que agruparemos (Control-G) y luego alinear el centro con el del paso anterior.
Agrega el lienzo usando un 78 x 78 px circulo (# EFD4C5) con un 4 px contorno grueso (# 2B3249), que agruparemos (Control-G) y luego alinee el centro a la sección anterior. Una vez que hayas terminado, selecciona y agrupa (Control-G) las tres secciones juntas también.
Comience a trabajar en la sección inferior del marco creando su contorno usando un 20 x 18 px rectángulo# 2B3249), que alinearemos en el centro del borde inferior del área de dibujo activa, asegurándonos de enviarlo a la parte posterior de los círculos más grandes (haga clic derecho> Transformar> Organizar> Enviar al fondo).
Agregue la sección de relleno usando una más pequeña. 12 x 14 px rectángulo# CE9D78) que alinearemos en el borde superior de la forma creada anteriormente.
Crear un 18 px alto 4 px grueso Carrera línea# 2B3249), que alinearemos en el centro con la forma del paso anterior.
Comience a trabajar en el tornillo de apriete pequeño, creando su cuerpo principal con un 44 px amplio 4 px grueso Carrera línea# 2B3249), que posicionaremos hacia la sección inferior del marco, dejando un 2 px brecha entre ella y el contorno más grande.
Añadir la tapa del tornillo con una 8 x 8 px cuadrado (# 2B3249), que alinearemos en el centro del punto de anclaje derecho del cuerpo. Una vez que hayas terminado, selecciona y agrupa (Control-G) las dos formas juntas, enviándolas a la parte posterior de la sección inferior después (haga clic derecho> Transformar> Organizar> Enviar al fondo).
Comience a trabajar en la flor decorativa actual creando la sección central con cuatro 2 x 2 px cuadrados# 2B3249) que posicionaremos para que terminen formando un signo más. GrupoControl-G) Las formas y luego las alinea al centro con el lienzo..
Enciende el Vista previa de píxeles modo (Alt-Control-Y) y crea la sección superior del pétalo superior izquierdo de la flor, usando tres series de cuatro 2 x 2 px cuadrados# E56F5C) que posicionaremos uno junto al otro, empujando cada conjunto 2 px arriba para que terminen formando un conjunto de escaleras. GrupoControl-G) los cuadrados y luego colóquelos en el lado izquierdo del signo más, asegurándose de dejar un 2 px brecha entre ellos.
Cree una copia de la sección del paso anterior (Control-C> Control-F), que rotaremos (clic derecho> Transformar> Rotar> 90º) y luego reflejar horizontalmente (clic derecho> Transformar> Reflejar> Horizontal), colocando la forma resultante debajo de la original.
Dale un contorno al pétalo, agregando un par de 2 x 2 px cuadrados# 2B3249) alrededor de sus dos secciones de composición, asegurándose de seleccionar y agrupar (Control-G) todos juntos una vez que hayas terminado.
Crea los otros pétalos usando tres copias (Control-C> Control-F tres veces) de la que acabamos de terminar de trabajar, que colocaremos alrededor del signo más del centro, reflejándolos según sea necesario.
Continúa agregando detalles a la flor creando cuatro copias (Control-C> Control-F cuatro veces) de su signo más en el centro, que colocaremos en el borde exterior del espacio que se encuentra entre cada par de pétalos.
Termine la flor y, con ella, el ícono en sí mismo, agregando líneas diagonales a cada uno de sus pétalos, usando cuatro conjuntos de 2 x 2 px cuadrados# 2B3249). Una vez que hayas terminado, selecciona y agrupa (Control-G) todas las formas de composición de la flor juntas, haciendo lo mismo para todo el ícono después.
Ahora estamos en nuestro tercer y último ícono, que está compuesto por un juego de cucharas tradicionales hechas a mano, que son otros medios poderosos de expresión de las mentes de las personas rumanas, usadas no solo para decorar sino también como una herramienta dentro de sus hogares..
Ni siquiera voy a hablar mucho sobre esta forma de arte, ya que realmente espero que al crear este pequeño ícono obtendrás una curiosidad lo suficientemente poderosa como para buscar más información sobre él..
Dicho esto, asegúrate de estar en la capa correcta (esa sería la cuarta) y terminemos esto.
Empieza a trabajar en la primera cuchara creando una 8 x 8 px circulo (# D3685E) con un 4 px contorno grueso (# 2B3249), que agruparemos (Control-G) y luego posicionarse a una distancia de 16 px desde el borde izquierdo del área de dibujo activa, asegurándose de alinearlo con su borde superior después.
Crea un poco más grande. 12 x 12 px circulo (# CE9D78) con un 4 px contorno grueso (# 2B3249) encima de lo cual agregaremos otro 4 x 4 px circulo (# 2B3249). GrupoControl-G) las tres formas juntas, y luego colóquelas debajo de la sección anterior.
Crea el primer conjunto de pétalos de la cuchara usando dos. 10 x 10 px rectángulos# CE9D78), que ajustaremos configurando el Radio de sus esquinas exteriores inferiores a 8 px y sus superiores internos para 4 px desde dentro del Transformar panel de Propiedades del rectángulo. Dar a las formas resultantes una 4 px contorno grueso (# 2B3249), agrupando individualmente (Control-G) cada pétalo, y luego colocarlos debajo de la sección anterior.
Crea los restantes conjuntos de pétalos utilizando tres copias (Control-C > Control-F tres veces) de los que ya tenemos, apilándolos verticalmente uno debajo del otro.
Ajuste el color de algunos de los pétalos seleccionándolos cuidadosamente usando el Herramienta de selección directa (A) y luego cambiando el color a # A8755A.
Crear una copia (Control-C> Control-F) de las dos secciones circulares de la cuchara, que colocaremos debajo de sus pétalos, asegurándonos de reflejarlos horizontalmente (clic derecho> Transformar> Reflejar> Horizontal) y cambia el color de la forma de relleno de uno más grande a # A8755A.
Cree la sección que conecta el tazón pequeño al mango de la cuchara usando un 8 x 16 px rectángulo# A8755A) (1), que ajustaremos agregando un par de puntos de anclaje laterales a una distancia de 4 px desde su borde superior usando el Añadir herramienta de punto de anclaje (+) (2).
Luego, seleccione individualmente y empuje los anclajes superiores de la forma hacia el interior por una distancia de 2 px (haga clic derecho> Transformar> Mover> Horizontal> + / - 4 px según el lado con el que empieces (3), dándole a la forma resultante una 4 px contorno grueso (# 2B3249) (4).
Añadir dos 8 px amplio 2 px grueso Carrera líneas (# 2B3249) apilados verticalmente 3 px el uno del otro, agrupando (Control-G) y luego posicionando la sección actual debajo del círculo más pequeño.
Termine la cuchara creando su tazón con un 16 x 16 px circulo (# CE9D78), que ajustaremos seleccionando y empujando su punto de anclaje inferior hasta el fondo en una distancia de 6 px (botón derecho del ratón > Transformar> Mover> Vertical> 6 px). Dar a la forma resultante una 4 px contorno grueso (# 2B3249), agrupando (Control-G) y luego colocar las dos formas en la sección anterior. Una vez que hayas terminado, selecciona y agrupa (Control-G) todas las formas de composición de la cuchara juntas, antes de pasar a la siguiente.
Comienza a trabajar en la segunda cuchara del icono creando un 8 x 20 px rectángulo# A8755A) que ajustaremos ajustando el Radio de sus esquinas superiores a 4 px desde dentro del Transformar panel de Propiedades del rectángulo. Dar a la forma resultante una 4 px contorno grueso (# 2B3249) seguido de tres 2 x 2 px círculos (# 2B3249) apilados verticalmente en 2 px el uno del otro, agrupando (Control-G) y luego posicionando las formas en el lado derecho de la primera cuchara, a una distancia de 24 px.
Agrega la sección circular usando un 12 x 12 px circulo (# A8755A) con un 4 px contorno (# 2B3249) encima de lo cual agregaremos un pequeño 4 x 4 px circulo (# 2B3249), agrupando (Control-G) y luego colocar las formas debajo de la sección creada anteriormente, para que terminen superponiéndolas.
Crear un 12 x 16 px rectángulo# CE9D78) que convertiremos en un diamante agregando un nuevo punto de anclaje al centro de cada uno de sus bordes usando el Añadir herramienta de punto de anclaje (+), quitando las esquinas después usando la Eliminar herramienta de punto de anclaje (-). Dar a la forma resultante una 4 px contorno grueso (# 2B3249), agrupando (Control-G) y luego colocarlos en la parte posterior de la sección circular (haga clic derecho> Transformar> Organizar> Enviar al fondo).
Crear dos 8 x 8 px círculos (# 899E47) con un 4 px contorno grueso (# 2B3249), agrupando individualmente (Control-G) y luego colocarlos en cada lado de la sección superior del diamante.
Empieza a trabajar en el cuerpo principal de la cuchara creando un 8 x 10 px rectángulo# A8755A), seguido de una mayor 12 x 34 px uno (# A8755A), que uniremos y luego posicionaremos debajo de las secciones anteriores.
Ajuste la forma mediante el ajuste de la Radio de sus esquinas superiores a 4 px, añadiendo un par de puntos de anclaje laterales a una distancia de 14 px desde su borde inferior. Luego, seleccione individualmente y empuje los puntos de anclaje inferiores hacia el interior por una distancia de 4 px (haga clic derecho> Transformar> Mover> Horizontal> + / - 4 px dependiendo de con qué lado empieces.
Crea la sección más ligera del cuerpo usando una 12 x 12 px cuadrado (# CE9D78) que alinearemos en el centro con la forma más grande, colocándola a una distancia de 15 px desde su borde superior.
Dale al cuerpo más grande una 4 px contorno grueso (# 2B3249), seguido de cinco 12 px amplio 2 px grueso Carrera líneas (# 2B3249) apilados verticalmente 3 px el uno del otro, que agruparemos (Control-G) y luego alinee el centro al rectángulo más claro de la sección.
Agrega dos pares de dos 2 x 2 px círculos (# 2B3249) apilados verticalmente 2 px uno del otro, colocando uno en la parte superior del cuerpo y el otro en la parte inferior. Una vez que haya terminado, seleccione y agrupe todas las formas de composición de la sección actual usando el Control-G atajo de teclado.
Añadir un 8 x 8 px circulo (# 899E47) con un 4 px contorno grueso (# 2B3249), que agruparemos (Control-G) y luego colóquelo encima de la sección anterior, a una distancia de 22 px desde el borde inferior del área de dibujo activa.
Termine la cuchara, agregando el tazón con un 16 x 22 px elipse# A8755A) con un 4 px contorno grueso (# 2B3249), que agruparemos (Control-G) y luego posición debajo del círculo más pequeño. Una vez que hayas terminado, selecciona y agrupa (Control-G) todas sus secciones de composición juntas también, antes de pasar a la tercera y última cuchara.
Empieza a trabajar en la tercera cuchara, creando una 12 x 16 px elipse# CE9D78) con un 4 px contorno grueso (# 2B3249) encima de lo cual agregaremos un 4 x 4 px circulo (# 2B3249), agrupando (Control-G) y luego posicionando las tres formas a una distancia de 20 px desde el borde derecho de la segunda cuchara.
Crear un 8 x 8 px circulo (# CE9D78) con un 4 px contorno grueso (# 2B3249) que agruparemos (Control-G) y luego la posición debajo de la sección anterior, a una distancia de solo 3 px.
Crear dos más 8 x 8 px círculos (# D3685E) con un 4 px contorno grueso (# 2B3249), que agruparemos individualmente (Control-G) y luego colóquelo en los lados de las dos secciones que tenemos hasta ahora.
Crea un poco más grande. 12 x 12 px circulo (# A8755A) con un 4 px contorno grueso (# 2B3249) encima de lo cual agregaremos un 4 x 4 px circulo (# 2B3249). GrupoControl-G) las tres formas juntas y luego colóquelas debajo de la sección circular más pequeña.
Comienza a trabajar en la flor de la cuchara creando sus pétalos usando cuatro 10 x 10 px cuadrados# CE9D78), que ajustaremos configurando el Radio de dos de sus esquinas a 6 px desde dentro del Transformar panel de Propiedades del rectángulo. Dar a las formas resultantes una 4 px contorno grueso (# 2B3249), y luego posicionarlos ligeramente sobre la sección anterior, seleccionando y agrupando (Control-G) los cuatro juntos.
Cambia el color de los pétalos de abajo a la izquierda y de arriba a la derecha para # A8755A, y luego agregar una 8 x 8 px circulo (# D3685E) con un 4 px contorno grueso (# 2B3249) en su centro, agrupándolos luego usando el Control-G atajo de teclado.
Crear una copia (Control-C> Control-F) de la sección circular que se encuentra sobre la flor de la cuchara, y colóquela debajo, asegurándose de cambiar el color de su forma de relleno a # CE9D78.
Crea la parte inferior del cuerpo de la cuchara con un 20 x 32 px rectángulo# A8755A), de la parte inferior de la cual eliminaremos dos 14 x 24 px puntos suspensivos (resaltados con rojo) usando Pioneroes Modo de forma frontal menos. Una vez que hayas terminado, coloca la forma resultante debajo de la sección anterior.
Selecciona el Radio de las esquinas superiores de la forma resultante para 10 px (2), añadiendo un encendedor. 20 x 12 px rectángulo# CE9D78) que posicionaremos a una distancia de 6 px desde su borde superior (3). Luego, agrega cinco 20 px amplio 2 px grueso Carrera líneas (# 2B3249) apilados verticalmente 3 px el uno del otro, que agruparemos (Control-G) y luego alinee el centro al centro de la forma más pequeña (4).
Agrega un 4 x 4 px circulo (# 2B3249) hasta la parte superior de la forma más grande (5), seguida de una 4 px contorno grueso (# 2B3249) (6), seleccionando y agrupando (Control-G) todas las formas juntas después.
Termine la cuchara y, con ella, el ícono en sí, agregando su tazón pequeño con un
Accentsconagua