Visión general
Aplicación web de un solo archivo (index.html). No requiere instalación ni servidor propio.
Libre Pedal es un copiloto para ciclistas con un personaje llamado Pistero que habla, navega contigo estilo Waze y vive en el mapa. Toda la información se guarda en dos lugares:
- Firebase Firestore (en la nube): usuarios, chat, rutas, viajes, hostels, recomendaciones, amigos y reportes. Es lo que permite ver a otros ciclistas en tiempo real.
- localStorage (en tu teléfono): tu sesión, tu personaje, kilómetros y calorías acumuladas. Funciona sin conexión.
La barra inferior se redujo a 5 botones (Inicio · Mapa · Social · Taller · Perfil). Las demás secciones siguen estando: se abren con accesos directos dentro de cada pantalla o por comando de voz. No se eliminó ninguna función.
Voz y comandos de voz
El personaje habla y también te entiende.
Cómo habla Pistero
Usa la voz del navegador (Web Speech API). Antes de hablar, el texto pasa por un filtro que elimina todos los emojis e iconos, así que ya no los lee en voz alta. Elige automáticamente la mejor voz en español disponible (prioriza español de Chile, luego de Latinoamérica). Se puede silenciar desde Perfil → Voz: ON/OFF.
Comando de voz (botón del micrófono)
El botón morado flotante activa el reconocimiento de voz. Frases que entiende:
| Dices… | Pistero hace… |
|---|
| "ir a Valparaíso" / "llévame a…" | Calcula la ruta y arranca la navegación |
| "abre el mapa", "mis rutas", "viajes" | Cambia de sección |
| "chat", "amigos", "taller", "guía", "estadísticas", "perfil" | Abre esa sección |
| "activa el GPS" / "grabar" | Inicia/detiene la grabación de ruta |
| "cuántos kilómetros llevo" | Te dice km y calorías en voz |
| "silencio" / "habla" | Apaga o enciende la voz |
| "tutorial" | Abre el tutorial guiado |
El comando de voz necesita micrófono y funciona mejor en Chrome/Android. En algunos navegadores (Firefox, ciertos iOS) puede no estar disponible; el botón te lo avisa.
El personaje (Pistero)
Animado, personalizable y presente en todos los mapas.
- El personaje es el casco: una cara simpática (ojos que parpadean y boca) que vive dentro del casco elegido. Sin rostro ni cuerpo: limpio y reconocible.
- 18 cascos y subiendo (marcas reales + Full Face, Urbano, Kids, Smart LED, Premium dorado, Camuflado). Pensado para ampliar y vender modelos a futuro.
- 8 colores (skin = franja de color sobre el casco), 6 estilos de lentes y accesorios combinables: faro, antena, calcomanía y pañoleta.
- Es SVG animado y liviano, no traba el teléfono.
- En el mapa, cada ciclista se ve como su casco (no un pin ni un emoji). El tuyo brilla y rebota para distinguirse.
- Estructura lista para monetizar: cascos premium, packs de colores, lentes y accesorios como compras futuras.
Inicio
Tu tablero del día.
| Elemento | Qué hace |
|---|
| Velocímetro | Velocidad en vivo desde el GPS y estado (detenido / lento / normal / rápido) |
| Tarjetas | Km totales, calorías, velocidad media y número de viajes completados |
| Barra de desempeño | Progreso hacia tu meta (sube con los km recorridos) |
GPS | Inicia/detiene la grabación de tu recorrido; al detener, lo guarda en "Mis Rutas" |
+10 Darma | Puntos de gamificación (suben tu nivel: Novato → Explorador → Nómada → Leyenda) |
Mis Viajes / Tutorial | Accesos directos |
| Música / PDF | Enlaces a apps de música y descarga del PDF de frases |
Mapa global
Comunidad y puntos de interés.
- Ciclistas: muestra a otros usuarios visibles en tiempo real, cada uno con su casco.
- Reportar: avisa un peligro (bache, perro, etc.) que verán los demás.
- Agregar punto: marca agua, camping, taller, mirador u hostel (+20 Darma).
- Accesos directos a Mis Rutas y Mis Viajes.
Navegación estilo Waze
Lo central de la app.
- Viaje rápido: escribe (o dicta) un destino; busca la dirección (Nominatim) y calcula la ruta en bici (OSRM).
- Pantalla a pantalla completa con instrucción grande, ícono de giro, velocidad, km, tiempo y hora estimada de llegada.
- Tu personaje avanza por el mapa siguiendo tu GPS, y el mapa te sigue (paneo automático), como Waze.
- Las indicaciones se anuncian por voz, sin leer iconos, con gramática natural ("Gira a la derecha por…").
- Viajes multi-destino: planifica varios puntos en orden y guárdalos. (Al iniciar, la navegación va al destino final; los intermedios quedan listados.)
- Al llegar, el viaje se marca como completado y guarda distancia, duración y calorías.
Hidratación y nutrición por voz
Recomendaciones automáticas durante la navegación.
Basado en la guía deportiva habitual: un ciclista debe hidratarse cada 15–20 minutos (≈ 500–750 ml por hora) y, en salidas de más de una hora, comer carbohidratos cada 45–60 minutos (≈ 30–60 g por hora). Llevado a distancia y a ritmo recreativo, Libre Pedal te avisa por voz:
| Cada… | Mensaje |
|---|
| 5 km | "Toma un par de tragos de agua para no deshidratarte." |
| 20 km | "Come algo ligero, una fruta o una barra, para recargar energía." |
Estos intervalos están en el código (nextHydrateKm = 5, nextEatKm = 20) y se pueden ajustar fácilmente si quieres recordatorios más o menos seguidos.
Social
Chat · Amigos · Recomendaciones.
- Chat global en tiempo real para todos los ciclistas.
- Amigos: envía y acepta solicitudes; busca ciclistas a 10 km a la redonda.
- Recomendaciones: publica lugares útiles (agua, comida, vistas, seguridad) y dale "me gusta".
Taller MacGyver
Reparaciones de emergencia.
17 trucos para arreglar la bici con lo que tengas (cadena, pinchazo, radios, frenos…), con buscador. Puedes compartir tus propios secretos con la comunidad. Toca cualquier truco y Pistero te lo lee.
CicloGuía
Hospedajes, panoramas y tips.
Filtros por categoría (hospedaje, panoramas, tips, economía) y por tipo de alojamiento (hostel, camping, casa). Puedes publicar un alojamiento nuevo y marcar su ubicación con GPS tocando el mapa. Sección de comentarios de la comunidad.
Perfil y personaje
Personalización y ajustes.
Cambia casco, color, lentes y extras (se ven en vivo y en el mapa). Desde aquí también: Estadísticas, Voz ON/OFF, Tutorial y Modo Fantasma (te oculta del mapa de otros ciclistas).
Estadísticas y datos
Tu actividad, medible y exportable.
- Km, viajes, calorías, Darma, velocidad media y máxima.
- Gráficos de barras por viaje: distancia, duración y calorías.
- Exportar GPX: descarga la ruta para abrirla en Strava, Komoot, etc.
- PDF de frases: genera un documento con todas las frases de Pistero.
Sobre los recursos de IA (voces y animación)
Qué sirve para esta app y qué no.
Voces
Piper, XTTS v2, Fish Speech y Mozilla Common Voice son excelentes, pero corren en servidor con Python (8–16 GB RAM): no se pueden incrustar en una web de un solo archivo sin montar un backend. Por eso la app usa la voz nativa del navegador (gratis, sin instalar nada). Si en el futuro quieres voz "AI premium" tipo Piper, requiere un servidor (decisión de infraestructura aparte).
Animación / personajes
Mixamo, ActorCore, Sketchfab y similares entregan modelos 3D para Blender/Unity. Renderizar 3D en vivo sobre el mapa, en celular, afectaría el rendimiento. La mejor opción para "el personaje que avanza en el mapa" es un personaje SVG/CSS liviano (el que ya usa la app). Mixamo es ideal para videos promocionales o intro, no para el marcador del mapa.
Social