Pedro Puig

Entradas de la categoría ‘Utilidades’

ABRviewer o como visualizar pinceles de Photoshop

abrviewer

Cuando trabajamos con pinceles y somos de los que recopilamos innumerables archivos .abr (extensión propia de los archivos de pinceles en photoshop) sabremos perfectamente la molestia o falta de usabilidad que es visualizar estos pinceles uno a uno en nuestro Photoshop, llega un momento que ni nos acordamos cuales eran los que más nos habían gustado y estamos hablando por ejemplo en mi caso de un listado de más de 100 pinceles.

ABRviewer es una herramienta que permite visualizar los pinceles de Photoshop sin tener que instalarlos. El programa muestra en su interfaz, por cierto, poco cuidada, una vista en miniatura de los pinceles que forman nuestro paquete de brushes. Podemos elegir tanto el tamaño de la vista en miniatura como el color del pincel o del fondo. Además podemos exportar los pinceles que más nos gusten a formato PNG.

ABRviewer requiere tener instalado Microsoft .NET Framework 2.o para poder funcionar.

Descarga: ABRviewer

Capturar pantalla en un Intel Mac con Windows

Seguro que a muchos de vosotros os ha pasado, como puedo capturar una pantalla en Windows con un IMAC, como sabréis, a simple vista no existe la conocida tecla “Impr Pant”. Por lo que si queremos capturar una pantalla deberemos hacer clic en las siguientes teclas:

ALT + F14

Plantillas de navegadores en PSD

browsertemplatesv2

A la hora de presentar nuestros diseños de sitios web es conveniente simular como van a quedar en los templates de distintos navegadores.

En Piksels podemos descargar un archivo PSD (3,5 mb) con las 3 resoluciones más usadas (800×600, 1024×768 y 1280×1024). Podremos editar desde la barra de direcciones, activar o desactivar el scroll, el favicon.

Las simulaciones de navegadores incluidas en el psd son  Firefox para Mac OS X, Internet Explorer y Firefox para Windows.

La forma de utilizarlo es sencilla, hacemos una copia de nuestro trabajo y la pegamos en la resolución que más nos interese.

Os recomiendo tener muy bien guardadito este psd, seguro que lo necesitareis.

Vía: Diego Mattei

Cómo será tu futuro hijo

Esta es la típica utilidad en la que vale la pena perder un ratito de nuestro tiempo.

Crispin Porter y Bogusky han desarrollado para Volkswagen América, una simpática aplicación para comprobar cómo será nuestro hijo dependiendo de cómo seamos nosotros.

Routanbabymaker 3000

La utilidad se llama Routanbabymaker3000 y ha sido realizada para promocionar el Routan (monovolumen americano). Es muy sencillo, lo único que tenemos que hacer es introducir las fotos de tu chico/a y ver el careto de tu futuro hijo que podremos imprimir, descargarlo en jpg o publicarlo en internet.

Vía: Briefblog

El significado del color

El color es uno de los medios más subjetivos con el que cuenta el diseñador. Dado que la percepción del color es la parte simple más emotiva del proceso visual, tiene una gran fuerza y puede emplearse para expresar y reforzar la información visual. También hay que tener en cuenta, que el color puede cambiar su significado dependiendo del país y su cultura.

La elección del color a la hora de crear un logotipo o crear un sitio web no es aleatorio. Cada color refleja un estado de ánimo, un sentimiento, una emoción. El blanco se asocia a la luz, la pureza.., el amarillo representa la alegría, la energía etc…

En usability post nos muestran las sensaciones que transmiten los colores utilizando la herramienta Cymbolism, donde se busca averiguar, a través de una encuesta (por cierto bastante tediosa), si estas asociaciones son particulares de cada persona o si verdaderamente existe cierto tipo de unanimidad en los criterios de las mismas.

El significado del color

Vía: Usability Post

Abrir archivos .ICO con Photoshop

Siempre he echado de menos que el photoshop pudiera trabajar con archivos con extensión .ICO. Me tocaba ir al Microangelo para trabajar con este tipo de archivos y no resultaba muy cómodo que digamos.

Pero leo el otro día en Diego Mattei, que Telegraphics ha desarrollado ICOformat que es un plugin para Photoshop que nos permite abrir un archivo ICO o guardar con esa misma extensión una imagen.

Basta con descargarse el zip y copiar el archivo ICOformat en la carpeta formatos de archivos dentro de plugins

Es gratuito y está disponible tanto para PC como para MAC

Vía: Diego Mattei

La importancia de los wireframes

Leo en Nudonation un muy interesante post donde explica cómo se crea un proyecto web desde el inicio hasta la fase final, gráficamente hablando por supuesto. Desde el esbozo en lápiz y papel, pasando por el desarrollo de wireframes (bosquejo de la ubicación de elementos en una pantalla) hasta la fase de prototipado (la usabilidad y los sistemas de navegación van indirectamente implícitos en el desarrollo de los wireframes) .

Lo importante de crear wireframes previos al comienzo de la fase de diseño, nos evitará hacer modificaciones en fases posteriores (aunque esto no es siempre así, ya se sabe…).

Wireframe del sitio web Mexbest

Ya sea un microsite, un blog, una web o incluso diseños para imprenta, es recomendable crear un wireframe que nos ayudará a definir un mejor proyecto final. Para la realización de wireframes hay multitud de herramientas. Yo utilizo el Photoshop, me permite crear los distintos elementos en capas, es fácil de modificar y me resulta cómodo no salir del programa en el que luego voy a realizar el diseño, pero lo importante es que sea una herramienta en la que el diseñador, se sienta a gusto.

Stencil Kit de Yahoo

Stencil Kit de Yahoo

La importancia de crear un Wireframe (diseño de alambre), antes de comenzar con el prototipado, es cada vez más aconsejable.

Hay numerosas herramientas para la creación de Wireframe, pero tal vez las más importantes sean Omnigraffle y Visio de Microsoft.

Ahora Yahoo, presenta el Stencil Kit que es un conjunto de objetos predefinidos que nos ayudarán a crear de forma rápida un wireframe desde nuestra aplicación favorita.

El Stencil Kit de Yahoo esta disponible tanto para usuarios de Omnigraffle como de Visio. Pero si tu programa para la creación de Wireframes es otro, puedes descargártelo en PDF, PNG y SVG.

Otra ayuda más…

Vía: Torresburriel

PNGs transparentes en Internet Explorer 6

Es sabido que Internet Explorer 6 no se lleva muy bien con los PNGs transparentes; leo en JVcreación que existe una forma rápida y cómoda de solucionar este problema, los detalles están en Google Code. Simplemente hay que insertar el siguiente código entre las etiquetas y nombrar las imágenes PNG con el sufijo “-trans.png”:

Solución para los PNGs transparentes

Parece ser que además de solucionar esta incompatibilidad, resuelve otros defectos del navegador en su lucha por cumplir los estándares.

Multicolr, flickr por colores

Multicolr, Flickr en colores

Multicolr es una herramienta que nos permite buscar fotos en Flickr clasificándolas por colores. El funcionamiento es sencillo, seleccionamos un color de la paleta de la derecha, a continuación las imágenes que tengan relación con ese color, aparecerán a nuestra izquierda.

Podemos ir añadiendo colores a esa selección, las imágenes se irán filtrando de acuerdo a esos colores seleccionados.

Es una utilidad que puede sacarnos de algún apuro, aunque siempre deberemos estar atentos a las restricciones de uso de las imágenes