10 reglas para usar fuentes en realidad virtual

En un escritorio, el texto es la parte más importante del contenido. Como sabes, el contenido es un rey. Pero seamos honestos, las fuentes no están diseñadas para vivir en un espacio tridimensional. Debido a una situación, muchos diseñadores y desarrolladores de realidad virtual siguen utilizando textos en escenas virtuales. Votaría para evitar el uso de cualquier contenido de texto, pero desafortunadamente, es imposible. Así que investigué un poco para descubrir las reglas básicas del uso de fuentes en la realidad virtual.

Talla

Me gustaría comenzar con un tamaño de fuente. Con el hardware actual y especialmente las resoluciones de pantallas, es extremadamente importante.
Desafortunadamente, las métricas habituales como píxeles y ems no funcionan en un espacio 3d. Para definir el tamaño de un objeto en 3d se utiliza el tamaño percibido que se mide en grados.
Sí, se ve raro. Pero como sabemos el tamaño de fuente óptimo para dispositivos móviles y la distancia promedio de la pantalla del teléfono a los ojos, podemos contar el tamaño percibido recomendado. Entonces, hagamos algunos cálculos. Puede omitir esta parte y desplazarse un poco hacia abajo para obtener el resumen.

Tomemos el tamaño óptimo de 16 píxeles para el diseño móvil. Para este caso, tomaré el teléfono Google Pixel como ejemplo. Este teléfono tiene la pantalla con la resolución de 441 píxeles por pulgada y con densidad xxdpi 2.6 inicial. Entonces 16 píxeles tendrán 41.6 píxeles en una pantalla real y 0.093 pulgadas o aproximadamente 0.24 cm de tamaño físico. Para obtener el tamaño percibido, usaré 25 cm como la distancia promedio de los ojos a la pantalla.
El grado de tamaño percibido de la fuente de 16 px del teléfono móvil se evalúa a 0.55 °.
Veamos cuál debería ser el tamaño del texto en realidad virtual cuando se colocará a 1 metro de distancia de un observador con 0,55 ° de tamaño percibido. Existe la gran calculadora simple que ayuda a hacer que tales estimaciones sean muy fáciles (sizecalc.com)
Dice que la fuente debe tener 0.96 cm de altura. No creo que pueda leer una fuente de un cm desde una distancia de 1 metro tan fácil como una fuente de 16 px desde un teléfono.
Pero hay otro problema. ¿Qué tan detallada será dicha fuente en la pantalla de un teléfono móvil cuando un observador use gafas de cartón? También es fácil de contar. Como el campo de visión en los auriculares daydream es de 90 °. El teléfono con píxeles tiene una pantalla con un ancho de 1080 píxeles. Significa que para un grado solo hay 12 píxeles. Y para nuestro texto que solo toma 0.55 ° de la vista percibida son solo 6.6 píxeles. Lo que definitivamente no es lo suficientemente cercano.
Vayamos desde otro lado y digamos que para la legibilidad de la fuente de 16 píxeles, esta fuente debe tener un tamaño de al menos 16 px. Como sabemos en un grado de vista percibida son 12 píxeles.
Lo que significa que la fuente con el tamaño de 16 píxeles físicos, en los auriculares daydream, habrá percibido un tamaño de 1.33 °. Y si desea colocar esta fuente en la escena VR a una distancia de 1 metro del observador, esta fuente debe tener una altura de 2,32 cm.
Esto ya debería estar bien. Antes de realizar las pruebas, cuentemos cuál debería ser el tamaño de la fuente en realidad virtual que utilizará los 41,6 píxeles físicos en la pantalla del teléfono móvil. Este tamaño tiene el tamaño percibido de 3.46 °. Y colocado en texto de 1 metro debe tener 6.04 cm de altura.

Así es como se verán 3 tipos de fuentes en VR:
Izquierda: 6.6 píxeles en la pantalla del móvil, vista percibida de 0.55 °, altura de 0.96 cm en 1 metro
Frontal: 16 píxeles en una pantalla móvil, 1.33 ° de vista percibida, 2.32 cm de altura en 1 metro
Derecha: 41,6 píxeles en la pantalla del móvil, 3,46 ° de vista percibida, 6,04 cm de altura en 1 metro

Prueba esta escena de realidad virtual
1) El tamaño mínimo legible para la fuente en VR es 1.33o o altura de 2.32 cm en la distancia de un metro. El tamaño recomendado de la fuente es 3.45o o altura de 6.04cm en la distancia de un metro.

Posición en el espacio

La posición y la rotación son características únicas para las fuentes VR. Y esto es extremadamente importante. Para el ejemplo anterior, tomamos el caso cuando la fuente está al nivel de los ojos, y dijimos que está exactamente a 1 m de distancia. Pero si un usuario se mueve por medio metro de amante o más alto, obtendríamos 1.12 metros de distancia. Lo que definitivamente no mejora la legibilidad. Por lo tanto, al colocar las fuentes en un espacio en 3D, debemos recordar que estará aproximadamente en el nivel de los ojos de los usuarios. Con 3 auriculares dof, es más fácil de alcanzar, ya que la posición del espectador es fija y está definida de antemano. Por ejemplo, para A-Frame por defecto, es 1,6 m. Pero con las experiencias a escala de sala, es un poco complicado ya que mide la altura real del usuario. Tomar la altura promedio de 1.6 metros está bien. En caso de que queramos colocar la fuente más baja, podemos rotarla en el espacio para obtener la misma distancia perpendicular. Por ejemplo, la fuente colocada 75 cm más abajo del nivel de los ojos del usuario y 75 cm lejos del usuario, girada 45 ° será de los ojos del usuario también en 1 metro.

