---

¿Qué son los Nine-patch?

Cuando trabajamos en un proyecto de aplicación móvil como diseñador UI para Android o iOS hay elementos gráficos que necesitan un reescalado de ciertas áreas en función del contenido, para ello es necesario añadir unos marcadores para indicar a la app las zonas delimitadas. Estos marcadores son unas simples barras que harán que la imagen se adapte a las medidas deseadas sin provocar distorsiones. Se tratan de los Nine-patch. En la siguiente imagen puedes ver por un lado el objeto original y por otro con los delimitadores añadidos.

Podemos observar que en el nine-patch hay 4 barras, estas indican la zona que en caso de ser necesario será redimensionada, sola y únicamente esta zona será la que se modifique, dejando el resto tal cual está.

¿Como creamos Nine-patch?

Software de desarrollo

Para generar Nine-patch, Google nos proporciona una herramienta dentro del SDK de Android «draw9patch». Otra opción es a través de Android Studio. Esta opción es la menos recomendada para diseñadores, ya que tendremos que instalar una aplicación exclusivamente de programación para poder realizar esta tárea, cuando tenemos a nuestra disposición otras alternativas.

Software de edición de imagen

También podemos crearlos usando herramientas de edición como Photoshop o Illustrator (aunque tenga otras funciones, podemos hacer uso de sus herramientas para generar Nine-patch), sabiendo previamente donde colocar los delimitadores, dejamos 1px de margen sobre el elemento gráfico para añadirlos. También podemos hacer uso de un plugin para Photoshop, ya que una vez tengamos añadido los delimitadores debemos exportarlos a las distintas densidades, tarea que nos facilita mucho. A continuación os dejo un video en el que se explica como trabaja.

Aplicaciones online

Por último existen herramientas online especialmente desarrolladas para este propósito que nos simplifica y agiliza mucho el trabajo. Durante el período que estuve trabajando en Talkao colaboré junto a otros diseñadores y programadores y me sugirieron una app online que te permite exportar los archivos nine-patch en diferentes densidades de pantalla.

Ir a app

Generador de Nine-patch, 5.0 out of 10 based on 2 ratings Categoría/s: Diseño gráfico Recursos