Colrd, un excelente recurso para descubrir y crear paletas de colores

colrd

Ya sea que estemos buscando inspiración para nuestros diseños o estamos pensando en alguna combinación de colores para la decoración de nuestro hogar, Colrd es un interesante recurso a tener en cuenta.

En Colrd podemos buscar bajo diferentes criterios: colores individuales, paletas de colores, gradientes, patrones o si preferimos tener una visión completa de cómo se combinan los colores, podemos inspirarnos en las imágenes compartidas.

Cada una de las sugerencias que nos presenta vendrá con los códigos correspondientes, los utilizados en los fondos con degradados en CSS3, además de RGB y HSL. Y en algunas opciones nos permiten la descarga en diferentes formatos para editarlos en nuestros programas.

Si deseamos, también podemos participar creando nuestros propios diseños de una manera muy simple a través del editor de Colrd. Solo tenemos que escoger que tipo de aporte deseamos realizar (paleta de colores, imágenes, etc) y automáticamente se abrirá el editor con las herramientas necesarias.

Por ejemplo, si nos decidimos por una imagen podemos subirla desde nuestro equipo o escoger alguna de las sugeridas en la galerí­a de Colrd. El editor registrara cada uno de los colores de la imagen y podremos desplazarnos con el cursor para notar las diferentes tonalidades. Luego solo nos resta seguir los pasos para publicarlas.

Sin dudas, Colrd es un excelente recurso que podemos agendar para futuras consultas.

css3ps – Pasando de PSD a CSS3

Crear el diseño de un sitio web y transformarlo en plantillas con hojas de estilo CSS son dos trabajos que en muchas ocasiones requieren dos tipos de profesionales diferentes, siendo necesario invertir una gran cantidad de tiempo en la transformación de la idea en archivos que un navegador reconozca como «página web».

Si trabajáis con photoshop y queréis agilizar el trabajo, podéis usar varias opciones que ayudan a crear la hoja de estilo, total o parcialmente, opciones que pueden ayudar a ahorrar varios dí­as en la creación del proyecto. Aunque en muchos casos el código generado es bastante «sucio», es una buena forma de no comenzar desde cero.

Una de las últimas opciones que han aparecido en esta categorí­a es css3ps.com, herramienta que se integra en forma de plugin y trabaja con CSS3.

css3

Es un plugin gratuito para Photoshop que realiza el trabajo en la nube para convertir las capas en CSS3. Tarda bastante en realizar la transformación, pero hay algunas demostraciones en su web que muestran como el resultado puede ser bastante completo.

Aquí­ tenéis un ví­deo mostrando su funcionamiento: Continúa leyendo «css3ps – Pasando de PSD a CSS3»

screensiz.es – Tamaño, resolución y más datos sobre pantallas de móviles, tabletas y monitores

tamaños

Los desarrolladores de dispositivos móviles luchan a diario para que sus aplicaciones y sitios web sean atractivos en cualquier tipo de pantalla, algo que, principalmente en el mundo Android, puede resultar una Odisea.

En screensiz.es tenemos una web que nos ayuda a consultar estos datos de decenas de dispositivos móviles, existiendo también una sección para monitores y tabletas, así­ como la opción de seleccionar las variables que queremos consultar en la tabla.

No se trata de una aplicación compleja ni capaz de recibir el feedback de los lectores, pero sí­ es una herramienta que puede ser muy útil para tener en cuenta la popularidad de cada aparato (última columna), número calculado según la cantidad de búsquedas realizadas en Google sobre cada dispositivo, tal y como comentan en TNW.

Diseños que se adapten al tamaño de la pantalla del lector, esa es una de las tendencias del diseño web en 2013 que comentamos hace unas semanas, y sitios así­ ayudan a conocer más datos sobre el «mundo de las pulgadas».

200 iconos vectoriales gratis para utilizar en Google Maps

Map icons

Si estamos pensando en trabajar en proyectos que se basen en Google Maps notaremos que no cuenta con demasiadas opciones en iconos, para personalizar la forma en que deseamos se visualicen los diferentes puntos de interés, pero podemos tener en cuenta algunas alternativas como Map Icons Designer.

