Este artículo explica tanto a Developers como Graphics Designer como crear sus recursos gráficos ó Assets para aplicaciones Android a través de Illustrator, usando Scripts que facilitan la labor.
Contexto:
Cuales son las dimensiones con las que debo diseñar mis imágenes para el icono, splash, logos y otros recursos gráficos en Android teniendo en cuenta que existen diferentes dimensiones de los dispositivos?.
Solución:
Usar la línea base de diseño proporcionada por Google, un par de Scripts y una herramienta de diseño como Illustrator.
Teoría:
Las pantallas de los dispositivos se clasifican de dos formas, por tamaño de la pantalla o por densidad de la pantalla.
1. Clasificación por tamaño de la pantalla (size): small, normal, large, xlarge.
2. Clasificación por densidad de la pantalla (dp): ldpi, mdpi, hdpi, xhdpi, xxhdpi, xxxhdpi.
La estrategia es trabajar con LA CLASIFICACIÓN POR DENSIDAD DE LA PANTALLA.
Fig.1: Existen las siguientes categorías definidas para todos los dispositivos en Android: small, normal, large, extralarge, extra-extra large y extra-extra-extra large.
Cuando trabajamos con densidad de pantalla tenemos las siguientes unidades de medición de resolución:
- px: pixel
- dp: densidad independiente de pixel
- dpi: densidad por pulgada.
La relación entre las unidades la define la siguiente fórmula px = dp * (dpi / 160).
Lo recomendable es trabajar todos nuestros recursos con dpi = 160, es decir que cada px = dp. En otras palabras, asumimos que cada pixel equivale a un dp. Con esto tenemos entonces:
36x36 (0.75x) for low-density
48x48 (1.0x baseline) for medium-density
72x72 (1.5x) for high-density
96x96 (2.0x) for extra-high-density
180x180 (3.0x) for extra-extra-high-density
192x192 (4.0x) for extra-extra-extra-high-density.
Bueno, toda la teoría anterior era sólo para contextualizar la solución ya que con los Scripts desarrollados la tarea se reduce a dos operaciones, crear y exportar los Assets.
1. Descargue los Scripts de mi repositorio Scripts-Android-Illustrator de GitHub.
2. Instale los Scripts en Illustrator: Esto lo haces copiando los dos archivos descargados al directorio [directorio de instalación]\IllustratorPortable\App\Illustrator\Presets\en_US\Scripts.
3. Reinicie Illustrator.
4. En la opción File --> Scripts de Illustrator encontrarás dos operaciones: Android-Crear-Assets para crear el Assets que necesitas (Icono Launcher, Iconos de notificaciones ó Iconos de botones de acción). También encuentras las operación Android-Exportar-Assets para exportar el Asset en formato PNG, guardar el proyecto vector como .ai y generar el archivo .svg en caso de querer usar la función Vector Asset introducida por Android Studio 1.4.
En el siguiente video puedes ver a mayor detalle los pasos anteriormente descritos.
ConversionConversion EmoticonEmoticon