En la revista NET del mes de Junio de 2016 encontramos un interesante artículo donde Matthias Martin nos inspira a mejorar nuestras cualidades en CSS con este nuevo reto “100 días con CSS” donde  estuvo 100 días seguidos donde cada uno de ellos elaboraba un pequeño diseño con CSS, que nos puede ser muy útil a la hora de coger idea para nuestros diseños.

Los mockups de interfaz de usuario (UI) ayudan a responder a las principales preguntas visuales. El objetivo de este artículo es ayudar a crear mockups UI más rápidos, sin sacrificar la calidad de tu trabajo. 1. Primero dibuja tus ideas Hacer un esbozo en dibujo es rápido, fácil y sin riesgos. Antes de la sumergirte en píxeles y dimensiones de cuadrícula, esbozar tus pensamientos puede ser útil como un primer borrador para organizar tus ideas y experimentar un poco. Es más sencillo poner a prueba un concepto en un boceto que en un…

Los vectores gráficos escalables, conocidos  como SVG (Scaleable Vector Graphics), son un lenguaje gráfico que emplea el formato XML. Estas imágenes se pueden editar con un editor de textos básicos. Estos están soportados desde ya hace algunas versiones en la mayoría de navegadores de la actualidad, IE, Chrome, Firefox, Opera. El formato SVG está recomendado por el W3C. 

La espera es normalmente una actividad enormemente desesperante: Es improductiva, aburrida, e incluso tensa.

 Y así, si les preguntas a los usuarios si te van a esperar, muchos de ellos se negarán. De acuerdo con un estudio realizado por Forrester Research, casi la mitad de los usuarios confían en que un sitio se cargue en unos dos segundos. Si tarda más de tres, el 40% se irán.

Cabe entonces preguntarse si debes priorizar el tiempo de carga sobre todo lo demás. Si lo haces, tendrás que deshacerte de muchas de las características que enriquecen tu UX, como los gráficos interactivos o un vídeo o una imagen de alta resolución.

La solución: asegúrate de proporcionar diversión durante la espera. O por lo menos, hacer que la espera sea más eficiente, menos aburrida, y menos estresante. Te proponemos 5 consejos para conseguirlo.

En este artículo vamos a ver los conceptos para la optimización de un archivo SVG, tomando como ejemplo la optimización del logo de Twitter (pasaremos de 932 bytes a 297).

¿Por qué utilizar SVG? Debido a que IE8 casi ya no se utiliza y los SVG son muy útiles y deben sustituir a las fuentes icono.

Trabajar con SVG en un flujo de trabajo RWD (Responsive Web Design) por lo general implica una fase de diseño y una fase de desarrollo. La fase de diseño está a cargo de los diseñadores que pueden saber o no cómo codificar. Y debido a la naturaleza del SVG tanto como formato de imagen, como formato de documento, cada paso que se da en el editor de gráficos al crear el SVG afecta directamente al código resultante y por lo tanto al trabajo del desarrollador a cargo de la incrustación, scripting o animación del SVG.

Es muy frecuente que el código resultante después de una optimización de un archivo SVG requiera una revisión debido a que la creación del SVG por parte de los diseñadores no está orientado a una mejor optimización del código, lo tratan como un formato de imagen más.

Por ello, hay una serie de consejos aplicables que en la creación del SVG que mejoran el resultado. En este artículo nos centraremos en el editor de gráficos Adobe Illustrator (AI).