Map Icons Designer es un pack de 200 iconos vectoriales que nos ofrece más opciones  al momento de señalar marcadores de posición,  POIS o cualquier elemento a destacar en aplicaciones que trabajen con Google Maps.

Además de tener los marcadores más comunes (como los que indican zona de restaurantes, hospitales, hoteles, aeropuertos) también cuenta con una interesante combinación de iconos que podemos utilizar de forma creativa o para suplir aquellas situaciones o lugares que no se contemplan en los iconos de Google Maps. Y como bonus cuenta con 10 pins de diferentes colores con la opción de modificarlos, personalizando el tamaño y color.

Para saber si es lo que estamos buscando podemos visualizar una vista previa de todos los iconos que componen el pack en la página de presentación. Podemos descargar de manera gratuita el pack  (en PNG y PSD, en diferentes tamaños), y utilizarlo libremente tanto para uso personal como comercial, según lo indican sus creadores.

Google ya permite bajar las Google Fonts (tipografí­a) a nuestro ordenador, sincronizando con la versión web

google fonts

Google Fonts nos ayuda a usar tipografí­a original en nuestros proyectos web. El poder indicar con un pequeño codigo en nuestro sitio el tipo de fuente que queremos usar ha permitido que la estética de sitios de todo el mundo pueda personalizarse más, sin depender de las fuentes existentes en los ordenadores de cada lector.

Ahora, desde el Blog de Google para Desarrolladores, informan que podremos bajar a nuestro ordenador su colección de Google Fonts (www.fonts.com/web-fonts/google).

A partir de hoy, se puede descargar estas fuentes para el acceso sin conexión en el escritorio. Hemos hecho todas las fuentes del directorio de fuentes Google disponible en SkyFonts, una herramienta de Monotype que permite instalar y sincronizar las fuentes de la web en su dispositivos Mac OS X o Windows.

SkyFonts actualiza automáticamente las fuentes instaladas en el sistema cada vez que se actualizan las fuentes de Google. Con las fuentes instaladas localmente podremos navegar por sitios web que usen esa tipografí­a de forma más rápida, que que el navegador no tendrá que bajar los archivos de ningún lugar.

Comentan también que podemos bajar las fuentes originales desde code.google.com, sin depender de Skyfonts.

webcolourdata, para saber los colores utilizados por cualquier sitio web

colores

Los que trabajan con diseño web están acostumbrados a crear y gestionar paletas de colores para sus trabajos, una tarea que puede ser mucho más sencilla con webcolourdata (webcolourdata.com), aplicación web que extrae los colores utilizados por cualquier url.

La herramienta muestra la paleta y la distribución de tonos, así­ como una lista de sitios web que usan colores semejantes.

En los detalles de los colores extraí­dos podemos ver el porcentaje de cada uno utilizado en la url especificada, ayudando así­ a conocer perfectamente el estilo de cada trabajo.

En 2009 os escribí­ una lista de herramientas web que podemos usar para trabajar con colores, una lista que ha ido ampliándose con joyas como las que os presento hoy, divulgada hace pocas horas en webresourcesdepot.com

Nueva versión de Proto.io, la aplicación para crear prototipos de aplicaciones móviles

proto.io

Hablamos de Proto.io en 2011, cuando la aplicación aún estaba cerrada para el público en general. El tiempo ha pasado y ahora lanzan una versión bastante útil para los que trabajan en prototipos de aplicaciones.

Tienen la interfaz de usuario totalmente renovada, con las propiedades agrupadas para todos los componentes incluidos en el prototipo y posibilidad de seleccionar y editar las propiedades dinámicas individuales. Han mejorado considerablemente la sección de colores, siendo posible defiinr paletas de colores personalizadas para cada proyecto, así­ como los atajos de teclado, ideales para quien no quiere depender del mouse para crear.

La parte de interacción también es nueva, permitiendo que los clientes naveguen mejor por el diseño que les presentamos, algo fundamental para que puedan entender el concepto que queremos transmitir con el prototipo. Hay también un nuevo motor de animación, cinco veces más rápido que el anterior.

Con una impresionante cartera de clientes, y una versión gratuita limitada a un proyecto, Proto.io parece estar destacando bastante en su categorí­a.

