SVG Edit es un impresionante editor gráfico de código abierto con el que puedes operar desde el navegador. No hay análisis que se explique mejor que el simple hecho de usarlo durante un rato. ¡Pruébalo y ya me contarás!
La especificación sigue su curso y, dependiendo del navegador, obtendrá mayor o menor soporte. Para averiguarlo, puedes utilizar When can I use, una web de referencia tanto para HTML5 como para CSS3.
Por otro lado, existen una serie de herramientas útiles e imprescindibles para fomentar la compatibilidad hacia atrás y poder así construir sitios y aplicaciones con HTML5 con mayor cobertura. En el blog de Sebastián Thüer encontraréis especificados 10 recursos para comenzar a trabajar con HTML5 ya, destacando principalmente los generadores, plantillas y frameworks (SwicthToHTML5, Initializr, HTML5 Boilerplate, HTML5 Reset) y las librerías javascript que hacen compatible nuestro marcado HTML5 hacia atrás (Modernizr, HTML5Shiv).
Si os atrevéis a picar código “a pelo“, aqui dejo una ya famosa y larguísima chuleta de Tech King, “Ultimate HTML5 Cheatsheat“, que resume eficientemente las nuevas etiquetas y su uso:
Y vosotros ¿ya estáis construyendo sitios con HTML5? ¿Qué problemas os surgen? ¿Creéis que la compatibilidad hacia atrás es una tarea que progresivamente se irá olvidando en favor de los navegadores modernos o es una buena práctica que siempre hay que realizar? Si te apetece, deja tu comentario :)
Gracias a las redes sociales en línea de creativos, tematizadas y de índole profesional, se va asentando una nueva Cultura Visual que inunda nuestros fondos de pantallas y enlaces compartidos en Facebook o Twitter. Entre esos nuevos giros o aportes gráficos a la Cultura del Diseño —término en el que otro día nos detendremos— hay una nueva línea gráfica en torno a la fotoilustración (photoillustration) de la que es difícil escapar a sus encantos.
Hay mucho material publicado en torno al flujo creativo que llena la autovía de la fotoilustración, incluso hay miles de tutoriales para conseguir resultados asombrosos a golpe de click, capa a capa en Photoshop. El problema de este huracán de información que encontramos en las redes sociales de creativos en linea es que arrasa con la capacidad de análisis en favor de imitar la forma en el menor tiempo de producción posible. “3 pasos para conseguir fuego en Photoshop“, “5 técnicas para crear un fondo marino en Photoshop“, etc.
Todas esas técnicas y tutoriales están muy bien —me declaro consumidor de esa información— pero… ¿toda fotografía procesada por Photoshop deja de ser fotografía? ¿Cuándo una fotografía es una fotomanipulación? ¿Qué diferencia hay entre una fotomanipulación y una fotoilustración? ¿Donde termina la fotoilustración y empieza la ilustración? Es hora de hacerse las preguntas, aunque no podamos responderlas todas de manera exacta.
“¡Y qué más da, Abel! ¡Qué manía de etiquetarlo todo, qué manía de encasillar!”, dirán algunos. Y es respetable, sin embargo en el caso que nos ocupa es más que necesario por dos motivos:
Y eso que la fotoilustración no es un invento extraído de las entrañas de la última versión Photoshop. De eso nada. La fotoilustración nace del vientre de la Publicidad (finales del s. XIX) como mecanismo de menor coste (frente a la fotografía) para solventar las necesidades de promoción y posicionamiento de los productos. En el fantástico libro El arte del póster (Editorial Lisma) podemos hacer un seguimiento de su evolución, desde lo estrictamente pictórico o el Collage, pasando por la ilustración con base fotográfica (ej. Gil Elvgren) hasta los días de la era digital.
Este aspecto de la fotoilustración quizás sea el más importante: la conjunción de sus elementos simbólicos generan un mensaje o historia en la mente del receptor, unas veces más abstracto que otro. Es un valor añadido que la fotoilustración hereda de su madre la ilustración. La diferencia entre fotoilustración y fotomanipulación es prácticamente imperceptible visualmente. Quizás a un nivel más filosófico parece que, a diferencia de la fotoilustración, la fotomanipulación no tiene la obligación de incluir un mensaje, funcionando como escaparate de lo estrictamente estético. Con esto llegamos a un punto en que podemos definir la fotoilustración. En el blog Acerca de la fotografía usan estas palabras:
Podemos considerar que es fotoilustración toda imagen fotográfica, sea compuesta de fotografías en collage y fotomontaje, electrónicos o convencionales; o de fotografía combinada con otros elementos gráficos que cumpla con la función clásica de la ilustración. Esta función la podemos resumir como aquella que tiene como finalidad la mejor comprensión de un objeto, de un hecho, de un concepto o de una idea, bien representándola miméticamente o bien interpretando visualmente rasgos esenciales para su comprensión, a través de procedimientos de retórica visual y de simbolización.
Llegados al punto en que hemos definido en la medida de lo posible la fotoilustración, tenemos que plantearnos una cuestión antes de buscar “cómo hacer fuego con Photoshop” o “cómo simular un fondo marino con un par de filtros“: ¿Qué quiero contarle al mundo con esta fotoilustración?.
Siendo así cómo habrá que valorar la calidad del trabajo; promedio de destreza técnica y retórica visual. Ambos lados de la balanza deberán estar compensados. Por otro lado, para diferenciarla aún más de la fotografía y la fotomanipulación, la fotoilustración podría permitirse saltarse las leyes de la física, la perspectiva, la proporción, etc…, en favor de acentuar la retórica o simbolismo gráfico del mensaje o historia que queremos hacer llegar. A pesar de ello, la línea entre la fotoilustración, la fotomanipulación, el diseño gráfico y el arte digital sigue siendo a veces imperceptible.
Sven Prim, Jerico Santander, Peter Jaworowski, Matthew Albanese, Alberto Seveso, Pawel Nolbert, Archan Nair, Roberto Gamito, Marcin Cecko, Mike Campau y Peter PRN es un pequeño extracto de la infinita lista de nombres que componen el campo de la fotoilustración y la fotomanipulación.
Comprobaréis que los orígenes son diversos: unos fotógrafos, otros ilustradores, otros diseñadores gráficos… Absolutamente todos reconvertidos en esta nueva especie de malabaristas de la retórica visual y los filtros de Photoshop.
Conforme se van asentando las bases de un nuevo modelo de producción de sitios y aplicaciones con la llegada de HTML5, nacen nuevas necesidades a las que grandes empresas como Google, como no, ya tenían previsto dar soporte o van solventando sobre la marcha.
Éste es el caso de nuevas propiedades de las hojas de estilos en cascada de tercer nivel, que desde hace ya aproximadamente un par de años vienen proponiendo soluciones desde el código CSS para problemáticas estrictamente visuales que se han ido asentando en la nueva cultura visual de la web participativa (bordes redondeados, sombras en los elementos, un mayor catálogo tipográfico, etc).
En concreto y actualmente, la regla @font-face —a través de la que el diseñador web puede proponer una mayor riqueza tipográfica para la web— tiene un soporte mayoritario por los actuales navegadores. Pero no todo es jauja. De esta ventaja nacen los siguientes problemas que se han de solventar:
Teniendo en cuenta estos factores y que anteriormente la regla @font-face tenía un soporte minoritario, dos grandes alternativas han sido hasta ahora sIFR o Cufón. Su continuidad es incierta, pero podríamos teorizar con su paulatino desuso por los siguientes motivos:
Así pues, es en este justo momento en que @font-face tiene mayor soporte por todos los navegadores y sitios de referencia implementan su aparición (p. ej: Smashing Magazine, algunas plantillas en Tumblr), cuando Google sorprende —no nos extraña, coincidiendo con su evento Google I/O 2010— con Google Font Directory: un catálogo tipográfico libre que podemos utilizar aplicando la regla @font-face sin necesidad de realizar las peticiones del archivo fuente a nuestro propio servidor. Solventando de esta manera las dos limitaciones que señalábamos anteriormente.
Dando un pequeño salto en el futuro y conociendo el rechazo que provoca el esfuerzo de omnipresencia que hace Google por acompañarnos en todas nuestras tareas como diseñadores y desarrolladores —y aún peor: en nuestro momentos de ocio en la red—, no sería de extrañar que algún aventurado emprendedor abra una cuña de mercado dando alternativas a este servicio.
Imaginad una empresa mediadora entre los derechos de autor de los catálogos tipográficos que ofrece servicios premium de gestión de fuentes (un buen catálogo y hospedaje) a desarrolladores; una especie de YouTube de las tipografías. Esta es la primera idea, si hay algún emprendedor en la sala seguro que se le ocurre alguna más.
En cualquier caso queda patente que la llegada de HTML5 y el soporte total de CSS3 ofrecerán las ventajas que ya hemos releído en infinidad de sitios, abrirán la puerta a nuevos modelos de negocio —o el fomento de algunos ya existentes— y sobre todo enriquecerán el diseño de la red.
Charlando con Juanj0 vía Twitter, hemos intercambiado una breve experiencia común entre todos los diseñadores web: qué cantidad de bocetos presentar a un cliente para el diseño de una web y cómo guiarlo en las elecciones. El tema es complejo, asi que comparto con vosotros una serie de ideas basadas en mi experiencia.
Lo primero que debes valorar es el método de trabajo propio. Si estás dentro de un equipo de trabajo y se te exije presentar más de un boceto, irremediablemente no tienes escapatoria y tendrás que pensar en varias versiones. Si por contra eres profesional autónomo ó tienes las riendas de la dirección de arte y puedes elegir el número de bocetos a entregar, tendrás la opción de presentar un único boceto (siempre supeditado a otras variables en la labor).
Variables como por ejemplo el tipo de cliente. Quizás tu cliente esté muy perdido a nivel gráfico de sus necesidades (a priori te contrata por eso). Es indiscutible que el que más sabe de su negocio es el cliente, pero no todos los cientes tienen claro los conceptos gráficos que deben servir como caballo de batalla para la presentación de su negocio/producto en la red.
Como véis tenemos una serie de posibles combinaciones que, además, pueden alterarse según tu metodología de trabajo o los conocimientos y/o requerimentos (caprichos también, todo hay que decirlo) de tu cliente. A continuación una guía rápida de premisas a tener en cuenta en ambos casos.
En el caso de que optes por ofrecer a tu cliente con un único boceto, ten en cuenta lo siguiente:
La mayoría de las premisas anteriormente citadas son necesarias en la entrega de uno o varios bocetos. Cuando entregues varios bocetos, debes tener en cuenta lo siguiente:
Como véis, lamentablemente no hay una regla mágica que especifique el numero de bocetos a entregar. Lo que si espero es que esta pequeña guía os sirva en el futuro. Suerte ¡y a diseñar! :)
Fotografía de aloshbennett en Flickr
A raiz de las participaciones que el proyecto flapa —ya sabéis, humor irreverente (+18)— ha hecho en el sector de la podcastfera, como:
tanto mi colega Daniel Calderón (aka Astracán) como yo mismo nos hemos puestos a investigar en pararelo cómo funciona este sector de la blogocosa dedicado a la creación de contenido propio cuyo soporte final es un archivo de audio.
Los podcasteros son generosos y comparten en varios sitios los recursos y conocimientos necesarios para que podamos crear nuestro propio podcast de manera sencilla en pocos pasos. Además de estos recursos que os señalo, podéis encontrar mucha más información en sitios como SlideShare, donde existen presentaciones que nos detallan todos los trucos paso-a-paso para la creación:
Y no sólo presentaciones del estilo HowTo podéis encontrar en SlideShare. También otros expertos del medio nos ofrecen presentaciones de serios análisis sobre el mundo del podcast.
Llevo poco tiempo escuchando podcast. Aún así creo que es el tiempo suficiente como para poder lanzar un par de opiniones y/o valoraciones desde dos perspectivas diferentes: como consumidor de contenidos y como creador de contenidos.
La mejor forma de exponer estas ideas no consiste únicamente en redactar ester artículo. Como el movimiento se muestra andando, en el núcleo creativo de flapa estamos estudiando algunas ideas para llevarlas al formato podcast. De dicho estudio extraigo esta documentación que me ha parecido importante compartir con vosotros.
Los frameworks (bibliotecas) de javascript son el recurso más generoso y sencillo para enriquecer el diseño y usabilidad de nuestras interfaces. Y además, proyectos como JQuery o Mootools nos lo ponen realmente fácil aunque sólo nos manejemos con CSS y xHTML.
Hoy os descubro un nuevo efecto extraido de la librería Mootols llamado mooCicle. Este efecto simula el pasar de las hojas de un cuaderno, estampas, fotografías, etc.
El efecto no se inclina por una utilidad muy generalista, pero seguro que en un blog de fotografía o para la página de un dibujante de comics encajaría muy bien.