Proyecto miraistudio: animación Oh my pug

Hace unos meses hicimos una animación para Oh my pug, es una sastrería online de ropa para carlinos. La tienda hace chubasqeros, albornoces, jerseys, disfraces… y en general todo lo que se les ocurra, siempre que sea para carlinos. Todas sus prendas están hechas a mano, con materiales de calidad y a medida para cada uno de los perros.

La animación se difundió a través de su página de facebook y se hizo a partir de imagenes de los modelos y del logotipo facilitados por la diseñadora.

Publicado en Proyectos Miraistudio | Añadir comentario

Crear la silueta de una ciudad a partir de fotografías

Filadelfia
Salidas de agua decoradas con pegatinas

Este post tiene como objetivo mostrar cómo hacer las siluetas vectoriales que colgamos en este blog.

En este caso en concreto he escogido la ciudad de Filadelfia.

Lo primero que hay que hacer es seleccionar las fotografías que vamos a utilizar para hacer la silueta de la ciudad.

Una vez seleccionadas, abrimos Photoshop y procedemos a eliminar todas aquellas partes de la imagen que no queremos que aparezcan en la silueta. No es necesario ser muy meticuloso a la hora de recortar porque después vamos a vectorizar la imagen.

Imagen antes de eliminar el fondo

Cada uno debe utilizar la técnica que más domine para limpiar la imagen: goma de borrar, el lazo, el lazo poligonal, la varita mágica

Imagen con el fondo recortado
Imagen con el fondo recortado

Una vez recortado todo aquello que sobra de la imagen seleccionamos todo (Control + A o Cmd + A), lo copiamos y lo pegamos en Illustrator.

Imagen colocada en Illustrator
Imagen colocada en Illustrator

Ya en Illustrator y con la imagen a vectorizar seleccionada clicamos “Live trace” y en la pestaña de presets escogemos la opción que queramos aplicarle. También podemos tocar los parámetros hasta que obtengamos exactamente la silueta que queramos. Una vez obtenido el resultado buscado clicamos sobre “Expand” y ya tenemos la silueta vectorizada.

Clicar Live Trace, seleccionar el preset y los parámetros, y expandir la imagen
Clicar Live Trace, seleccionar el preset y los parámetros, y expandir la imagen

Particularmente, me gusta obtener solo el trazado negro y eliminar los blancos. Para eliminar la parte vectorial blanca simplemente hay que escoger la herramienta de varita mágica y clicar con esta sobre la parte blanca. Automáticamente se seleccionan todos los trazados blancos y los puedes borrar.

Silueta antes de hacer Compound Path
Silueta antes de hacer Compound Path

Una vez hecha la silueta podemos ver que está formada por un grupo compuesto de varios trazados. Si queremos convertir la silueta en un único trazado debemos hacer un “Compound Path”.

Compound Path
Compound Path

Este proceso lo realizamos con todas las imágenes que queremos incorporar a la silueta. Ahora bien, a veces simplemente con recortar las imágenes no es suficiente para que queden bien al vectorizarlas.

Siluetas de todas las imágenes
Siluetas de todas las imágenes

Por ejemplo, en el caso de intentar vectorizar un edificio blanco podemos querer que esté contorneado por una línea negra para que se aprecien sus dimensiones. En este caso colocaríamos un contorno mediante el programa de edición de imágenes y así obtendríamos dicho contorno en Illustrator cuando procediéramos a vectorizar la imagen.

Una vez tenemos todas las siluetas pasamos a hacer la composición panorámica que queremos. Y procedemos a unir los trazados entre ellos para que toda la silueta sea una unidad.

¿Cómo unimos los componentes de la Silueta?

Para las siluetas que debían unirse he usado la opción de Unión de la ventana de Pathfinder. Acto seguido he seleccionado todo el objeto unificado y he hecho un “Compound Path”. De manera que he unido todos los trazados.

Pathfinder Unir
Pathfinder Unir

En el caso del robot que he colocado en la parte inferior izquierda. He seleccionado la silueta de la ciudad y la del robot. Acto seguido clicamos en la opción de Exclusión del Pathfinder.

Pathfinder excluir
Pathfinder excluir

¡Ahora ya tenemos toda la silueta unida!

Lo siguiente que he hecho es escalar toda la composición hasta el tamaño deseado y escalar el lienzo para que encaje con al composición. Para poder hacer esto no debes tener seleccionado ningún objeto del documento. Entonces clicasas sobre el botón de “Document Setup” y dentro de éste seleccionas “Edit Artboards”. Ajustas el lienzo a la composición y ya está.

