Nos ponemos en situación: recibimos un diseño que viene de fuera y en el PSD encontramos iconos en mapa de bits, pero los necesitamos en vectorial. Y ahora, ¿cómo sacamos un SVG de estos iconos? ¿tenemos que trazar todos estos iconos para poder sacar el SVG?. Puede haber una solución más sencilla: que el diseñador haya cogido esos iconos de alguna de las colecciones existentes.

En este tutorial vamos a resumir un breve, pero efectivo, proceso de tres pasos para obtener esos iconos en formato vectorial.

Partimos de este diseño donde vemos que el icono que acompaña al texto “Intervinientes”, así como el resto de iconos de ese menú, son en mapa de bits.

Imagen del Paso 1: Iconos en formato mapa de bits

Paso 1: Obteniendo la imagen

El primer paso que hacemos es cambiar la información frontal del icono a color negro y dejar el fondo en blanco o transparente. Después, sacamos el icono como una imagen independiente. Si la imagen es muy pequeña, como es el caso, la agrandamos a unas dimensiones de -al menos- 200px x 200px, y la enfocamos. Todo esto para que se distinga lo mejor posible el color del icono con el fondo y así ayudar a Google en la búsqueda. Obtenemos algo así:

Imagen del Paso 2: Iconos que vamos a buscar

Paso 2: Búsqueda de la imagen

Para la búsqueda del icono nos vamos a ayudar del buscador de imágenes de Google: http://images.google.com. Seleccionamos ‘Upload an image‘.

Imagen del Paso 3: Seleccionar imagen para buscar con Google

Subimos la imagen que hemos obtenido en el paso anterior. Automáticamente Google muestra imágenes visualmente similares y entre ellas encontramos la que buscamos.

Imagen del Paso 4: Imágenes visualmente similares que pueden coincidir con la nuestra.

Entramos en el primer enlace en los que nos aparece la posibilidad de imagen coincidente, hacemos scroll hasta encontrarla y voilà:

Imagen del Paso 5: Imagen coincidente

Paso Final: Descargar la imagen en formato vectorial

Hemos llegado a la página de la imagen y comprobamos que efectivamente es la que necesitamos.
http://www.freepik.com/free-icon/group-of-people-in-a-formation_741091.htm#term=people&page=1&position=11

freepik es un buscador sin más, no aloja contenido, con lo que nos redirige a la página web que sí la tiene disponible para descarga, en este caso, flaticon:
http://www.flaticon.com/free-icon/group-of-people-in-a-formation_27825

Imagen del Paso 5: Descarga de la Imagen

Ahora sí, ya podemos descargarla en EPS o directamente en SVG. (Además, si necesitamos dar soporte a navegadores antiguos que no soporten SVG, siempre tenemos la posibilidad de descargarla como PNG).