martes, 30 de octubre de 2012

Tutorial: Efecto Glass en Inkscape

Entre trabajos, cooperativas, bancos de tiempo y estudios, todavía me da tiempo a acordarme que tengo un blog :P

Ayer apareció un aviso en la lista de correo de usuarios de Inkscape (suscríbete si no lo hecho ya, que va siendo hora), de unos compañeros que necesitaban una forma relativamente simple de emular ese efecto cristal tan de moda en las ventanas y lentes de los sistemas operativos. Para entendernos mejor, esto (la imagen que usan de muestra en el correo):


Que en http://opendesktop.org/ digan que todos los derechos son reservados, no tiene precio.

Y lo reconozco, le he dado vueltas al asunto, muchas vueltas, porque se me ocurrían varios métodos, incluyendo efectos de capa sobre máscaras sobre filtros. Cuando mi cerebro ha llegado a "filtros", he tenido una epifanía. Y la he grabado en vídeo.


Efecto Glass en Inkscape por Mardigann en Vimeo.

Efecto Glass en Inkscape en cinco cómodos pasos.


Antecedentes:

Primero, tenemos claro que hace falta una imagen normal, y además una idéntica, pero desenfocada, para simular la ventana semi-translúcida. Ahora bien, un desenfoque simple hará que los bordes de la imagen se vayan al carajo, y lamentablemente, necesitamos que tenga los bordes perfectos.

Paso uno, duplicamos la imagen.

Se podría hacer manualmente: crear una copia de base de la imagen, duplicarla, difuminarla, agruparla con la copia de la base, y usar otra copia más como máscara de recorte. Lo cual además de contraproducente para la salud mental, hace que no tengamos muy claro que nos hemos quedado con una imagen nítida, y un contenedor con dos imágenes agrupadas.

O, bien, sobre el duplicado de la imagen, se puede usar el filtro que aparece en Filtros>>Desenfoques>>Desenfocar contenido. Este es el paso práctico.

Paso dos, aplicamos el filtro.

Ya tenemos la imagen desenfocada, pero al menos para mi gusto, es poco desenfoque. Vamos a editar los parámetros del filtro (menú Filtros>>Editor de filtros). Los componentes del filtro son escasos pero consistentes, y es indiferente cual toques primero. En el vídeo, empiezo modificando el desenfoque, ajustándolo a mi gusto. La matriz de colores es interesante: en mi caso (no era necesario pero me molaba la idea) la usé para subirle el brillo a la imagen. La última columna es la constante, y los canales, de arriba a abajo (las filas), son R, G, B y Alfa. Si en esa columna (la última, la de la derecha) pones el valor de Alfa a 1 (última fila, esquina inferior derecha), el borde se queda negro porque le quitas la transparencia. Asumo que vas a jugar con los valores de todas las columnas, aunque en el vídeo solo le doy un 10% más a los valores RGB en la última (0,1 en vez de 0)

Paso 3, convertimos la imagen a patrón.

Y este es el paso más divertido porque lo que pretendo es que las "ventanas" sean dinámicas, quiero poder moverlas sin preocuparme de ir creando una máscara de recorte cada vez que quiera algo nuevo. Aunque solo haga una como ejemplo :P Menú Objeto>>Patrón>>Objetos a patrón, y ya podemos borrar la imagen: desde ahora existe en un universo paralelo como relleno... de patrón.

Paso 4, aplicamos el patrón a una ventana.

Pintamos un rectángulo, le redondeamos un poco las esquinas porque hace años que dejamos atrás el win98, abrimos el menú de relleno y borde, y le aplicamos el relleno de patrón que aparece justo encima de la barra divisoria (arriba aparecen siempre los que crea el artista, abajo los que vienen de fábrica). Ya puedes mover el objeto y tener siempre la imagen desenfocada dentro... siempre que te acuerdes de desactivar el botón de hacer que te sigan los degradados y rellenos de patrón (herramienta de selección, el último de todos de la barra de propiedades de la herramienta)

Paso 5, creamos la sombra.

En el ejemplo que se pedía, las ventanas tienen una leve sombra alrededor. Parte fácil donde las haya a estas alturas: duplicas la "lente", eliminas el relleno, y dejas un borde de color negro lo bastante grueso como para crear el efecto (en el caso del video, 10 px de borde va bien) Desenfocas al gusto, y colocas el objeto tras la "ventana". Agrupas las dos formas para que por fuerza tengan que pasear de la mano, igual que si quieres añadir y agrupar el resto de objetos clásicos (carpetas, barra de navegación, etc)  Et voilà!

Para que no te aburras haciendo las cosas por tu cuenta, añado el archivo svg, que sé que te mola. Si la lente no se mueve, asegúrate de desmarcar el botón de mover los patrones junto a los objetos.



miércoles, 10 de octubre de 2012

Inkscape 0.49 para este invierno

Hoy voy a resarcirme por el mes sin postear :P