2) La fuente debe estar orientada perpendicularmente al observador.

Hay dos ejemplos de colocación de contenido.
1. En la superficie plana:

Prueba esta escena de realidad virtual

2. Girado alrededor del observador:

Prueba esta escena de realidad virtual

Longitud de la línea

Como sabemos 50–75 para computadoras de escritorio y 30–40 para dispositivos móviles son preferibles la longitud de línea. Además, la resolución VR de las pantallas y la autoconciencia del usuario es peor, lo que empeorará la capacidad de mantener la línea. Pero para descubrir las opciones preferibles, echemos un vistazo a los ejemplos. Es fácil tener la idea de que en la realidad virtual la longitud de la línea debe depender del tamaño de la fuente en sí, ya que incluso 60 letras en un tamaño de 3.45 ° ya son demasiado largas.

Prueba esta escena de realidad virtual
3) La longitud de la línea en VR debe ser de alrededor de 20 a 40 símbolos por línea. Con una línea de fuente más grande debe ser más corta.

Tipo de letra

Si la gente sigue discutiendo si es serif ok o no para el escritorio, para VR definitivamente es mejor evitar el uso de fuentes con trazos. Y cualquier otra fuente agradable con características decorativas. La tipografía ideal es sin formas cuadradas, como Exo 2, por ejemplo. Las excepciones son grandes títulos.
Como estamos obteniendo más de la cantidad mínima requerida de píxeles, podemos experimentar un poco con estilos y fuentes. Pero no más de lo requerido por una atmósfera de escena VR.

Prueba esta escena de realidad virtual
4) En VR, mejor trabajo sin tipografías.

Peso

Con una resolución tan baja, evite las fuentes delgadas y livianas. El trabajo regular y audaz está bien. También mejor usar estilos cuidadosamente negros. El peso es una opción ligeramente peor para agregar contraste a diferentes tipos de contenido. Para este caso mejor ajuste el tamaño.

Prueba esta escena de realidad virtual
5) Las fuentes en VR deben ser más audaces que en las pantallas.

Altura de la línea

En el escritorio, una buena idea es mantener el espacio entre líneas entre 1.2 y 1.5. En VR funciona el mismo enfoque. También depende de la longitud de la línea. Pero como en VR para un observador es más complicado mantener el foco, recomendaría cambiar esta ventana a 1–1.3. Y, por supuesto, es mejor evitar minimizar el espacio de menos de 1.

Prueba esta escena de realidad virtual
6) La altura de la línea para la fuente VR debe estar alrededor de 1–1.5.

Alineación

En el escritorio y la alineación del centro móvil no es preferible, y la alineación correcta es un no-no (por supuesto, si no es idioma árabe) Pero en realidad virtual cualquier alineación es buena, es razonable y se explica. Por ejemplo, si se trata de una anotación para objetar, se puede colocar casi desde cualquier lado. Por ejemplo, se vería extraño si el texto alineado a la izquierda se relacionara con un objeto que se coloca en el lado derecho.

Prueba esta escena de realidad virtual
7) La alineación de fuentes en bienes inmuebles virtuales depende del contexto.

Color y contraste

En general, este es obvio. En todo este lío, cualquier contraste adicional es mejor.
La gente dice que en la interfaz de usuario de escritorio sobre fondo blanco es mejor no usar color negro puro para los textos. El gris oscuro mejora la legibilidad y tiene menos contraste. No creo que funcione en realidad virtual también. La mala resolución y el mal enfoque del observador hacen que tales detalles sean imperceptibles.

Prueba esta escena de realidad virtual
8) Asegúrese de que las fuentes tengan suficiente contraste de color en VR.

Animación

Esto es interesante. En el escritorio, el parpadeo y el movimiento de texto están absolutamente prohibidos. Pero en la realidad virtual no solo debe permitirse, sino incluso promoverse como una forma de guiar la atención del usuario. Por supuesto, debería haber algunos límites. Una etiqueta no debe distraer, pero las pequeñas ondulaciones o cualquier otra animación simple aumentan las posibilidades de que el usuario note este texto.

Prueba esta escena de realidad virtual
9) Para atraer la atención del usuario, la fuente se puede animar en VR.

Comportamiento

Esto merece fácilmente un artículo separado. Por ahora tengamos en cuenta que algunos conceptos que se habían establecido durante años en el escritorio no funcionan en realidad virtual, por ejemplo, el enlace azul. Además, las cosas que se trasladaron a la interfaz de usuario desde el mundo físico también pueden ser útiles en la realidad virtual, como los botones.

Prueba esta escena de realidad virtual
10) Debería ser fácil definir cuándo el texto es accionable.

Siento que esta investigación planteó más preguntas que dieron respuestas. Pero definitivamente es el buen comienzo de una discusión.

Aquí está la escena con portales a todas las escenas de realidad virtual probadas

Como las fuentes no están adaptadas para el espacio 3D, mejor evite usarlas. En caso de que sea imposible, debemos prestar más atención a cómo se usan y asegurarnos de que el usuario pueda leerlos.

Y lo más importante: sigue probando.

Si descubre otras reglas, no dude en dejar un comentario o ponerse en contacto conmigo en Twitter.

Si encuentra útil este artículo, presione el botón de aplaudir a continuación para ayudar a otros a encontrarlo.