[TUTORIAL] Cómo crear iconos en Android Asset Studio 2024

04/09/2023 - Actualizado: 23/11/2023

Una de las partes más importantes de una aplicación es el diseño del icono. Contar con un diseño llamativo mejorará la imagen de nuestra aplicación y llamará mucho más la atención de los usuarios.

El icono que creemos debe de ser original y representativo de la aplicación. Si por otro lado, buscas formarte en temas relacionados con Android Studio, te explicamos qué es Android Studio M1 y cómo empezar a usarlo.

[TUTORIAL] Cómo crear iconos en Android Asset Studio 2021
[TUTORIAL] Cómo crear iconos en Android Asset Studio 2024

En este artículo te vamos a enseñar a como crear iconos de forma sencilla en Asset Studio 2024. Además de enseñarte a crear el icono, te vamos a mostrar también algunos de los aspectos que debes de tener en cuenta a la hora de crear estos dependiendo de como los vayas a utilizar.

Índice
  1. ¿Qué iconos puedes crear?
    1. Lanzador
    2. Icono en barra de acciones y pestaña
    3. Iconos de notificaciones
  2. ¿Cómo funciona Asset Studio?
    1. ¿Cómo se crean los iconos adaptables y heredados?
    2. ¿Cómo crear un ícono de selector heredado?
    3. ¿Por qué deberías de crear un icono llamativo?

¿Qué iconos puedes crear?

En Asset Studio puedes crear unos cuantos iconos diferentes. Vamos a ver los principales iconos que difieren según el uso de estos.

Lanzador

Este es uno de los iconos principales que debemos de diseñar. Este icono se conoce como lanzador porque la activación de este es la que lleva a ejecutar la aplicación. De esta forma, este icono se suele encontrar en la pantalla de inicio del teléfono.

Icono en barra de acciones y pestaña

Estos iconos son los que se encuentran en la barra de acciones de las aplicaciones. Son iconos más pequeños y suelen aparecer cuando desplegamos la multitarea, en donde podemos ver todas las aplicaciones que tenemos abiertas.

Estos iconos se colocan sobre la barra de la propia aplicación y sirven para que con un vistazo al mismo podamos identificar rápidamente la aplicación en cuestión. Estos iconos pueden contar con dos estados, seleccionado o no seleccionado, dependiendo de la elección del usuario.

Iconos de notificaciones

Este es el clásico icono que se muestra cada vez que la aplicación lanza una notificación al dispositivo. Image Asset Studio cuenta con íconos de notificaciones en los lugares correctos de los directorios res/drawable-density/

Dependiendo de la compatibilidad con la versión que te encuentres empleando el directorio puede cambiar. Veamos ahora como trabajar en Asset Studio en sencillos pasos.

¿Cómo funciona Asset Studio?

Una vez que ejecutes Asset Studio lo primero que tienes que hacer es seleccionar la vista de Android. Para ello, dirígete dentro de la ventana "Project" a donde pone "Vista de Android". Para empezar a trabajar en tu icono ahora que cuentas con la vista de Android puesta haz clic con el botón derecho dentro de la carpeta "res" y elige "New > Image Asset".

En el siguiente paso debes de tener en cuenta la compatibilidad de tu App. Si tu App admite Android 8.0, deberás de crear iconos de selector adaptables y heredados. Si se trata de una compatibilidad anterior, de 7.1 a anteriores, solo podrás crear un icono de selector heredado.

¿Cómo se crean los iconos adaptables y heredados?

Con la aplicación abierta, dentro del campo "Icon Type" deberás de elegir Launcher Icons (Adaptive & Legacy) ya que nuestra App es compatible con Android 8.0. Ahora, dentro de la pestaña "Foreground Layer" elige "Asset Type" y selecciona entre las siguientes opciones:

Si eliges "image", deberás de elegir una ruta de acceso en donde se encuentre la imagen. Puedes subir una imagen propia a internet y añadir aquí su ruta de acceso. Si lo prefieres, también puedes elegir la opción "Clip Art" para elegir una imagen preestablecida por el propio programa. Por el contrario, si solo deseas texto, elige "Text".

Ahora, dentro de la pestaña "Background Layer" deberás de seleccionar un Asset Type y elegir un color de fondo o una imagen si lo prefieres como capa. Dentro de la pestaña "Legacy" revisa la configuración predeterminada salvo que busques una configuración más avanzada y haz que los iconos sean redondos y heredados.

Con las opciones avanzadas puedes cambiar el nombre predeterminado del icono, ajustar los márgenes y cambiar los colores entre otras opciones. Puedes trastear todo lo que quieras hasta que elabores el icono que más te gusta y, una vez que lo tengas listo, haz clic en "Next". Con todas las opciones elegidas, el siguiente paso es hacer clic en "Finish" y ya tendrás listo tu icono.

¿Cómo crear un ícono de selector heredado?

Para crear un icono heredado deberás de elegir la opción de "Legacy Only" dentro del campo Icon Type. Elige un Asset Type y una vez más elige entre las diferentes opciones para elaborar tu icono, desde importar la imagen a través de una ruta hasta elegir un clip art o un texto.

Al igual que en el apartado anterior, puedes modificar como quieras el icono. Desde cambiar el nombre determinado, ajustar el margen o cambiar el color del icono, todo es posible. Cuando tengas todas las opciones elegidas, haz click en "Next" y, por último, en el apartado "Finish" y ya tendrás tu icono creado.

¿Por qué deberías de crear un icono llamativo?

Crear un icono original es la base de contar con una buena aplicación. Como te puedes imaginar, un usuario no solo contará con tu aplicación en su dispositivo, ya que contará con muchas más.

Cuando se tienen muchas aplicaciones es importante contar con un icono apropiado que sirva al usuario para encontrar pronto tu aplicación. Además, el icono debe de ser representativo para lograr que el usuario sepa de que trata la aplicación sin entrar en ella.

Piensa que puede haber pasado mucho tiempo o que puede que haya olvidado para que realmente servía tu aplicación. Si tu aplicación es una guía telefónica y eliges como icono la imagen de un animal, probablemente nadie pueda establecer una relación directa entre ambos. La elección de un buen icono es fundamental para crear una buena experiencia de usuario y para que así este se encuentre satisfecho con el mismo.

Tómate tu tiempo para crear un icono y no dudes en ir actualizándolo con el tiempo si la ocasión así lo merece. Muchas compañías actualizan sus iconos en base a las diferentes estaciones del año o promociones que ofrecen. No tengas prisa a la hora de crearlo y así tu aplicación será mucho más útil para el usuario.

Eduardo García Pérez

Eduardo García Pérez

Programador y Diseñador UAX 2.0 - Experto en #Programacion #Android #IOS y #Movilidad / Licenciado en informática por la UCM y con un master en biotecnología.

Quizás te interese...

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

7 − 2 =