Todas las aplicaciones necesitan un icono singular, del mismo modo que un negocio necesita una buena puerta de entrada. Subestimar la importancia y las características de esa puerta puede provocar que los ojos, y los pies, de un usuario se dirijan al negocio del vecino. Han pasado ya unos años desde este estudio, pero el feedback que dieron los usuarios sobre el diseño del icono no sería muy distinto del que darían hoy en día: “El diseño del icono de la app influencia la percepción inicial de si se trata de una app de calidad, o no” “Si fuera un icono mal diseñado, pasaría de largo” “Los iconos bonitos y claros me empujan a investigar de qué va la app” El icono no solo aparece en las Stores y el SpringBoard del dispositivo junto al resto de apps descargadas. Necesitas que tu icono se vea bien en la configuración de settings, en campos de búsqueda, en resoluciones bajas, normales, en resoluciones retina. Tu icono aparece en distintos usos, y en todos debe funcionar bien. Antes de nada, familiarízate con las especificaciones técnicas de las plataformas y sus principios de diseño. Las guías de estilo tanto de iOS como de Android ofrecen toda la información que necesitas para generar de manera adecuada este recurso. Por ejemplo, ten en cuenta que todos los iconos iOS tienen la misma forma; sin embargo, en Android puedes personalizarla. Sigue las templates y acertarás: img_templates            Cada plataforma tiene sus propios principios gráficos y es interesante encajar bien en su carácter. Por así decirlo: si te invitan a un cóctel, no vistas de noche. iOS te invitará a una fiesta donde prima la sencillez; Android, a una donde lo que importa es la naturalidad. img_plataformas              Aquí podéis ver qué dice iOS sobre el icono de la app y qué dice Android por su parte. Aún así, te proponemos esta lista de do’s and dont’s. Te ayudará a respetar los principios de las plataformas sin renunciar al branding de tu producto: DO’S

  • Una sola forma o símbolo. Sintetiza el espíritu de tu app de forma clara y memorable.
  • Sencillo. No abigarres de efectos, elementos y detalles tu icono. Debe ser reconocible con lo indispensable.
  • Escalable. Que el icono sea sencillo ayuda a que funcione bien en la variedad de tamaños en los que es necesario. El icono puede tener tamaños tan dispares como 1024×1024 y 29×29 píxeles.
  • Contrastado. Comprueba que el icono se ve claramente sobre varios fondos, no solo en colores neutralizadores como blanco, negro o gris.
  • Consistente. Lo que muestres en el icono debe tener sentido con lo que el usuario se va a encontrar dentro de la app. Usar la misma paleta de colores para ambas cosas es la estrategia más sencilla para correlacionarlas.
  • Diferencial, o no. Tu competencia directa o indirecta, ¿cómo diseñan sus iconos? ¿Te interesa resaltar tu producto o seguir el patrón? El diseño de tu icono debe atender a intereses tanto de marketing (dentro de las Stores) como de usabilidad (una vez instalada).
  • En iOS, si vas a añadir un borde a tu pieza, comprueba que estás aplicando el radio correcto a los bordes.

Ejemplos de apps que han decidido diferenciar claramente sus iconos: img_does              DON’TS

  • No incluyas palabras. A medida que escales el icono hasta 29×29, el texto será progresivamente ilegible.
  • No uses el logo de tu compañía. Si el logo es muy complejo, puede llegar a ser una mancha irreconocible. Además, el producto puede representar un servicio muy concreto de tu empresa. En este caso, estarías echando a perder la imagen global de tu marca si representas tu app solo con tu logo. Te animamos a crea un imaginario gráfico coherente con tu marca para solventar este problema.
  • No uses fotos. Como en los dos casos anteriores, la escalabilidad de las fotos suele ser bastante mala. Simplifica y vencerás.
  • No copies elementos de interfaz de la plataforma para representar tu servicio. Sigue sus tips, pero no los copies. Tampoco te interesa parecer una app preinstalada.
  • En Android, intenta no caer en la tentación de reciclar el icono que has diseñado para iOS. Si eres usuario de Android, verás en tu SpringBoard muchos iconos con el border radius característico de iOS. Sé imaginativo con las posibilidades que ofrece Android.

Algunos ejemplos de errores recurrentes: img_dont              Recuerda: Por cada icono launcher con texto, logos, horror vacui, bordes mal ajustados, templates mal aplicados y colores random, un diseñador… llora. Autora del post: Georgina Armisen (@GiArmisen), Lead UX/UI en SlashMobility]]>

Desde: http://slashmobility.com