Crypto Casino
Torrent Gear
TOP-10 de técnicas visuales para la interfaz de misión
Tres cosas son importantes en la interfaz de las misiones: la claridad del objetivo, la sensación de progreso y el ritmo de las pequeñas victorias. Abajo hay diez técnicas que aumentan la participación/compleción y reducen las quejas sin sobrecargar la pantalla.
1) Escalera de progreso en lugar de una franja «infinita»
Qué es: una escala de T1→T2→Final segmentada con umbrales y puntos de recompensa explícitos.
Por qué: es más fácil para el cerebro entender las etapas discretas que el continuo «progreso del 63%».
Cómo dibujar
3-5 divisiones, firmar cada una: «T1 100 puntos», «T2 300», «Final 600».
Mostrar las recompensas recibidas directamente en las divisiones (iconos FS/caché/insignia).
Haga clic en la división → pop-up «qué se ha dado/cuando se quemará».
A/B-idea: escalera con iconos vs escala seca. Espera: + 3-5 p.p. a la completion T1.
2) «Cuánto queda» en unidades comprensibles
Lo que es: junto a la progresión mostramos el equivalente de esfuerzo: puntos → rondas de → minutos.
Fórmula debajo del capó (aproximadamente)
«Quedan 120 puntos ≈ 8 rondas de 0,5 € ≈ 6-8 minutos».
Reglas
Primero el tiempo, luego las rondas y el dinero.
Cuenta por la mediana de las últimas 10-20 acciones del usuario (pistas adaptativas).
Actualizar cada 2-3 segundos, sin «saltos».
A/B-idea: «quedó en las gafas» vs «quedó en minutos». Expectativa: −10 -15% de salidas tempranas.
3) Tarjetas de paso (Step Cards) con «un objetivo por pantalla»
Qué es: cada paso de la misión es una tarjeta independiente con un objetivo importante y el botón "¿Cómo se cuenta? ».
Composición de la tarjeta
Título: «Paso 2 de 3».
Objetivo: 1 línea («Recoge 300 puntos o 150 giros»).
Progreso: mini escalera/chip «180/300».
Botón «?» → listado de juegos incluidos/excluidos, tapas, ejemplos.
Do: fuente grande, contraste jerárquico visual.
Don 't: sobrecargar con pequeñas condiciones y asteriscos.
4) Objetivos OR: «horquilla» visual de tres caminos
Lo que es: en lugar de texto «o/o» - tres botones de ruta iguales (Rápido Competir Con la trama).
Reglas
Los tres caminos son visibles al mismo tiempo; el activo está resaltado.
Bajo cada botón se encuentra el mini-ETA: «~ 8-10 min», «1 veces × 20», «100 spins».
Micro texto
"Elija una ruta conveniente. Se puede cambiar en cualquier momento - el progreso continuará".
A/B-idea: tubs vs botones-azulejos. Espera: + 4-7 p.p. participation_net.
5) Áreas de recompensa en el liderazgo y en las misiones
Qué es: dividimos la tabla/cuadrícula en zonas (Top-3 / 4-10 / 11-50 / 51 +), mostramos la recompensa mínima garantizada de cada zona.
Vizual
Dados de color de las zonas; cerca de la posición del jugador - «A la zona 4-10 le quedan 2.400 puntos».
Troquel «Garantizado: FS × 10» justo en la zona, sin «buscar en las reglas».
Uso: quita el «techo de cristal», forma un objetivo realista.
6) Módulo de timebox con «ventana de respiración»
Qué es: temporizador visual de fase activa (15-20 min) + tarjeta «pausa sin penalización».
Pantalla
Temporizador de anillo con la firma «Ventana 20:00».
Al final: animación suave + selección «Volveré más tarde »/« Extender» (si es válido).
Mensaje: «Pausa no interrumpirá el strick».
Efecto: crece Sessions/DAU, reduce la fatiga.
7) Micro-animaciones de «chispa» y esqueletos de carga
Lo que es: flashes/confeti ligeros con progreso y recompensas; esqueletos + chimer en lugares con datos.
Gaidas por movimientos
Duración 200-350 ms, curvas ease-out/ease-in-out.
No para solapar el contenido principal, sino para «resaltar».
Los esqueletos repiten la geometría de las tarjetas; Simulador 1. 2–1. 6 segundos.
A/B-idea: con animación vs sin. Expectativa: −8 -12% de salidas tempranas, + CTR en «continuar».
8) Tulas contextuales: «¿Cómo se cuenta?» y «¿Por qué no va?»
Lo que es: el icono «?» junto al objetivo abre un mini-hyde con fórmulas, ejemplos y frecuentes errores.
Plantilla de bloque
«Como creemos»: fórmula + 1 ejemplo.
«Capas»: por apuesta/min/día (números).
«¿No hay progreso?» 3 razones + referencias a juegos/modos excluidos.
Además: reduce drásticamente los tickets en el zapport.
9) Color, contraste e iconografía (WCAG + tema oscuro)
Reglas básicas
Contraste de texto mínimo WCAG AA (4. 5:1), grande - 3:1.
Color ≠ único medio de significado: agregue iconos/patrones.
Iconos: 2-3 formas básicas (estrella - recompensas, objetivo - paso/misión, relámpago - «chispas»).
Tema oscuro: fondo # 0F/12, las «chispas» brillan sin RGB venenosos.
Micro-copyright
«La recompensa se quemará en 12 horas» - siempre al lado del botón «Recibir».
10) Estados vacíos, errores, etiquetas «quemará»
Qué es: pantallas pensadas cuando no hay datos/misiones, y cuando algo salió mal.
Es vacío
Ilustración + "Hoy es libre. ¿Quieres probar "Menú del día"?"
Botón «Recoger misión →» (lleva a la selección).
Errores
"No fue posible actualizar el progreso. Repetimos"... + spinner ≤3 segundos → "Probar más "/" Chat en vivo".
Estado «Se quemará a través de X» mostrar en la tarjeta de recompensa y en la lista de premios.
Elementos de interfaz adicionales
El chip "tope alcanzado": "200/200 puntos/hora es el límite. Restablecimiento a las 00:00".
La etiqueta «casi-alcanzó»: un indicador amarillo cuando ≤150 puntos al umbral.
Transiciones de juegos: «Cambiar el juego - el progreso continuará» (anti-grind).
Localización: números con espacios indisolubles «€1.000», formato de hora de 24 horas, nombres de días locales.
Micro-textos (se puede insertar tal como está)
«Quedan 120 puntos ≈ 8 rondas de 0,5 € (6-8 min)».
"Estás en la zona 11-50. Garantizado: FS × 10. Hasta 4-10 - 2400 puntos"
"Cap alcanzado: 200 puntos/hora. Restablecimiento a las 00:00 (Europe/Kyiv)"
«Elige el camino: Rápido/Competencia/Con la trama - se puede cambiar en cualquier momento».
Métricas para experimentos de IU
Efecto de IU en el embudo: CTR «Start», participation_net, T1/T2 completion.
Conductual: Early-exit (≤5 min), time-to-T1/T2, switch-rate paths, ver tools «?».
Calidad: quejas/1k, errores de actualización de progreso, latency p95.
Valor: Δ ARPPU (net), Prize & Bonus/Active, Net Uplift.
Marco A/B (corto)
Unidad: usuario; sticky-assignment; estratificación (platform/geo/payer-flag).
Hipótesis: escalera vs carril; «minutos» vs «puntos»; los botones de ruta vs taba; con animación «chispas» vs sin.
CUPED: pre-sesión-tiempo como covariable; ventana de ≥2 semanas con fases de D0-D2/D3-D7.
Lista de verificación del diseñador de misiones
- Escalera T1→T2→Final con iconos de premios.
- Bloque «Cuánto queda» en minutos/rondas.
- Tarjetas de pasos, un objetivo por pantalla.
- Las rutas OR son tres botones visibles con ETA.
- Áreas de recompensa y dados «garantizados».
- Temporizador de tiempo + «ventana de respiración».
- Micro-animaciones de «chispa», esqueletos/chimer.
- Tulas «¿Cómo se cuenta?» + razones «por qué no va».
- Contraste/iconos/tema oscuro; «se quemará a través de X».
- Estados vacíos y errores benévolos.
Mini caso (sintético)
Antes: una franja de progreso sin umbrales, el texto «quedan 120 puntos», capas ocultas, no hay estados cálidos vacíos.
Después: escalera con premios, «8 rondas/6-8 min», botones de ruta OR, módulo timebox, tulas «?», «tope alcanzado», chispas + esqueletos, zonas de premios.
Resultado 4 semanas vs control: participation_net + 6. 4 p. m., completion + 10. 8 p.p., Early-exit −18%, quejas/1k −31%, Δ ARPPU (net) + 1 €. 7 при Prize&Bonus/Active +€0. 5.
Una buena interfaz de misión es la disciplina visual: pasos en lugar de «pantano de porcentajes», pistas específicas de esfuerzo, recompensas visibles y dinámicas suaves. A ello hay que añadir la disponibilidad, las tulas claras, las cajas de tiempo y las animaciones ordenadas... y las misiones comenzarán a funcionar como «ritmo de pequeñas victorias» y no como una larga y aburrida racha de progreso.