Si alguno de vosotros ya es usuarios del sistema, comentad, que seguramente recibirán desde aquí­ el tan deseado feedback.

GoVisually, herramienta colaborativa para grupos de creadores gráficos

GoVisually

Si nuestra profesión está relacionada con el mundo del diseño y de la creación gráfica, GoVisually es el espacio colaborativo en Internet que podemos necesitar a la hora de colaborar con otras personas dentro de un mismo proyecto creativo.

Su funcionamiento es muy sencillo, ya que una vez estemos registrados e identificados, podemos crear nuestros propios proyectos, teniendo en cuenta que la versión gratuita nos permite disponer sólamente de un sólo proyecto. Cuando estemos dentro de cualquier proyecto, podemos subir imágenes y revisiones de las mismas, contando en nuestro espacio de trabajo con las herramientas necesarias para realizar las anotaciones y comentarios pertinentes dentro las propias imágenes.

Y como es una herramienta colaborativa, podemos contar con las aportaciones de aquellas personas a las que hayamos invitado a través del correo electrónico, para que una vez registradas, puedan aportar sus granitos de arena dentro del proyecto. No existe lí­mite en cuanto al número de colaboradores con los que podemos contar.

Si queremos trabajar tranquilamente, GoVisually nos permite trabajar a pantalla completa, de manera que se elimina la interfaz del navegador y obtenemos más espacio en pantalla para trabajar sobre las propias imágenes. Gracias a ello, podemos comparar múltiples revisiones de un mismo diseño, de los muchos que podemos subir, de forma más clara.

La herramienta no ofrece ningún tipo de complicación en su uso, ya que es fácil e intuitiva. Si por algún casual,no nos convence esta herramienta, en esta lista tenemos otras opciones.

Enlace: GoVisually | Ví­a: Hongkiat

Airwalk Design, un Pinterest para diseñadores que buscan inspiración

airwalk

Nos presentan en airwalk-design.com un nuevo proyecto que puede ayudar a los diseñadores a encontrar la inspiración necesaria para mejorar su trabajo.

Lo definen como un Pinterest para profesionales del diseño, con especialistas que se encargarán de filtrar el contenido subido por la comunidad de usuarios para mostrar únicamente lo mejor de lo mejor, en categorí­as de lo más diversas.

Surrealismo, fantasí­a, Freelancing & Startups… la plataforma no pone lí­mites al talento que quiera compartirse, existiendo integración con Dropbox para poder enviar los trabajos más pesados.

Cuando entramos en el sitio nos encontramos con la posibilidad de registrarnos o identificarnos, aunque pulsando al botón Sign-up ya podemos navegar por algunas obras de los autores que han decidido compartirlas usando la plataforma. Cada trabajo tiene detalles relacionados con el autor, siendo posible comentarla y votarla usando el sistema al que Pinterest nos tiene acostumbrados.

Un buen proyecto para perderse algunas horas navegando.

concept.ly – Una solución ideal para presentar diseños web a nuestros clientes

conceptly

Hemos comentado ya muchas aplicaciones creadas para el desarrollo y presentación de bocetos y prototipos. Basta buscar por mockups en cualquier buscador para entender las necesidades que los diseñadores tienen a la hora de obtener feedback de su trabajo, registrando las opiniones de los clientes y manteniendo el histórico de todos los comentarios realizados durante el contrato.

Nos presentan ahora concept.ly, un nuevo proyecto que se abre en fase beta y que promete ser gratuito para todos los que ayuden a probarlo en dicha etapa. Con él podemos subir nuestros diseños, presentarlos de forma organizada y crear puntos de control en cada región de las imágenes subidas, donde los clientes pueden opinar y los diseñadores pueden obtener el feedback deseado.

Son muchas las funcionalidades ofrecidas, desde el cambio rápido de una versión a otra, hasta el sistema de informes con todas las informaciones enviadas por clientes y trabajadores, permitiendo la colaboración en grupo y ofreciendo un sistema para compartir los diseños con un simple click.

Concept.ly ha sido creado por los responsables de yodiz.com, sistema de gestión de tareas y problemas que permite agilizar el trabajo en grupo y el desarrollo de proyectos con varios responsables.