Document Setup
Document Setup
Artboards
Artboards

Ahora solo queda grabarlo o exportarlo en el formato que desees.

Silueta Filadelfia
Silueta de Filadelfia

Espero que os haya sido útil.

Publicado en Tutoriales | Tagged , , , , , , , | 2 comentarios

Siluetas de Ciudades: Washington DC

¡Bienvenidos a Washington DC!

La presente silueta incorpora una serie de edificios y monumentos característicos de la ciudad: la Casa Blanca, el Capitolio, el Pentágono, el cementerio de Arlington y el monumento a Washington.

Washington DC
Silueta Washington DC

Descarga la silueta de Washington DC

La silueta se ha elaborado a base de fotografías recortadas y convertidas a siluetas vectoriales en blanco y negro. Finalmente, se han combinado todas las siluetas para formar una composición final

 

Publicado en Regalos | Añadir comentario

Proyecto Estudio Soon: Evento VIB y 9 libros

VIB es un centro de investigación ubicado en Flandes (Bélgica). Su trabajo se centra en investigaciones científicas cuyos resultados sean aplicables en los sectores farmacéuticos, agrícolas e industriales. Ahora bien, lo que nos interesa aquí no es la actividad de Instituto de Investigación sino el proyecto que desarrolló el estudio Soon para celebrar los 15 años de existencia del VIB.

15 years VIB
15 years VIB

Este proyecto del estudio Soon lo descubrimos a través de su porfolio de behance. Estamos ante un proyecto de imagen corporativa desarrolló con tizas y una pizarra enorme creada a partir de pintura de pizarra.

Pared pintada con pintura de pizarra
Pared pintada con pintura de pizarra

La web del evento cuenta con un vídeo informativo, situado en la cabecera de la página, en el que los artistas van dibujando las informaciones más importantes del evento. Finalmente, el vídeo se transforma en el menú de la web.

Cabecera de la Web del Evento: 15 años de VIB
Cabecera de la Web del Evento: 15 años de VIB

Asimismo, Soon creó para el evento un pack de 9 libros compuestos por más de 200 dibujos de grandes dimensiones hechos a tiza.

Alguien podría pensar que hablar de proyectos ajenos, es como tirar piedras sobre nuestro propio tejado. La verdad es que es un proyecto de una enorme calidad creativa y artística, nos cautivó desde el primer momento y queríamos compartirlo con la gente que nos sigue.

Publicado en Proyectos creativos | Tagged , , , , , , , , , , | Añadir comentario

Siluetas de Ciudades: Barcelona

En Proyecto Miraistudio: Decoración de un archivador con plantillas, mostrábamos cómo decorar un archivador con esmalte y plantillas.

Archivador pintado con plantillas
Archivador pintado con plantillas

Durante la realización del proyecto tuvimos que indagar a través de Internet para encontrar fotografías y siluetas de las diversas ciudades para elaborar nuestra propia composición.

Encontrar las imágenes, las siluetas, retocarlas, vectorizarlas y componerlas fue complicado.

Este post pretende ser el primero de muchos otros en los que os ofreceremos siluetas de ciudades, en formato vectorial, totalmente gratuitas.

Silueta de la ciudad de Barcelona
Silueta de la ciudad de Barcelona

Descarga la silueta de Barcelona

Hoy os damos la de Barcelona. La próxima será Washington. Y si deseáis alguna silueta en concreto no dudéis en pedírnosla. Tendremos muy en cuenta vuestras comentarios y opiniones.

Publicado en Regalos | Tagged , , , , , , , | Añadir comentario

Colaboraciones de Miraistudio: Spotfav

head spotfav¿Qué es Spotfav?

Spotfav es una comunidad dónde los fans de surf, kitesurf u otros deportes acuáticos al aire libre, pueden darse de alta y compartir sus spots favoritos. Las aplicaciones gratuitas para iphone y Android, permiten a los miembros de la comunidad subir comentarios sobre el estado de la mar y del viento, valorar si es un buen día para practicar tu deporte favorito, e incluso visitar los spots de tus amigos y conocer lugares nuevos.

spotfavhttp://spotfav.com/

¿Cómo funciona?

Participar en Spotfav y compartir tus spots favoritos es fácil y gratuito. Simplemente debes de estar registrado en Spotfav y descargarte la aplicación adecuada para tu móvil

