Descripción general
Estos lineamientos son para los desarrolladores que participan en nuestro programa a fin de ofrecer en el Espacio Económico Europeo (EEE) una facturación alternativa al sistema de facturación de Google Play sin posibilidad de elección para los usuarios. Los desarrolladores con usuarios en el EEE que participan en el programa piloto de facturación a elección del usuario y ofrecen un sistema de facturación alternativo junto con el sistema de facturación de Google Play deben usar los lineamientos de UX sobre la facturación a elección del usuario. El objetivo de estos lineamientos de UX es mantener una experiencia del usuario coherente, ya que requieren que los desarrolladores muestren una pantalla de información a cada usuario la primera vez que este inicia una compra. Los mensajes para el usuario y las especificaciones de la IU correspondientes a la pantalla de información deben implementarse de acuerdo con los siguientes lineamientos.
![]() App de desarrollador |
![]() Pantalla de información para los usuarios |
Cómo seleccionar un idioma
Selecciona el idioma de los usuarios para ver las strings de texto correspondientes de la IU en las siguientes especificaciones de diseño.
- Mostrar todos los idiomas
- Seleccionar un idioma
- Búlgaro
- Catalán
- Croata
- Checo
- Danés
- Neerlandés
- Inglés
- Estonio
- Finlandés
- Francés
- Alemán
- Griego
- Húngaro
- Islandés
- Italiano
- Letón
- Lituano
- Noruego
- Polaco
- Portugués (Brasil)
- Portugués (europeo)
- Rumano
- Eslovaco
- Esloveno
- Español
- Sueco
Información para usuarios
La pantalla de información ayuda a los usuarios a comprender el impacto del cambio.
Cuándo se debe mostrar
La pantalla de información se debe mostrar a los usuarios al comienzo de su primera compra. No es necesario que se muestre este mensaje en las compras posteriores que realice el mismo usuario. Muestra la pantalla de información inmediatamente después de que un usuario realice una acción explícita para iniciar una compra.
Cuándo se debe mostrar el precio
El precio de compra debe estar visible y ser evidente para los usuarios antes de que se les muestre la pantalla de información.
Cómo se debe mostrar
La pantalla de información se debe mostrar en una hoja inferior modal. Una hoja inferior modal es similar a un diálogo modal que se desplaza hacia arriba desde la parte inferior de la pantalla y permanece fija en la parte inferior. Se superpone sobre todos los elementos de la IU en la pantalla subyacente. La pantalla subyacente se oculta detrás de una lámina oscura para indicar que no responderá a la interacción del usuario.
Consulta Google Material Design para obtener más información sobre el diseño y la implementación de las hojas inferiores modales.
Acciones del usuario
La hoja inferior se debe activar cuando un usuario presiona un botón o algún otro elemento de la IU de la app que inicie una compra. El usuario puede realizar las siguientes dos acciones posibles desde la pantalla de información:
Entendido
Cuando se presiona el botón "Entendido", se descarta la pantalla de información y se inicia la siguiente pantalla en el flujo de pago.
Más información
Cuando se presiona el botón "Más información", se abre un artículo del Centro de ayuda de Google en un navegador web.
Descartar
Si los usuarios desean descartar la hoja inferior y volver a la pantalla subyacente, pueden realizar las siguientes acciones:
- Presionar fuera del contenedor de la hoja inferior
- Presionar el botón "Atrás" del sistema Android
No es necesario que la pantalla de información se vuelva a mostrar después de que se haya descartado o después de que el usuario presione "Entendido".
Ejemplo: Cuando el usuario presiona para comprar en tu app, el botón activa la pantalla de información.
Especificaciones de diseño
La pantalla de información se divide en tres componentes: título, mensaje y botones. Estos tres componentes son obligatorios y deben contener los elementos de IU y texto exactos que se definen en estos lineamientos. No se debe incluir texto ni imágenes adicionales en esta pantalla. Sin embargo, se puede incluir imágenes o texto adicionales en otras pantallas.
- Título
- Texto 1
- Texto 2
- Botones
- Hoja inferior
- Lámina de fondo
Títulos
Texto |
Seleccionar idioma
|
Fuente | Roboto (se aplica a todas las fuentes) |
Tamaño de la fuente | 18 sp |
Color de la fuente | #202124 |
Texto 1
Se usa para destacar los puntos clave que se consideran información crítica.
Texto |
Seleccionar idioma
|
Tamaño de la fuente | 14 sp |
Altura de línea | 20 |
Color de la fuente | #5F6368 |
Texto 2
Se usa para información secundaria de menor prioridad.
Texto |
Seleccionar idioma
|
Tamaño de la fuente | 12 sp |
Altura de línea | 16 |
Color de la fuente | #5F6368 |
Botón 1
Texto |
Seleccionar idioma
|
Alineación del texto | Centrado |
Tamaño de la fuente | 14 sp |
Grosor de la fuente | Medium |
Color de la fuente | #01875F |
Color de fondo | #FFFFFF |
Dimensiones | Altura: 36. Ancho: ajustar al contenedor |
Radio de esquina | 4 dp |
Contorno | 1 dp, #DADCE0 |
Vínculo | Vínculos al artículo de ayuda de Google Play |
Botón 2
Texto |
Seleccionar idioma
|
Alineación del texto | Centrado |
Tamaño de la fuente | 14 sp |
Grosor de la fuente | Medium |
Color de la fuente | #FFFFFF |
Color de fondo | #01875F |
Dimensiones | Altura: 36. Ancho: ajustar al contenedor |
Radio de esquina | 4 dp |
Vínculo | Vínculos a la pantalla siguiente en el flujo de pago |
Hoja inferior
Dimensiones | Altura: variable. Ancho: 100% |
Radio de esquina | 8 dp, 8 dp, 0, 0 |
Información general | #FFFFFF |
Padding interno | Izquierda: 24 dp. Derecha: 24 dp. Superior: 32 dp. Inferior: 24 dp |
Elevación | 8 dp |
Horizontal
En la vista horizontal, la hoja inferior es más ancha que en la vertical, pero sigue las mismas especificaciones de diseño y funcionalidad.
Hoja inferior | Ancho: 500 dp como máximo. Padding interno: 24 dp |
Títulos | Igual que la vista vertical |
Mensajes | Igual que la vista vertical |
Botones | Altura: 36. Ancho: ajustar al contenedor |
Si deseas obtener detalles adicionales sobre el programa del EEE para la facturación alternativa sin posibilidad de elección para los usuarios y consultar las preguntas frecuentes, visita nuestro Centro de ayuda.