Diseño Gráfico
El diseño gráfico es una profesión cuya actividad consiste en concebir, programar, proyectar y realizar comunicaciones visuales, producidas en general por medios industriales y destinadas a transmitir mensajes específicos a grupos sociales y con objetivos claros y determinados
También se conoce con el nombre de diseño en comunicación visual, debido a que algunos asocian la palabra gráfico únicamente a la industria gráfica, y entienden que los mensajes visuales se canalizan a través de muchos medios de comunicación, y no solo los impresos.
El sentido de este post, que realmente son pruebas que hice cuando me puse hacer el post de Sustituir imagenes y texto en fichero svg de inkscape.
Un poco teoria de SVG generado Inkscape
Sabemos que un fichero svg su formato es XML, por lo en principio nuestro enfoque inicial es buscar información como sustituir contenido de un fichero XML.
XML es un lenguaje de marcado extensible, que fue creado para almacenar y transportar datos, legible tanto para humanos como para dispositivos.
En W3school hay un tutorial bastante completo de XML, dentro del cual podemos encontrar : XPath y Xquery
- XPath se puede utilizar para navegar a través de elementos y atributos en un documento XML.
- XQuery fue diseñado para consultar datos XML. Tiene el mismos sentido de uso que el SQL es para las bases de datos,
Lo queno encuentro es como poder sustituirlo, pero me imagino que XPath se puede realizar, hay que estudiarlo un poco.
Empezamos con XQUERY
Encontré el siguiente documento en internet, que pareció muy interesante, donde explica muy bien la funcionalidad de XQUERY.
Ya se esta haciendo costumbre que cada fin de semana, me líe con algo nuevo, este semana toco automatizar los textos y las imágenes de un fichero SVG generado con Inkscape.
La ideas es hacer un cartel de oferta, pero que los textos, precios y imágenes las pillará de forma externa, para que el cliente pueda generar carteles oferta de forma automatizada, sin tener que generar el uno a uno.
Un cartel como esté.
Me puse buscar información y aquí este otro post que es intento Manipular SVG como si fuera un XML, pero fue fallido el intento.
En grupo de telegram de Inkscape en Español pregunto y me comentan de:
- LPE BOOL -> Que atraves de LPE BOOL puedo hacerlo, pero no es muy intuitivo.
- NEXT-GENERATOR-> Me comentan tambien de un proyecto llamado next-generator, que busque por ahi.
El primero tiene pinta de ser algo de inkscape, pero realmente no por donde empezar.
El segundo Nextgenerator es una extensión inkscape.
Nextgenerator - Extension de inkscape.
El proyecto se encuentra GitLab /Moini/nextgenerator , al leer la descripcion del proyecto, creo que es lo que busco.
El problema que no se mucho como va el tema de las extensiones en inkscape.
Nueva busqueda información y encuentro esta entrada del Blog de Mairin Duffy que nos indica como es la instalacion además de explicar como utilizarlo.
Os pongo un video de su canal donde explica como hace una plantilla svg para presentaciones conferencias ( ingles)
En el podemos ver que lo hace por
%VAR_mivariable%
Donde mivariable el titulo del campo, es decir la primera linea del csv. Lo colocamos con %VAR_ al principio y lo cerramos con %
Bueno hasta aquí llegue, con esto soluciono parte del problema que es el cambiar los textos, me faltaría el poder cambiar la imagen.
[NADA MAS POR MOMENTO, LO DEJO ASÍ, OTRA VEZ SERÁ.. ]
¿Como poner un texto en un trayecto ?
Si queremos poner un texto en un trayecto , debemos seleccionar los dos objetos: el trayecto y el texto, luego en el menú de Texto debemos seleccionar poner en trayecto , listo el texto, el texto recorre la forma del trayecto.
¿ Como poner un texto dentro de una figura ?
Al igual que en el anterior, seleccionamos los objetos (la figura y el texto) luego en menú de Texto seleccionamos "Fluir en el marco", listo el texto pasa dentro del objeto.
El caso es que hice la prueba con un triangulo, que lo genere con la herramienta polígono y no me funciona.. bueno continuaré... :-)
Fuentes de la entrada:
¿Qué es Inkscape?
Inkscape es una herramienta de diseño gráfico vectorial libre y de código abierto, con Inkscape se puede hacer diagramas, líneas, gráficos, logotipos, y gráficos mucho más complejos, nació con el objetivo de ser una herramienta libre de código abierto y cumpla completamente con los estándares XML, SVG y CSS2.
Inkscape principalmente fue desarrollada para el sistema operativo GNU/Linux, pero en la actualidad es multiplataforma y hay versiones para Windows, Mac OS X, y otros sistemas derivados de Unix.
¿Los primeros pasos en Inkscape - Paneles, lienzo y ventanas?
Si ya conoces otras herramientas de diseño, inicialmente es bastante intuitivo.
Optimizar y reducir peso imagenes con tinypng.
Al subir imágenes a una web es muy recomendable optimizarlas al máximo, que no sean muy pesadas, por ello recomiendo utilizar alguna herramienta de optimización de imágenes.
Nosotros ahora vamos utilizar la herramienta que nos facilitan en la web tinypng.com, esta herramienta tanto optimiza imágenes png como jpg, funciona perfectamente ambos formatos.
En esta web se puede subir varios imágenes a la vez, tiene máximo 20 imágenes para versión gratuita, la optimización es muy rápida, consiguiendo reducir el peso de la imágenes más de la mitad, una vez comprimidas puedes descargar todas juntas en un zip.
Cuando lo descargamos las descomprimidos para que podamos ver la diferencia que hay entre la original y la comprimida, no se nota, verdad!
En web fijo que no se nota, me imagino que si fuéramos imprimir en formato grande seguramente si se notaría algún pixelado.
- Olalla
- Inkscape
Inkscape no tiene ninguna forma preestablecida para instalar fuentes, según su wiki oficial, porque se alimenta de las fuentes predeterminadas del sistema.
Lo primero que tienes que tener claro es que los sistemas operativos suelen tener dos carpetas donde guardan las fuentes del sistema y del usuario, aunque en principio inkscape se alimenta de los dos , pero deberías tener claro donde instalar las fuentes, si es para el usuario o para el sistema.
A veces , si acabas de intalarla y NO te aparecen puede ser cosa de cache del sistema o usuario, lo mas practico es reiniciar y ver si realmente no te aparecen INSKCAPE.
Donde las instalamos las fuentes?
Según el sistema operativo tendremos varias opciones para instalarlas, pero lo que tenemos que tener claro es si las queremos para un usuario o para todo el sistema. Como siempre desde aquí solo vamos a comentar como instalar en sistemas linux.
El tratamiento de imagenes para mi siempre es un trastorno
Vamos indicar como optimizar imágenes para utilizar en el desarrollo web, imágenes que no pierdan la calidad, que pesen poco, sin cambiar el tamaño de la foto.Hoy en día hay muchas herramientas para tratar imagenes, por ello hacemos este post para definir cuales utilizamos y cuales fuimos descartando.
También pondremos programas que utilizamos para tratar imagenes, simpre que sean sencillos y que pueda tratar varias imagenes a la vez.
Herramientas gráficas para optimizar imagenes.
Herramientas online como tinypng , son ideales para optimizar imagenes de forma sencilla sin necesidad de tener nada instalado en nuestro ordenador.
TinyPng
Para nosostros es una de las mejores aplicaciones web para optimizar imagenes, muy facil y sencilla de utilizar. Tiene una limitación de MG y ficheros para el servicio gratuito.
Reduce el peso de las imagenes de una forma considerable, sin perder nada calidad, hay pocos aplicaciones online y incluso de escritorio que lo superan,
Gimp
Este programa es una herramienta open source para tratamiento de imagenes. A la hora ver los resultado de como comprime, es impresionate, consigue incluso mejores resultados que tinypng.
A la hora guardar la imagen ( exporta como) si es una imagen jpg no permite configurar la compresion y que datos poner.
En la web gráffica encontré la siguiente entrada:
Siete herramientas para identificar una tipografía
Donde nos indica varías aplicaciones donde podemos identificar la tipografía de una imagen. Algo que un diseñador necesitará muy a menudo.
Son varias herramientas, pero yo me quedo con las dos que os indico.
Seguro que tuviste la necesidad de eliminar el fondo de una imagen en algún momento, cuando te pusiste hacer un diseño, un flyer, una presentación , un banner o ... necesitaste quitar el fondo de una imagen, no hace falta ser diseñador gráfico para tener esa necesitad. Hoy en día existe un sinfín de herramientas para realizar esto.
Nosotros llevamos años utilizando Gimp para la manipulación y edición de imágenes y aun así no conocemos todo el potencial que tiene GIMP, cada día aprendemos una forma nueva de hacerlo, esto es porque tiene un monto de herramientas de selección para poder recortar un objeto de una imagen.
Para recortar un objeto , para quitar un fondo se puede hacer muchas maneras, pero va depender de la foto en la cual queramos quitar el fondo. Será mas fácil o mas complejo según las características de la foro, no es lo mismo una foto con fondo del mismo color, que otra que su fondo sea total dispar.
Lee más…