La plantilla de navegación presenta un mapa base y la información de ruta opcional.
Cuando un usuario conduce sin indicaciones paso a paso basadas en texto, las apps pueden mostrar un mapa de pantalla completa que se actualiza en tiempo real. Durante la navegación activa, las apps pueden mostrar tarjetas opcionales con maniobras y detalles de la superficie, así como alertas de navegación.
La plantilla de navegación incluye lo siguiente:
- Mapa base en pantalla completa dibujado por la app
- Tarjeta de ruta (opcional) con las próximas maniobras
- Tarjeta de duración estimada del viaje (opcional) con la hora estimada de llegada (ETA), el tiempo hasta el destino y la distancia restante (o una pantalla de información alternativa con opciones de texto e íconos personalizados)
- Tira de acciones con hasta 4 acciones en la app, visible solo como se describe en Visibilidad de las tiras de acciones
- Barra de acciones en mapa opcional con hasta 4 botones para la interactividad con el mapa
Pantalla del mapa en el clúster
Durante la navegación activa, las apps pueden mostrar un mapa en el clúster de instrumentos con la plantilla de navegación. El clúster es el área del tablero detrás del volante.
Los mapas del clúster deben cumplir con los siguientes requisitos:
- Renderizado de forma independiente, pero puede copiar la pantalla principal si es necesario.
- No interactivo. Se quitan los elementos interactivos, como los botones.
- Tema oscuro. Se recomienda dibujar una versión con tema oscuro del mapa de clústeres para reducir la posibilidad de que el conductor desvíe la atención de la ruta.
El mapa de la app en el clúster solo se mostrará en ciertos momentos, según factores como el estado de navegación, la preferencia del OEM del vehículo (en AAOS) y lo que se muestra en la pantalla principal (en AAP).
Para ver un ejemplo de flujo del usuario que involucra el clúster, consulta Cómo ver un mapa en el clúster.
Ejemplos de pantallas de clúster y centro
Detalles de la tarjeta de ruta
Cuando la tarjeta de ruta está en estado de ruta (a diferencia del estado de mensaje), muestra la siguiente información:
- Paso actual: Incluye un ícono (por lo general, una flecha de dirección), la distancia y el texto de la pista (que puede incluir tramos de imágenes, como marcadores de ruta).
- Indicaciones de carril (opcional): Se muestran como imágenes simples de asistencia de carril o como una imagen más grande de la intersección (tamaño flexible con una altura máxima de 200 dp).
- Próximo paso (opcional): Incluye un ícono y una sugerencia, y solo puede aparecer en la parte inferior de una tarjeta de ruta que no incluya una imagen de intersección.
Otra opción en el estado de enrutamiento es que la tarjeta de ruta muestre una animación de spinner (no se muestra aquí) para indicar estados transitorios, como carga, cálculo o cambio de ruta.
En algunas circunstancias, la información de la ruta puede mostrarse en una barra de navegación flotante, como se muestra en Cómo agregar una parada mientras conduces.
Estado del mensaje de la tarjeta de ruta
Cuando la tarjeta de ruta está en estado de mensaje, muestra un mensaje en lugar de instrucciones sobre la ruta. El mensaje se puede usar para comunicar situaciones como la llegada a un destino o errores en la ruta.
En el estado del mensaje, la tarjeta de ruta puede incluir lo siguiente:
- Un mensaje no vacío relacionado con el enrutamiento de hasta 2 líneas de longitud
- Una imagen o un ícono (opcional)
Notificaciones de navegación: Paso a paso (TBT) y normales
Notificaciones de TBT: Cuando una app proporciona indicaciones de TBT basadas en texto, también debe activar notificaciones de TBT. Estas notificaciones se usan para exponer las indicaciones de TBT fuera de la plantilla de navegación. Las apps pueden personalizar el color de fondo de las notificaciones de TBT para una mayor visibilidad.
Notificaciones normales: Para comunicar otros mensajes relacionados con la navegación, como cambios en la configuración de la ruta, las apps de navegación también pueden enviar notificaciones normales (no de TBT) (como se muestra aquí) o usar alertas de navegación. Pueden aparecer incluso cuando se muestra la tarjeta de ruta.
Alertas de navegación
Las alertas de navegación proporcionan un mensaje breve y temporal, y acciones opcionales en un formato que no bloquea la ruta de navegación. El contenido debe ser simple y pertinente para la tarea de navegación. Por ejemplo, la alerta puede describir un cambio en las condiciones del tráfico o preguntar si el conductor puede recoger a un cliente.
Cada alerta incluye lo siguiente:
- Título y subtítulo opcional
- Ícono (opcional)
- Indicador de progreso: Puede ser una barra o, de forma opcional, estar integrado en un botón cronometrado.
- Hasta 2 botones, en los que un botón se puede designar como principal o como un botón cronometrado (con un indicador de progreso, como se muestra en la figura anterior)
Las alertas se pueden descartar de las siguientes maneras:
- El usuario selecciona cualquier acción
- Se agota el tiempo de espera después de
Xsegundos (configurable) - Descarte de la app sin acción del usuario
Ejemplos de plantillas de navegación
Requisitos de UX de la plantilla de navegación
Desarrolladores de apps:
| OBLIGATORIO | Mostrar al menos 1 maniobra en una tarjeta de ruta |
| OBLIGATORIO | Incluye al menos un botón de acción en la tira de acciones para habilitar flujos de usuarios. |
| OBLIGATORIO | Incluye un botón de desplazamiento en la barra de acciones en mapa si la app admite gestos de desplazamiento. |
| SHOULD | Usar un tema oscuro en los mapas que se muestran en el clúster |
| SHOULD | Incluye solo los botones relacionados con la interactividad del mapa en la barra de acciones en mapa (por ejemplo, brújula, volver a centrar o modo 3D). |
| SHOULD | Incluye un botón para finalizar la navegación cuando proporciones indicaciones paso a paso. |
| SHOULD | Usa símbolos estandarizados o coherentes con los símbolos internacionales o específicos de cada país. |
| SHOULD | Usa la imagen de la intersección solo para mostrar contenido relevante para la navegación, abarcando el ancho de la tarjeta con la imagen. |
| SHOULD | Proporciona imágenes de carriles con fondos transparentes para que se combinen con el fondo de la tarjeta de ruta. |
| SHOULD | Usa las alertas solo para brindar información que no distraiga y que sea pertinente para la tarea de navegación actual. |
| MAY | Muestra texto de apoyo breve debajo de un carril (se recomienda Roboto 24) y una relación de contraste más baja para los carriles no destacados. |
| MAY | Mostrar 2 maniobras en una tarjeta de ruta cuando se producen en rápida sucesión |
| MAY | Incluye imágenes, como marcadores de ruta, en el texto de las tarjetas de ruta (paso actual y paso siguiente). |
| MAY | Mostrar un mapa completo cuando el usuario conduce sin indicaciones paso a paso basadas en texto o está en el modo de conducción libre |
| MAY | Elige mostrar u ocultar la tarjeta de ruta y los componentes de estimación del viaje según sea necesario. |
| MAY | Dibuja detalles y alertas relacionados con la conducción en el mapa, como la velocidad actual, el límite de velocidad y la cámara más adelante. |
| MAY | Personaliza el color de fondo de la tarjeta de ruta y cámbialo durante la sesión de navegación para reflejar el tipo de ruta o cualquier otra condición pertinente. |
Recursos
| Tipo | Vínculo |
| Referencia de la API |
NavigationTemplate,
NavigationTemplate.Builder
|
| Guía para programadores | Accede a las plantillas de navegación |