Code Monkey home page Code Monkey logo

screens's Introduction

screens

Implementación de pantallas con información en tiempo real de transporte público a partir de la especificación GTFS

Equipo de trabajo

Organización de la información GTFS Realtime

"La oficina de correos"

Obtener periódicamente la información del feed GTFS Realtime (el servidor del proyecto gtfs-realtime), ordenarla según pantallas o servicios y distribuirla.

  • David Segura
  • Josué Vargas

Implementación de pantallas y despliegue de información

"La entrega de los paquetes de correo"

Con la información asignada a cada pantalla y la plantilla para desplegar información, actualizar las pantallas cada $N$ segundos. Además, claramente, la implementación propiamente de las pantallas.

Primera implementación: soda de la Facultad de Ingeniería, porque: 1. ya existe una pantalla ahí, 2. es más fácil pedir permisos, 3. no requiere protección contra la intemperie, 4. es nuestra Facultad.

  • José David Murillo
  • Mateo Ortigoza

screens's People

Contributors

fabianabarca avatar jdmurillor avatar

Watchers

 avatar  avatar

screens's Issues

Desarrollo de animación de posición de los buses

Además del tiempo de espera desplegado en la pantalla, puede ser útil tener una animación que, de un vistazo (glanceability), permita saber por dónde viene el o los buses que están circulando.

Características:

  • La primera propuesta no es un mapa
  • En cambio, puede ser un diagrama lineal simplificado, no a escala, que indica la posición relativa del bus con respecto a la secuencia de paradas, algo así como:
--P1-(B)--P2------P3--(B)-P4------P5--
    12 min           3 min

donde (B) es un bus (L1 o L2) y Pi es una parada.

  • Debajo del bus indica el tiempo para llegar (esto haría la animación casi "autosuficiente")
  • La parada donde está la pantalla está resaltada de alguna forma.
  • Las paradas y el trayecto que "van quedando atrás" cambian de color o forma.
  • (Bonus) Es posible cambiar la imagen de los elementos de la animación para hacerlo temático. Por ejemplo, alguna vez pueden ser ilustraciones pixeladas, en otro momento tipo manga, o según fechas de celebraciones, etc.

Posiblemente la animación requiere de:

  • geoshapes para conocer la trayectoria de la ruta
  • stops para conocer la ubicación de las paradas
  • location para interpolar la ubicación relativa entre una parada y otra

Especificación de la información necesaria para la pantalla prototipo

Para la primera pantalla prototipo es necesario especificar la información desplegada.

Prototipo

  • Ubicación: Soda Facultad de Ingeniería
  • Vinculada a paradas: Ingeniería "hacia abajo" e Ingeniería "hacia arriba", que pueden considerarse "una sola estación"
  • Rutas servidas: UCR L1 y UCR L2
  • Modelo: pantalla E-Ink de MBTA para una parada de bus

Datos requeridos, caso 1: solamente con entidad Trip Updates

bus_eink

Preliminarmente, por cada parada, es necesario:

  • Nombre de la parada (stop_ido stop_code)
  • Hora
  • Información estática (posiblemente hard coded)
  • Lista de próximos buses:
    • Opcional: ícono
    • Código de ruta (L1 o L2, por ejemplo)
    • Información de la dirección en la que va, que sería trip_short_name de la tabla trips de GTFS Schedule. Nota: en cada FeedMessage de GTFS Realtime con la entidad trip_updates viene el trip_id con el cual podemos buscar trip_short_name.
    • Tiempo estimado de llegada (en minutos que faltan)

Esta opción tiene:

  • Layout fijo
  • No muestra información de Vehicle Positions o de Service Alerts

Tareas

Especificar la interfaz de datos entre la recolección y clasificación de GTFS Realtime que hacen David y Josué y las pantallas que aquí se administran. Por ejemplo:

[
  {
    "stop_id": "UCR_1_05",
    "next_bus": [
        {
            "route_id": "UCR_L1",    
            "trip_id": "desde_artes_sin_milla_entresemana_7:30",
            "direction_id": "1",
            "arrival": 1705689632,
         },
         {
            "route_id": "UCR_L2",    
            "trip_id": "desde_educacion_sin_milla_entresemana_7:45",
            "direction_id": "1",
            "arrival": 1705689895,
          },
      ]
  },
  {
    "stop_id": "UCR_0_07",
    "next_bus": [
        {
            "route_id": "UCR_L1",    
            "trip_id": "hacia_artes_sin_milla_entresemana_7:40",
            "direction_id": "0",
            "arrival": 1705689789,
         },
         {
            "route_id": "UCR_L2",    
            "trip_id": "hacia_educacion_sin_milla_entresemana_7:55",
            "direction_id": "0",
            "arrival": 1705689987,
          },
      ],
  }
]
  • Especificación del formato de datos que debe recibir con la información para cada parada (ejemplo: el JSON anterior)
  • ¿Cómo desplegar esa información en la página de la pantalla?
  • ¿Cómo utilizar WebSockets para actualizar esa información?

Diseño de señales auditivas

Los televisores para mostrar la información tienen salida de audio. Podemos usar señales auditivas para indicar eventos como la llegada de un bus.

Es necesario diseñar las acciones que tendríamos que habilitar en el servidor y en el navegador para implementarlo.

El mensaje puede ser algo como:

[Sonido campana] "El próximo bus de la línea {X} está llegando"

Una hipótesis es que el servidor puede enviar una señal tipo ARRIVING que el navegador ejecuta con un audio pregrabado.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.