spotfav appstoreandroid market spotfavLos spots dispondrán de cámaras de rotación panorámica, situadas a primera línea de mar, con el objetivo de que los usuarios puedan ver en cualquier momento y desde cualquier lugar el estado de la mar. Asimismo, también se colocarán estaciones meteorológicas para conocer el viento y la temperatura. La idea es que los fans de los deportes acuáticos puedan saber lo que se van a encontrar antes de ir.

Cámaras

Arte Vida               Valdevaqueros             El Palmar

¿Cómo conseguimos cámaras en nuestro spot?

Cuando te registras dispones de 5 favs (5 estrellas) con las que puedes votar los spots sin cámara disponible o sin estación meteorológica. Si tu spot favorito no tiene cámara, vótalo y dile a tus amigos que lo voten. Si hay suficientes votos, colocaremos una cámara en el lugar.

Spotfav está en fase BETA. Así pues, sus creadores apreciarán que los usuarios reporten errores y hagan sugerencias sobre el proyecto.

¿En qué ha participado Miraistudio?

La creación del Logotipo de spotfav

logo spotfav
Logotipo spotfav

El diseño y la maquetación de la web

Home spotfav
Home spotfav

 

Publicado en Proyectos en Colaboración, Proyectos Miraistudio | Tagged , , , , , , , , , , , , | Añadir comentario

Proyecto Miraistudio: Decoración de un archivador con plantillas

Archivador pintado con plantillas
Archivador metálico decorado

Material Utilizado:

  • Archivador Metálico 130 x 47 x 60 (Adquirido de segunda mano en Troc)
  • Esmalte Gris claro, gris oscuro y negro
  • Rodillos de espuma, pinceles y cubetas de plástico (una por cada color)
  • Fotografía familiar
  • Iconos extraídos de all-silhouettes
  • Programas de edición de imágenes y diseño gráfico.
  • Impresora, tinta y papel
  • Tijeras
  • Cúter
  • Pegamento de barra

Proceso:

El diseño de la decoración del archivador se realizó en base a sus medidas, a los elementos que lo componen y a las partes visibles que del mismo en relación a su ubicación en la habitación.

Una vez decididas las partes visibles de la composición se procedió a diseñar el lateral y cada uno de los 4 cajones.

El diseño del lateral se realizó vectorizando una fotografía familiar realizada por el fotógrafo Lluis Gerard. El tamaño y la posición de la misma vino determinada por el espacio visible del archivador.

Foto familiar y su vectorización
Foto familiar y su vectorización

Tres de los cajones se decoraron con siluetas de ciudades en las que había residido el propietario del archivador. El cajón restante se decoró con iconos de objetos que podían ser guardados dentro del mismo.

Diseño Cajones
Diseño de los Cajones

El esbozo inicial en perspectiva quedó de la siguiente manera.

Esbozo del Diseño en 3D
Esbozo del Diseño en 3D

Antes de empezar a decorar el archivador era necesario lijar y crear la primera capa de pintura alternando el esmalte de gris claro y gris oscuro. Mientras se esperaba que la capa de pintura se secara, se procedió a dividir las imágenes de la composición para su impresión en DIN A4.

Se recortaron con tijeras y cúter y se pegaron en el archivador mediante pegamento de barra. Una vez montadas todas las piezas de la plantilla se procedió a pasar el rodillo con el esmalte negro.

Sin dejar que la pintura se secara del todo se procedió a sacar todas las partes de la plantilla manualmente o mediante cúter.

El resultado final de este trabajo manual lo podemos apreciar en estas fotografías.

Archivador Acabado
Archivador Acabado

 

Publicado en Proyectos Miraistudio | Tagged , , , , | 1 comentario

Patterns de Regalo

Los patterns o patrones son muy útiles para crear fondos en proyectos gráficos y web.

Subtlepatterns nos ofrece patrones bajo la licencia de creative commons de atribución, al mismo tiempo que nos permite compartir mediante su web patrones creados por nosotros mismos.

En este post os queremos presentar 3 patrones gráficos y web que hemos creado, y que os ofrecemos de forma gratuita. Simplemente tenéis que clicar con el botón derecho y guardar los png en vuestro ordenador.

Pattern redondas grises                                       Patter03

jpg                   jpg                   jpg

ai   l   eps

¡Qué los disrutéis!

 

Publicado en Patterns Web, Regalos | Tagged , , , , , | Añadir comentario