Zonehaven — App pública de alertas y evacuación

Soamee desarrolló AWARE, la aplicación orientada a la ciudadanía de Zonehaven, una plataforma de gestión de evacuaciones adquirida más tarde por Genasys Inc. (NASDAQ: GNSS), líder global en comunicación crítica y alerta masiva. Hoy esa tecnología forma parte de un sistema que protege a más de 155 millones de personas en más de 100 países y en los 50 estados de Estados Unidos.

Nuestro encargo fue la pieza que llega a la persona: la que convierte una decisión tomada en un centro de mando en una instrucción clara en el bolsillo de alguien que está a punto de tener que salir de su casa.

El reto

Una app de emergencias no se parece a ningún otro producto digital. Rompe casi todas las reglas de producto que damos por buenas:

• No tiene onboarding. Nadie descarga la app “para probarla”. La abre por primera vez cuando ya hay humo en el horizonte, con las manos temblando y sin paciencia para un tutorial.
• No tiene tráfico medio. Está semanas en reposo y de golpe recibe una avalancha de aperturas simultáneas en la misma zona geográfica, justo cuando la red móvil está más saturada.
• No admite ambigüedad. Un texto que se puede leer de dos maneras no es un problema de UX: es una persona que sale cuando debía refugiarse.
• No puede depender de la red. En incendios forestales, inundaciones o seísmos, la infraestructura de comunicaciones es a menudo lo primero que cae.
• No puede pedir datos. Una herramienta de seguridad pública que exige registro, cuenta y consentimientos pierde exactamente a la gente a la que necesita llegar.

A eso se suma la naturaleza del emisor. Las alertas no las escribe un equipo de marketing: las emiten bomberos, protección civil, sheriffs y gestores de emergencias, cada uno con su vocabulario, sus protocolos y su normativa. La app tenía que ser el denominador común de todos ellos sin traicionar a ninguno.

Nuestra solución

Colaboramos con Zonehaven en el desarrollo de AWARE usando Next.js y React, con un objetivo muy concreto: responder tres preguntas en menos de cinco segundos — qué está pasando, si me afecta a mí y qué tengo que hacer ahora.

Mapa de zonas en tiempo real

El corazón de la app es un mapa de zonas de evacuación. Cada zona es un polígono definido por el organismo competente y tiene un estado que cambia en vivo durante el incidente:

• Orden de evacuación — salir ya, por la ruta indicada
• Aviso de evacuación — preparar la salida: documentación, medicación y mascotas
• Refugiarse en el sitio — permanecer dentro, cerrar accesos y ventilación
• Zona segura — sin restricciones activas

El usuario localiza su zona por geolocalización o buscando una dirección, y ve su estado con la instrucción asociada sin tener que interpretar nada. Sobre el mapa se superponen las capas que importan durante una evacuación: rutas recomendadas, cortes de carretera, refugios y centros de acogida, y puntos de reunión.

Alertas push geolocalizadas

La app resuelve la ubicación del usuario contra los polígonos activos y solo notifica cuando realmente le afecta. Ese filtro es lo que separa una herramienta útil de una fuente de ruido:

• Alertas por ubicación actual, que siguen al usuario si se desplaza durante el incidente
• Ubicaciones seguidas (casa, trabajo, el colegio de los niños) que reciben alertas aunque el usuario esté lejos
• Notificaciones inmediatas cuando cambia el estado de una zona seguida
• Recursos de preparación: guías y checklists para estar listo antes de que ocurra la emergencia

Priorizamos las notificaciones push nativas sobre cualquier canal en vivo dentro de la app por una razón simple: llegan con la aplicación cerrada y con el teléfono en el bolsillo, que es la situación real el 99% del tiempo.

Diseño para leer bajo estrés

Todas las decisiones de interfaz se tomaron optimizando para el peor escenario, no para el demo:

• Una sola acción visible por pantalla. La instrucción principal siempre por encima del pliegue, sin scroll.
• El color nunca va solo. Cada estado combina color, etiqueta de texto e icono propio, para que funcione con daltonismo, a plena luz del sol o en una captura en blanco y negro reenviada por WhatsApp.
• Contraste verificado contra WCAG 2.1 AA, con tipografía grande y áreas táctiles amplias: la app se usa con prisa, con guantes o con el móvil en la mano equivocada.
• Lenguaje literal. “Salga ahora por la Ruta 1 en dirección norte” en lugar de “se recomienda considerar la evacuación”.
• Jerarquía por criticidad, no por cronología: una orden de evacuación nunca queda por debajo de un aviso de obras.

