[Tutorial] Crea un icono - Parte 1: Creación de la estructura (Illustrator)

Mar 2008-09-30 - 16:30 - En Destacados, Diseño, Inspiracion, tutorial


Como indica el título esta es la primera entrega del mega tutorial en donde aprenderemos a crear un icono por completo, desde su estructura en Illustrator, el coloreado en PhotoShop y la creación del formato .ico para usarlo en cualquier aplicación. Por lo tanto, si te gustan los iconos tanto como a mi o tienes ganas de aprender nuevas técnicas y tips que te ayudaran a la hora de diseñar, no te pierdas este tutorial.

Esta primera parte será rápida y fácil de seguir, ya que el Illustrator hará casi todo por nosotros. Para comenzar necesitamos abrir el Illustrator y crear un nuevo documento, como vamos a crear un icono no necesitamos que sea excesivamente grande, por lo tanto mi nuevo documento es de 800×600px y el icono lo haremos de 500px aproximadamente (pero como trabajamos con vectores podemos modificar el tamaño sin perder la calidad).
Una vez que tenemos el nuevo documento abierto comenzaremos a crear la estructura, primero asegúrense de tener las reglas activadas (View > Show Rulers o Ctrl. + R) y también los Smarts Guides (View > Smart Guides o Ctrl. + U) ya que nos ayudaran mucho en el proceso. Primero crearemos el techo de la casa, para eso crearemos un rectángulo (que será una especie de guía) y lo dividiremos en 2 partes iguales (con las reglas) y luego con la herramienta vector trazaremos el techo, no hace falta poner borde, solamente color de relleno. Fíjense en la imagen que también que cree más guías de ayuda, así me aseguro que todo quede simétrico y que nada se descoloque:

Paso 2, en este paso crearemos la estructura de la casa siguiendo la misma metodología usada en el primer paso. Les recomiendo que elijan un color más claro que el del techo y usen cuantas guías necesiten. Lo que recomiendo hacer en estos casos es tomar una columna como referencia y luego la voy modificando según necesite, pero siempre partiendo de la misma columna, así nos aseguramos que todas las líneas sean iguales.
Como verán las columnas que limitan con el techo encajan con la forma del techo, esto es muy fácil de hacer, simplemente debemos seleccionar la flechita blanca (“Direct Selection Tool (A)â€) luego seleccionar la esquina que queremos modificar y moverla a su nueva posición, hasta hora debería tener algo como esto:

Paso 3, Crearemos la base de la casa, con lo aprendido en los puntos anteriores ya tienen que ser capaces de poder hacer esto solos. En el caso de que no les salga repasen el paso 1 y 2.
Una vez hecha la base ya tendremos la estructura de la casa completa y deberíamos tener algo como esto:

Paso 4, sin duda este es el paso en donde nuestra casa deja de ser 2D y se convierte en algo real de 3 dimensiones. Para ello debemos seleccionar la casa con la herramienta “Selection Tool (V)†y dirigirnos a Effects > 3D > Extrude & Bevel, se nos abrirá una ventana que deberia tener un cubo y varias opciones. Primero activen el Preview y PUFF! Nuestra casa en 3D, pero ahora falta configurar las opciones para lograr un mejor resultado, en la siguiente imagen podrán ver como debe quedar configurado:

Listo! Ya terminamos con la parte número 1 de este mega tutorial. Repasemos todo lo visto: Creación de estructuras simples, uso de guías & las Smart guides y como convertir objetos planos en 3D. En conclusión, Illustrator es una herramienta asombrosa para este tipo de trabajos ya que en simples pasos podemos conseguir resultados muy interesantes.

Aquí tienen el archivo fuente del tutorial es un archivo .ai, si se trabaron en alguna parte pueden descargar este archivo y ver como esta hecho. Para el próximo tutorial sera necesario contar con la estructura en illustrator ya que partiremos de eso, por lo tanto si no hiciste el tutorial te recomiendo que lo descargues.
Ya estoy trabajando en la parte 2 del mega tutorial… asi que a esperar :)

Comentarios (5)
Deja un comentario
Nombre:
E-Mail:
URL:
Comentario: