viernes, 17 de agosto de 2012

Editar iconos rápido y simple en Mac

Algo que tuve que hacer hace poco fue editar imágenes usadas en el menu tipo tabs de una aplicación porque no se veían muy bien.

La imagen original es:
  
En la aplicación se veía:



Unos compañeros de Artech (departamento de desarrollo) me ayudaron a responder las siguientes preguntas...

¿Por que se ven mal las imágenes?

Bueno, esto es por el alpha channel.
El tema es que iOS toma cada pixel del icono por su valor Alpha (transparencia) y no por el color del mismo. Si un pixel tiene 0% de Alpha se ve Gris y si un pixel tiene 100% alpha se ve negro. Lo mismo para Azul cuando se selecciona el tab.
Valores intermedios de Alpha se traduce a valores intermedio de gris o azul.

¿Como puedo arreglar las imágenes?

Hay varias aplicaciones para editar rápidamente imágenes pero una en particular que los usuarios de mac usan diariamente: Preview.

Paso a paso

Abrir la imagen en Preview

Elegir la herramienta InstantAlpha:
Este lazo inteligente agarra todos los pixeles contiguos del mismo color (para diseñadores esta es una herramienta muy utilizada en photoshop o similares):
Seleccionar los pixeles que se quiere editar:


Luego de seleccionado directamente se borran esas zonas

Resultado final:

Mas informacion:
http://greenerpastures.dk/blog/iphone-udvikling/how-to-make-tab-bar-icons
https://developer.apple.com/library/ios/#documentation/userexperience/conceptual/mobilehig/IconsImages/IconsImages.html

No hay comentarios:

Publicar un comentario en la entrada