Hace unos días, el grupo de Inkscape en Google+ publicaba una primera imagen de la futura interfaz de Inkscape usando las librerías GTK-3. No lancemos las campanas al vuelo todavía, puesto que en el mismo post avisan que queda mucho trabajo por hacer, y probablemente no esté acabada para la versión 0.49 (y esto es importante) que está prevista para este invierno. Podría hacer el chiste de "the winter is coming", pero queda feo.

A todo el mundo le encanta la pantallita, así que voy a hacer como el resto de blogs y publicar la foto en cuestión:


Más que el entorno de ventanas, lo que me llamó la atención fue el set de iconos, sobrio y elegante, creado por Barbara Muraus y que puede descargarse desde https://raw.github.com/gnome-design-team/gnome-icons/master/inkscape-symbolic/inkscape-icons.svg, y obviamente instalarse en nuestro Inkscape, enviándolo a la carpeta personal de datos (/inkscape/icons), con el nombre icons.svg. No lo mandes al directorio de instalación original, que ya hay un archivo con ese nombre y no es plan de hacer backups ni de cargarse el original: tienes la carpeta personal, en gnu/linux, /home/.config/inkscape/icons y en windows en datos de programa/inkscape/icons (lo mismo me equivoco, que hace dos años que no lo miro)

Ni idea de donde leí que puede ser que no esté completo, pero vamos, que es un svg, make it yourself los que faltan :P

Hasta aquí la misma noticia que podrías leer en casi cualquier blog del gremio (casi, los compañeros de desdelinux han puesto un link a las notas de lanzamiento) . La sustancia viene ahora:

Las notas de lanzamiento

Sacadas de http://wiki.inkscape.org/wiki/index.php/Release_notes/0.49, hago un repaso rápido de lo que se espera (el resto te lo lees en inglés en la página :P):

* Renderización y rendimiento

Antes o después tenía que pasar: nuevo motor de renderizado basado en Cairo, y mejora sustancial del aprovechamiento de los núcleos y la memoria, lo que se traduce en mejoría de los tiempos de ejecución, y esperemos que la casi desaparición de ese paso del caballo cojo del malo cuando había que mover un objeto complejo con filtros aplicados.

* Herramientas
Nueva herramienta de medidas, que la verdad se echaba de menos. Pequeñas mejoras en la de texto, y grandes mejoras en la de degradados.

* Importar/Exportar
Nuevos formatos de archivo, y mejoras en XCF (gimp) PDF/EPS/PS + LateX

 * Nuevas extensiones
 Entre otras, generador de códigos QR.

* Mejoras varias
Por fin los marcadores van a tomar directamente el color de su linea, sin pasar por extensiones. Ahora la gente pedirá que vuelva a ser independiente, verás.

Añadido el sistema matemático de cálculo. ejemplos como "5+5", "2*3" o, el que viene en la página: "((12 + 34) * (5 + 5) - 2) / 2" (que me digan qué querían calcular aquí) son aceptables como valores numéricos. Me pregunto si e=mc^2 se considerará igual :P

Eso son solo algunas cosas que me llamaron la atención, pero de entre todo lo que viene nuevo, lo que yo considero el plato fuerte es esto:


Y, probablemente con razón, dirás: ¿esto quéh lo quéh?

O no, si ya lo sabes, porque no es algo "nuevo" en otros programas de diseño, aunque sí relativamente reciente.

Efecto de trayecto, llamado... PowerStroke. Ese nombre de super-hero  le viene que ni pintado (nunca mejor dicho) para sus aplicaciones en entintado digital, ya que, mediante pequeños manejadores a lo largo del trayecto, podremos ensancharlo o estrecharlo dinámicamente. Perfecto para dibujar comics, un solo trayecto va a dar mucho juego ^^

Vale, tengo que decirlo... the winter is comiiiiing  n_n



Notas sobre Blender y Krita

Breves reseñas que me quedé con las ganas de hacer durante este mes, aunque lleguen tarde. Más vale tarde que ciento volando.

(I) Tears of Steel


El compañero Javiersam estuvo haciendo un seguimiento a Tears Of Steel, el nuevo cortometraje con el que, como ya nos tiene acostumbrados, la fundación Blender demuestra las capacidades incluidas en el programa más laureado del soft libre, Blender. En este caso, las bombas del corto son el perfeccionamiento del Camera Traking y la mejora de los cromas (eso de meter el fondito verde para mezclar imagen real con gráficos generados por ordenador).

En su momento pude ver un ejemplo en el blog de los compañeros de Graphic Suite Libre Andalusí, y en youtube también se pueden encontrar varios: rocket accident, esqueleto en la oficina o little robot son solo algunos de ellos.

(II) Blender. 3D en la educación


