¿Buscas un nuevo icono? No busque más. Aprenda a crear un icono de cesta de la compra personalizado para su próximo proyecto de diseño web. Combinaremos cualidades 3D con un look plano. Necesitará una comprensión firme de las herramientas de Adobe Illustrators para completar este tutorial..
A continuación se muestra el diseño final en el que trabajaremos..
Comience seleccionando la herramienta Rectángulo (M) y dibujando un rectángulo con un trazo de 4 puntos. Asegúrese de estar usando un color claro para el trazo para poder ver lo que está haciendo cuando aplica el efecto 3D. No aplique un relleno al rectángulo.
Vaya a Efecto> 3D> Extrusión y biselado. Dé a su forma una rotación para los ejes X, Y y Z y una Profundidad de Extrusión de aproximadamente 16. Haga clic en Aceptar. Copia y pega esta forma para usarla en el siguiente paso.
En la paleta de apariencia, haga doble clic en 3D Extrude & Bevel. Ingrese una profundidad de extrusión mucho mayor y haga clic en Aceptar.
Ponga las formas una encima de la otra y haga que la forma superior o inferior sea un poco más pequeña o más grande que la otra. De esta manera se puede decir que hay dos formas que conforman la canasta. Así es como debería verse tu obra de arte ahora mismo..
Para manipular aún más la forma, primero deberá ir a Objeto> Expandir apariencia. Con la Herramienta de selección directa (A), arrastre para seleccionar los puntos como se resalta a continuación. Mueva los puntos hacia adentro un poco para que toda la canasta quede un poco más delgada en la parte inferior.
Asegúrese de mover los puntos alrededor del borde superior de la cesta también.
Aplicaremos un degradado de azul a negro en nuestra cesta. Cuando trabaje con negro, asegúrese de usar un negro que tenga valores cero para R, G y B. Esto le dará un negro mucho más rico.
Seleccione la cara de la cesta y vaya a Objeto> Trayectoria> Desplazamiento de ruta. Ingrese aproximadamente -10 y haga clic en Aceptar. Esto creará un área interior con las mismas proporciones de la forma más grande. Luego podemos aplicar dos colores diferentes a las formas para darle a la canasta un mayor interés visual..
Dar a la otra cara de la canasta el mismo tratamiento de trayectoria de desplazamiento.
Si desea que sus gradientes sean consistentes en varias formas, asegúrese de seleccionar ambas formas al mismo tiempo. He creado el aspecto de una superficie muy reflectante cambiando bruscamente el color en el degradado. Conseguir una reflexión realista llevará algo de experimentación..
Seleccione el área interior en la cara de la canasta y vaya a Editar> Editar colores> Ajustar balance de color. Introduzca 5 para cada valor y haga clic en Aceptar. Esto hará que el color azul sea 5% más claro en el área seleccionada y dará la impresión de un cambio sutil en la superficie del objeto..
Así es como se verá tu obra de arte ahora mismo..
Continuar dando el resto de los gradientes de la cesta. Observe cómo el look reflectante no está demasiado exagerado. Tiendo a dar a cada cara de la canasta no más de un cambio de color abrupto. Pero, por supuesto, las reglas se hicieron para romperse. Solo sigue intentando diferentes ángulos e intensidades de color hasta que se vea bien para ti. También observe cómo el interior de la canasta no hace mucho uso de un reflejo, solo de un gradiente oscuro a claro.
Hacer los agujeros que cortan la canasta es más fácil de lo que piensas. Usando la herramienta Pluma (P), dibuja una forma como la de abajo. Asegúrate de seguir las líneas de la cesta. Básicamente, asegúrese de que sus líneas superiores estén paralelas a la parte superior e inferior de la canasta y sus líneas laterales sean paralelas a los lados de la canasta.
Copie y pegue la forma y superpóngalos como se muestra a continuación. En el buscador de ruta, seleccione Restar del área de forma y luego Expandir.
Te quedará con una forma que se parece al borde de una ventana.
Dado que la forma de la ventana principal aún está en el portapapeles, presione Opción + F para pegar la forma de la ventana exactamente desde donde la copió. Ahora puede utilizar esta forma para crear las otras ventanas. Dado que la forma de la canasta se reduce hacia la parte inferior, deberá ajustar cada ventana ligeramente para que se vean correctamente. Use la herramienta Selección directa para ajustar la forma de cada ventana..
Dibuja las ventanas en la otra cara de la cesta..
Seleccione la forma de cada ventana en la cara de un lado de la canasta y dele un degradado marrón a negro simultáneamente. Esto garantizará que el gradiente sea uniforme y consistente en todas las ventanas.
Para hacer las cajas que van dentro de la canasta primero dibuja una forma cuadrada.
Vaya a Efecto> 3D> Extrusión y biselado. Ingrese las variables a continuación y haga clic en Aceptar.
Copie y pegue los cuadros un par de veces y cambie la profundidad de Extrusión para hacer diferentes alturas de cuadros.
Para continuar trabajando con los cuadros, deberá expandirlos yendo a Objeto> Expandir apariencia. Muy importante: desagrupa todas las casillas hasta que ya no puedas desagruparlas. Para desagrupar los cuadros vaya a Objeto> Desagrupar.
Luego, rota las cajas para que estén todas en ángulos ligeramente diferentes. Dales un cálido degradado marrón asegurándote de variar el brillo de cada lado de la caja para crear una apariencia más realista.
Agregue un poco más de detalles copiando y pegando la parte superior del cuadro y utilizando la herramienta de selección directa para remodelar el objeto para que parezca un pedazo de cinta. Rellene la forma con blanco y ajuste la Opacidad en la Paleta de Transparencia a aproximadamente el 10%.
Vaya a Objeto> Ruta> Ruta de compensación e ingrese -5 luego haga clic en Aceptar.
Seleccione la forma interior y ajuste el degradado para que no se mezcle con la otra forma detrás de ella.
Una forma rápida de hacer que parezca que las cajas están dentro de la canasta es aplicar una máscara de recorte a las mismas..
Usando la herramienta Pluma, dibuje una línea donde está la línea de puntos. Su línea no necesitará un color de relleno o trazo. La siguiente línea roja es solo para representación..
Asegúrese de que la forma que acaba de dibujar está en frente de las cajas. Seleccione todas las casillas y seleccione la forma de la máscara, luego vaya a Objeto> Máscara de recorte> Crear. Tus cajas se verán instantáneamente como si estuvieran dentro de la canasta!
Si desea seguir editando el color o la forma de los cuadros, haga doble clic en ellos para ingresar en lo que se llama Modo de aislamiento (Illustrator CS3 y superior) y ajústelos a su gusto..
Cree algunos aspectos destacados en la cesta dibujando primero una forma básica con la herramienta Pluma. Vaya a Efecto> Desenfoque> Desenfoque gaussiano e ingrese una variable que se vea bien para usted.
Copia y pega todos los elementos hasta el momento. Seleccione la copia que acaba de hacer y en la Paleta de Pathfinder seleccione Agregar al área de forma seguido de Expandir.
Dale a esta forma un trazo grueso. Establezca las tapas en Redondear y Unir como se resalta a continuación. A continuación, asigne una sombra paralela a la forma yendo a Efecto> Estilizar> Sombra paralela.
Pon la forma detrás de todo lo demás..
Puede convertir fácilmente este icono en un conjunto cambiando las ventanas a un degradado de azul a negro y formando una flecha con un triángulo y una forma cuadrada.
Aquí está, los iconos de la cesta de la compra final..