Enfócate en la experiencia del sistema, la experiencia de la app y las funciones adicionales para diseñar tu experiencia de referencia de retratos.
El diseño de referencia vertical se basa en la pantalla principal y contiene los siguientes elementos persistentes de la IU del sistema:
Pantalla principal
La pantalla principal proporciona un punto de partida integral para los conductores, con todos los controles de fácil acceso. Satisface la mayoría de las necesidades de los conductores, por lo que pueden concentrarse en navegar por la ruta en lugar de cambiar entre apps.
Sin salir de esta pantalla, el conductor puede acceder a lo siguiente:
- La barra de estado en la parte superior, que incluye controles rápidos y un selector de perfiles
- La capa base en el cuerpo de la pantalla, que suele ejecutar una app de navegación
- Barras de navegación del sistema y de control en la parte inferior


Barra de control
La barra de control contiene controles para contenido multimedia (video y música), podcasts, Bluetooth, radio y llamadas activas.
En el caso de las apps de música y teléfono, la barra de control se encuentra sobre la barra de navegación en la mitad inferior de la pantalla. Los controles cambian de contenido multimedia a llamada telefónica activa cuando el usuario acepta una llamada entrante.
Controles multimedia
Los controles multimedia permiten reproducir, pausar, retroceder y adelantar el contenido. También permiten que el usuario marque favoritos y acceda a controles personalizados adicionales, si los hay.




Controles de llamadas telefónicas activas
Los controles del teléfono permiten silenciar el altavoz, cambiar a Bluetooth y cancelar una llamada.
Barra de estado
La barra de estado aparece en la parte superior de la pantalla y contiene el selector de perfil, los controles rápidos y la información del clima y la hora.
- Controles rápidos:
- Bluetooth: Estado de Bluetooth
- Conectividad: Wi-Fi, red móvil y hotspot
- Pantalla de brillo: Permite al usuario ajustar el nivel de brillo de la pantalla
- Reloj: Pantalla digital de la hora actual
- Información del clima: Muestra la temperatura exterior
- Selector de perfiles: Muestra el perfil de usuario en uso y permite que el usuario seleccione otro perfil si es necesario.
Los elementos de la barra de estado aparecen en el mismo orden para los automóviles con conducción a la izquierda y a la derecha.
Los usuarios pueden activar y desactivar la pantalla del clima en Configuración.
Para conocer las prácticas recomendadas y obtener orientación sobre cómo personalizar la barra de estado, consulta Prácticas recomendadas para la barra de estado.
Controles rápidos
Los controles rápidos de la barra de estado brindan acceso sencillo a Bluetooth, conectividad y brillo de la pantalla.






Selector de perfil
El selector de perfiles en la barra de estado permite seleccionar perfiles rápidamente y acceder a la configuración de perfiles con un acceso directo.


Prácticas recomendadas para la barra de estado
Prácticas recomendadas para desarrolladores de apps:
- Usa la transparencia para evitar cubrir el contenido de la app: Si la app se posiciona parcialmente detrás de la barra de estado, en lugar de estar completamente debajo de ella, los desarrolladores de apps deben dejar la barra de estado transparente.
- Aplica el color de forma estratégica: Si la app se encuentra completamente debajo de la barra de estado, los desarrolladores de apps deben elegir un color para la barra de estado.
Barra de navegación del sistema
La barra de navegación del sistema aloja controles para el selector de aplicaciones, el asistente digital, el Centro de notificaciones y los controles de comodidad.
La barra de navegación del sistema se encuentra en la parte inferior de la pantalla y muestra los siguientes controles:
- Temperatura de la cabina: Temperatura del auto
- Selector de aplicaciones: Apps disponibles para el conductor
- Asistente digital: Acceso al asistente digital elegido, como Asistente de Google
- Centro de notificaciones: Acceso al Centro de notificaciones
- Climatización: Acceso a los sistemas de climatización del vehículo
Para obtener orientación sobre cómo personalizar la barra de navegación del sistema, consulta Personalización de la barra de navegación del sistema.
Selector de aplicaciones
El selector de aplicaciones se muestra en el espacio principal de la app, en una vista de cuadrícula estándar del selector de aplicaciones. Las apps están ordenadas de la A a la Z. Los usuarios pueden reordenar las apps según sus preferencias.


Asistente digital
Cuando se presiona, esta opción invoca al asistente digital activo para la comunicación por voz.
Centro de notificaciones
El Centro de notificaciones lleva al usuario a todos los mensajes de notificación guardados, tanto leídos como no leídos.


Control de climatización
El ícono de control de climatización brinda acceso fácil a los sistemas de control de climatización del automóvil.


Funciones adicionales
Las funciones adicionales en el diseño de referencia de retrato que se aplican tanto a la experiencia del sistema como a la experiencia de la app incluyen la capa de voz y los temas.
Capa de voz
La capa de voz es una capa transparente que se encuentra sobre todas las capas y sobre las barras de navegación del sistema y de control.
Puede ejecutar cualquier tipo de asistente digital integrado en el sistema, como Asistente de Google.
Temas
Hay dos temas disponibles para usar según las condiciones de luz.




Usa el tema oscuro por la noche o en condiciones de poca luz para reducir el brillo. Obtén más información sobre la visibilidad de un vistazo por la noche.
Usa el tema claro para ayudar a los conductores y pasajeros a ver las pantallas del automóvil bajo la luz solar directa. La navegación del sistema puede permanecer en negro para combinarse con el hardware.