Arquitectura offline-first

Damos por hecho que la red va a fallar, porque en una emergencia real falla:

• Service Workers que pre-cachean mapas base, geometrías de zona, rutas y guías de preparación al instalar la app
• Cache-first para todo el contenido estático, con revalidación en segundo plano en cuanto hay conexión
• Persistencia local del último estado conocido de las zonas seguidas, siempre visible aunque no haya cobertura, y con marca de tiempo explícita para que el usuario sepa cuán reciente es
• Sincronización automática al recuperar la señal, sin que el usuario tenga que refrescar nada
• Payloads mínimos y assets comprimidos, pensados para redes saturadas o degradadas en mitad del incidente

Diseñado para el pico, no para la media

El patrón de carga de una app de emergencias es un pico brutal y localizado. La arquitectura responde a eso: contenido estático servido desde CDN con caching en el edge, respuestas de API pequeñas y cacheables, distribución de notificaciones mediante colas de fan-out, y degradación elegante — si algo tiene que caer, cae lo accesorio y nunca el estado de zona y la instrucción de seguridad.

El canal digital de un sistema más grande

AWARE no vivía sola: era el canal digital de un sistema de alerta que también alcanza a la población por SMS, llamadas de voz, sirenas, radio y televisión. Parte de nuestro trabajo fue asegurar que el canal digital hablase exactamente el mismo idioma que el resto —mismos estados, mismos nombres de zona y misma instrucción— para que nadie recibiera dos versiones distintas de la misma orden.

Arquitectura técnica

Ciclo de vida de una alerta

Resultados

La plataforma Zonehaven fue adquirida por Genasys Inc., validando la calidad técnica y el valor del producto. Hoy la tecnología de Genasys, incluida la de Zonehaven, protege a más de 155 millones de personas en más de 100 países y en los 50 estados de EE.UU. La plataforma ha sido destacada en medios como Fox News, NPR, Inc. Magazine y SF Gate.

• 155M+ personas protegidas globalmente a través de la plataforma
• Cobertura en 100+ países y los 50 estados de EE.UU.
• Disponibilidad offline garantizada para los datos críticos de evacuación
• Cero fricción de acceso: sin registro y sin barreras en el momento en que más importa
• Un único lenguaje visual de estados de zona, reutilizable por cualquier organismo emisor sin adaptaciones
• Adquisición exitosa por Genasys Inc.

Decisiones técnicas clave

• Next.js con SSR: elegido por la combinación de rendimiento en el primer render (crítico para accesos de emergencia) y generación estática para los contenidos de preparación.
• Offline-first no negociable. Preferimos mostrar el último estado conocido con su marca de tiempo antes que una pantalla de error: en una emergencia, información de hace diez minutos es infinitamente mejor que ninguna.
• Push nativo como canal principal, por encima de WebSockets: es el único que llega con la app cerrada, que es el estado normal de la app.
• Geometría en el cliente cuando se puede. Resolver “¿estoy dentro de esta zona?” en el dispositivo reduce latencia y funciona sin red.
• CDN con edge caching, imprescindible en un producto que opera en más de 100 países con picos concentrados geográficamente.
• Semáforo universal de estados, accesible y sin dependencia del idioma, verificado contra WCAG 2.1 AA.

Stack técnico

• Next.js (framework principal con SSR)
• React (interfaz de usuario)
• Service Workers y almacenamiento local (estrategia offline-first)
• Push notifications (alertas de emergencia)
• Geolocalización y mapas interactivos (capas GIS: polígonos de zona, rutas, refugios)
• CDN con edge caching
• Google Analytics (analítica)

Lo que nos llevamos de este proyecto

Trabajar en tecnología de emergencias cambia la forma de diseñar producto. Las métricas habituales —tiempo en pantalla, sesiones, retención— aquí no significan nada: el mejor resultado posible es que alguien abra la app, entienda qué hacer en tres segundos y la cierre. Es un producto que se mide por lo rápido que consigue que dejes de usarlo.

También nos dejó una regla que aplicamos desde entonces en todo lo que construimos: diseñar para el peor día, no para la demo. Si funciona con mala red, con prisa, con estrés y con un móvil viejo, funcionará el resto del tiempo.

¿Necesitas una app que funcione cuando todo lo demás falla? Conoce nuestro servicio de desarrollo de apps móviles →