Glimmer de Jetpack Compose

Diseño claro y fácil de leer para pantallas ópticas.

Jetpack Compose Glimmer es un sistema de diseño y un kit de herramientas de IU de Google para pantallas ópticas transparentes (OST), como los lentes de realidad extendida con cable. Un sistema de diseño proporciona decisiones reutilizables, desde primitivas de color, tipo y forma, hasta componentes y orientación.

Principios

Jetpack Compose Glimmer es uno de los primeros frameworks de IU optimizados para pantallas transparentes y el factor de forma de anteojos. La OST proyecta la luz del proyecto directamente sobre el mundo físico en lugar de usar pantallas opacas. Glimmer ayuda a los desarrolladores a crear IU de alto contraste y fáciles de leer que conservan la presencia en el mundo real.

Primero se muestra la pantalla transparente

Están optimizados y respaldados por la investigación y la ciencia del color para pantallas transparentes y el factor de forma de los lentes, lo que permite brindar experiencias ópticas transparentes, hermosas y bien pensadas.

Primero se muestra la pantalla transparente

Entrada de hardware

Las entradas de interacción se diseñaron en función de las capacidades de los lentes de realidad extendida con cable.

con propósitos específicos

Los estilos y los componentes se diseñaron específicamente para usarse de inmediato en lentes. Jetpack Compose Glimmer está optimizado para pantallas transparentes y la comodidad del usuario. Si bien está diseñada para un propósito específico, no es rígida. Te permite personalizar los aspectos destacados del enfoque, además del tipo y el color.

con propósitos específicos

Estilos

El lenguaje de diseño de Jetpack Compose Glimmer incluye un tema simplificado para una visibilidad óptima en los lentes. El color y el tipo se pueden personalizar para la expresión semántica y la cohesión de la app. Los principios del diseño visual enfatizan la claridad, la legibilidad y la mínima distracción. Si bien los lentes con cable tienen un campo visual más amplio y pueden tener menos interferencia del "mundo real", debes considerar mantener la IU fuera del camino.

Glimmer incluye un tema de referencia optimizado para los lentes OST. El color y el tipo se pueden personalizar para la expresión semántica y la cohesión de la app. El negro es transparente en una pantalla óptica. Ten esto en cuenta cuando diseñes, ya que los colores más oscuros se verán opacos o transparentes, pero esto también se puede usar para crear profundidad.

Esquema de colores

El esquema de colores de los lentes (colección de roles o tokens de color para definir el tema del color de tu app) consta de tres roles de color de acento, seis roles de color de superficie (o neutros) y sus contrapartes de color activado.

Esquema de colores

Personalizar color

El color principal se puede personalizar para usar el color de tu marca o el color de interacción principal. Ten en cuenta el contraste, la saturación y el uso de energía del color elegido.

Obtén más información sobre el sistema de color de Glimmer y las prácticas recomendadas.

Tipografía

Jetpack Compose Glimmer tiene una escala de escritura predeterminada optimizada. Compuestos por dos roles con tres estilos cada uno, los roles de escritura se basan en su propósito y jerarquía. Para obtener más información, consulta Tipografía de Glimmer.

Superficie y profundidad

Las superficies contienen contenido. Proporcionan puntos focales claros dentro del campo visual del usuario, que pueden contener contenido o acciones. Se usa más información sobre la superficie y la profundidad en Glimmer.

Componentes

Los componentes son bloques de construcción creados específicamente para crear tu IU. Tu app debe usar Jetpack Compose Glimmer para los componentes, ya que están optimizados para los casos de uso únicos de los lentes OST. Para obtener más información, consulta Componentes de Glimmer.

¿Todo listo para implementar componentes? Consulta la documentación de Glimmer de Jetpack Compose.

Los componentes de Glimmer abarcan varios propósitos de UX. Algunos componentes incluyen botones para acciones, indicadores de progreso para la comunicación, pilas para la contención, la navegación y los indicadores de voz para la entrada.