Home ¬Ľ Dise√Īo ¬Ľ Dise√Īo de apps: La importancia de la tipograf√≠a
Dise√Īo de apps: La importancia de la tipograf√≠a

Dise√Īo de apps: La importancia de la tipograf√≠a

Cuando hablamos de dise√Īo tambi√©n hablamos de la estructura, el esqueleto, de la app en s√≠. No es simplemente algo que se deje influenciar por las tendencias. Aunque estas hacen que var√≠e el dise√Īo de apps con nuevas tendencias, lo cierto es que la l√≥gica de interacci√≥n que definimos en el dise√Īo permanece pr√°cticamente intacta¬†e invariable.

La tipograf√≠a es uno de los elementos que m√°s ha variado con el paso del tiempo. Ha pasado de ser un elemento olvidado a ser una paso m√°s en el proceso de dise√Īo de una aplicaci√≥n m√≥vil. En la siguiente imagen podemos ver la tipograf√≠a de una app hace unos a√Īos y la comparamos con el tipo de letras que utilizamos en las aplicaciones actualmente:

La importancia de la tipograf√≠a en el dise√Īo de apps

L√≥gicamente la est√©tica es el gran motivo para mejorar el dise√Īo de apps a trav√©s de buenas tipograf√≠as. Pero realmente ¬Ņcu√°les son los motivos t√©cnicos para prestar atenci√≥n al tipo de letra utilizado en una app? No s√≥lo es para hacerla m√°s bonita, si no por otros motivos que afectan directamente al usuario y a la marca de la app. Veamos:

  • Legibilidad: Este es el motivo directamente relacionado. Elegir una buena tipograf√≠a supondr√° que el usuario leer√° m√°s c√≥modamente nuestra app. Especialmente si nuestra aplicaci√≥n contiene mucho texto. Dise√Īar apps como por ejemplo la aplicaci√≥n de un medio de comunicaci√≥n como en los or√≠genes de El Pa√≠s o el New York Times es complicado, ya que tiene muchos tipos de usuarios y de distintas edades y preferencias. Lo que algunas apps de este tipo optan por hacer es permitir al usuario configurar el tama√Īo y estilo de la letra. Siempre existir√° una tipograf√≠a definida pero podremos adaptarla a las necesidades de cada usuario.

tipografiŐĀa en disenŐÉo de apps 2012 vs 2016

  • Toda la experiencia de usuario: En definitiva, la tipograf√≠a afecta directamente a la experiencia que tendr√° el usuario dentro de nuestra apps. El dise√Īo de apps debe centrarse en el tipo de letra relacionado con la UX, porque si es dif√≠cil leer los contenidos de la app, se tardar√° m√°s en comprender lo que nos ofrece. Como consecuencia, ser√° una app poco usable y el usuario dejar√° de utilizarla e incluso la borrar√° del dispositivo m√≥vil.
  • Profesionalidad: Una tipograf√≠a que no encaje con la filosof√≠a de nuestra marca dar√° un aspecto de poca coherencia. Por ejemplo, aplicaciones serias, de grandes empresas comerciales con un perfil de alta profesionalidad tendr√°n una tipograf√≠a muy distinta de aquellas apps que buscan en entretenimiento o dar un aspecto jovial y divertido.

Obviamente existen otros motivos para prestar atenci√≥n a la tipograf√≠a, algunos de ellos relacionados con factores subjetivos y preferencias personales. No obstante escoger la tipograf√≠a correcta para tu dise√Īo de apps pasa por testearla teniendo en cuenta estos tres factores. Siempre ser√° recomendable tener en menta m√°s de una opci√≥n para que el due√Īo de la app, o el responsable de tomar las decisiones tenga d√≥nde elegir. E incluso se puede proponer realizar tests A/B para comprobar qu√© tipo de texto obtiene mayores conversiones y genera m√°s interacci√≥n entre los usuarios reales.

¬ŅC√≥mo leemos dentro de las apps?

Debes saber que el 95% de la comunicaci√≥n digital es a trav√©s de texto. Es decir, que por mucho que transmita un dise√Īo, un logo o un icono, realmente es el texto el que nos transmite y con lo que nos comunicamos con el usuario (y el usuario con nosotros o con otros usuarios en nuestra app).

Utilizamos letras, n√ļmeros y mezclas de ambas de todo tipo‚ÄĒa trav√©s de oraciones‚ÄĒ. Aunque al principio, cuando aprendemos el lenguaje escrito y hablado, es una habilidad dif√≠cil de conseguir finalmente acabamos leyendo sin apenas esfuerzo cuando el texto tiene sentido en su contexto.

Ebook 1 App Descarga

Aprovechar esta cualidad para nuestra app es clave para una buena interacci√≥n y comunicaci√≥n con nuestro usuario. La facilidad con la que se lean los textos ‚ÄĒ es decir, la legibilidad de una app ‚ÄĒ afectar√° a la experiencia de usuario y a la usabilidad de √©sta. La tipograf√≠a forma parte esencial de este proceso, una buena tipograf√≠a f√°cil de leer siempre ser√° tu mejor opci√≥n. Pero ¬Ņc√≥mo escoger una ‚Äėbuena‚Äô tipograf√≠a?

Elementos clave de una buena tipografía

Hemos dicho muchas veces que una buena tipograf√≠a es imprescindible a dise√Īar aplicaciones m√≥viles, pero no hemos dicho qu√© elementos son los que la definen como la tipograf√≠a correcta.

El dise√Īo y la madurez de la tipograf√≠a es lo m√°s valorable, y es lo que m√°s aportar√° al dise√Īo de apps. ¬ŅSabes a qu√© debes prestar atenci√≥n para lograr que tu tipograf√≠a sea as√≠? Pues toma nota:

  • El tama√Īo de la letra: LA propia Apple nos dice en su p√°gina de ayuda a developers que ‚Äúde nada sirve que tu tipograf√≠a sea la m√°s bonita del mundo si no se puede leer dentro de tu app. De hecho el tama√Īo o cuerpo de texto recomendado por la firma americana para el dise√Īo de apps para dispositivos iOS es de entre 11 y 17 puntos, muy similar para Android. Pero no solamente importa el tama√Īo. Debemos tener en cuenta que aunque en web tendremos entre 60 y 75 caracteres por l√≠nea, en aplicaciones m√≥viles deberemos reducirlo a entre 35 y 50 caracteres por l√≠nea. Lo ideal es conseguir que las l√≠neas en apps no sean muy largas para no perder el hilo ni sean complejas, pero tampoco muy cortas porque hacen que el usuario pierda el ritmo natural de la lectura. Aunque existen aplicaciones que ajustar√°n el tama√Īo de letra seg√ļn est√© configurado en el dispositivo, no siempre es as√≠, de modo que es recomendable prestar atenci√≥n.

tamanŐÉo de texto app

  • Los espacios en blanco: Cuando nos dedicamos al dise√Īo de apps m√≥viles, contamos con muy poco espacio para organizar los contenidos de la app, por eso debemos hacer un uno inteligente de los espacios blancos de la app. Eso significa, a diferencia de lo creen la mayor√≠a de usuarios y no expertos, que no debemos aglutinar un mont√≥n de texto, im√°genes o botones en cada pantalla. M√°s bien al contrario. Tenemos que dejar los espacios entre l√≠neas, respetar los m√°rgenes y dar claridad al dise√Īo. En resumen, no hay que tener miedo a dejar espacios blancos en nuestro dise√Īo. Habr√° que pensar especialmente en las pantallas importantes (las de pago, suscripci√≥n, etc) en las que queramos una conversi√≥n. En estos casos es mejor centrarnos en solo ese contenido para no despistar al usuario aunque eso implique dejar espacios en blanco.
  • El contraste: Conseguir un buen contraste entre texto y fondo es necesario para que los que queremos decirle al usuario a trav√©s del texto se lea adecuadamente. La opci√≥n √≥ptima es texto negro sobre fondo blanco o al rev√©s. Aunque si todos sigui√©ramos estas directrices todas las aplicaciones se parecer√≠an mucho. Por eso a partir de este punto podemos jugar con los colores y ver qu√© combinaci√≥n encaja con los colores de la marca y con el estilo de nuestra app m√≥vil. Pero siempre tendremos en mente que debe de haber un gran contraste entre ambos colores (el del fondo y el de las letras).
tipografiŐĀa san francisco
tipografiŐĀa san francisco – dise√Īo de apps iOS
  • Los bordes ¬Ņserif o sans serif?: Este es un gran debate que todav√≠a sigue aplicable para p√°gina web y por supuesto se extiende al dise√Īo de web apps y el dise√Īo de apps nativas o de cualquier tipo. Los sistemas operativos imperantes‚ÄĒAndroid e iOS‚ÄĒlo tienen muy claro si observamos sus fuentes determinadas para el texto de sus dispositivos. Android recurre a la fuente Roboto para sus textos, mientras que Apple recurre a la familia de las fuentes Helvetica para sus dispositivos, y a la versi√≥n Helvetica Neue apartir de iOS 7. Ambas son fuentes sans serif. En ambos casos podemos decir que se escogieron pensando en l√≠neas sencillas y finas. En el caso de iOS no era una fuente que mejorara especialmente la legibilidad, pero la llegada de la tipograf√≠a San Francisco en 2015 lleg√≥ para solucionarlo debido a una necesidad de mejor legibilidad por la llegada del Apple Watch.

La llegada de las apps y una progresiva optimizaci√≥n de su dise√Īo y usabilidad va a afectar tambi√©n a la tipograf√≠a de las aplicaciones m√≥viles. Los expertos en dise√Īo de apps, en UX y dem√°s expertos mobile ser√°n los responsables de encontrar una tipograf√≠a adecuada a tu app m√≥vil.

Proyecto Dise√Īo

Escrito por

Yeeply
Yeeply

Yeeply es una plataforma premium especializada en el desarrollo de apps móviles y sitios webs a medida. Desde 2012 nuestros clientes nos confían el desarrollo de sus proyectos, y nos apoyamos a nivel técnico en los mejores profesionales certificados: desarrolladores de aplicaciones móviles o web freelance, empresas de software top, y agencias mobile más punteras. ¡Crear una app o crear una web nunca ha sido tan rápido, confidencial y seguro como con Yeeply! Publica tu proyecto de software en Yeeply y deja que nuestro equipo te ayude durante todo el proceso.