Blender es uno de esos programas que hacen que se me caiga la baba automáticamente (cosa curiosa, no me pasó con otros como 3DS, Bryce o Maya, pese a haberlos trasteado) y ver "Tears..." me recordó que debería ponerme con él algún día, aprovechando que el ministerio de educación encargó al Maestro Joaclint la creación de un megacurso sobre el susodicho programa, con licencia Creative Commons BY-NC-SA. No me llevaré los créditos universitarios por terminarlo, pero aprenderé del Maestro, fijo :P

(III) Ramón Miranda y Krita


Lo que me lleva a otro Maestro, Ramón Miranda, que pese a haber anunciado un cierto periodo de inactividad, no sólo sigue publicando y enseñando cómo pinta, además tuvo a bien publicar uno de esos sets de brochas que tanto me gusta instalarme, aunque luego sea un cacho de madera usándolos. Mi única pega, el post está en ingles ¬¬ :NEW set for KRITA software (2.5 or later). Con licencia Zero (dominio público).

Teniendo en cuenta lo que di la brasa con Krita, era de recibo publicarlo :P




Notas sobre SFD2012+NBLC2012

No, no me han capturado los del zoo, es que llevo un mes un tanto intenso.

 El SFD2012+NBLC2012 se saldó con una relativamente baja asistencia de personal (poquitos pero bien avenidos) aunque ha generado algunos movimientos interesantes entre bastidores.

La primera parte de la mañana se compuso del taller para ongs de la Oficina de Software Libre, para enseñarles cómo funciona el software libre a las asociaciones que han recibido un ordenador dentro de la III campaña de donaciones que se está llevando a cabo por parte de la OSL... y que ya va por la IV edición.

Meanwhile, este humilde servidor largaba la clásica charla de "que es eso del software libre y por qué nos interesa usarlo", seguida de talleres de usabilidad a cargo del compañero Makova, para continuar con  la proyección del documental "everything is a remix" y una interesante y participativa mesa redonda sobre cultura libre y licencias CC. Al cabo de un mes, y tras una serie de catastróficos chanchullos producidos en cierto pueblo de Jaén, contemplados con estupor por algunos de los participantes,  la susodicha charla ha desembocado en la creación de una asociación nacional de apoyo a los colegios públicos a través de la cultura y el software libres. Seguiremos informando, soy una de las zarpas fundadoras :P

Tras la comida de traje libremente distribuida (yo traje tortilla de patatas, yo traje ensaladilla rusa, yo traje filetes empanados...oxtia yo quiero, toma de lo mío) , cumplí otro de mis sueños dorados, hacer un minifestival de cortos CC. Próximamente será más largo, vimos unos cuantos pero no llegamos a la hora y media :P

Finalizamos con tres charlas enmarcadas dentro de la NBLC2012:
Francisco Fernandez nos dio una ponencia magistral (y lamentablemente muy breve) sobre el gobierno abierto. Afortunadamente se puede encontrar en internet la versión larga :P

El compañero Emilio tuvo ciertos problemas técnicos con su portátil y poco tiempo para arreglarlos, pero consiguió desarrollar (en mi vieja cafetera, que estuvo toda la jornada dando la talla, orgullo de padre)  su charla sobre hojas de estilo.

Por último, Daniel Molina desarrolló una interesante propuesta para favorecer el apoyo de las tiendas de informática hacia componentes soportados por sistemas libres mediante un sistema de publicidad inducida. Implica darse una pateada de local en local con una lista de dispositivos de tres kilos de papelajos, pero mola.

Despedida y cierre a cargo de J.J. Merelo, gran jefe de la OSL, que además de darse el lote de organizar a la gente entre bambalinas, hizo gran parte del reportaje gráfico del evento, y hack&beer&tapas, evento que no puede faltar en una ciudad como Granada.

Galería del oso: San Google Plus
Galería de JJ: San Flickr

Otro de esos movimientos que mencionaba: Hace ya tiempo el compañero Droho, del centro Guadalinfo CAPI Zaidín (se encargó el año pasado de dar una estupenda charla sobre usabilidad) me invocó para servir de profesor auxiliar en un curso de 20h de iniciación al softlibre en el diseño gráfico. Al cierre de las jornadas volvió a convocarme en el centro (con dos días de aviso, el tiempo es relativo) para repetir la faena.

De la experiencia hemos sacado que hay cosas que mejorar en el curso, y se mejorarán, obviamente, en futuras ediciones. Y es que el compañero Droho y este felpudo con patas, hemos fortalecido nuestra relación simbiótica para impartir conjuntamente nuevos cursos introductorios y avanzados de diseño gráfico, siguiendo el flujo de trabajo de Gimp, Inkscape y Scribus. Liquidar a fondo tres programas en 40h es un descontrol que necesita de más horas de prácticas, obvio; así que el próximo objetivo es convencer a los de arriba de que los cursos duren más.

Cuando nos paguen por esto va a ser la caña. Y saludos a nuestros alumnos que me estáis leyendo, que sois pocos y valientes =)