Traffic Scene Understanding Portal
A research web portal combining knowledge graphs, panoptic segmentation (UPSNet), and scene graph visualisation to help traffic analysts and autonomous vehicle researchers explore entity relationships in traffic scenes.
Overview
P32 is a web portal for traffic scene understanding built for the SCS Academics client in SOFT3888 (Software Engineering Project). It brings together three AI concepts (knowledge graphs, panoptic segmentation, and scene graphs) into a single research tool that helps traffic analysts and autonomous vehicle researchers explore the spatial and relational structure of traffic scenes. The project was developed by a five-person team in Agile sprints over one semester, with regular client demonstrations shaping the scope.
Features
Knowledge graph visualisation: users can upload their own knowledge graph in JSON format or select from an existing dataset to explore entity relationships within a traffic scene via an interactive draggable graph interface.
Panoptic segmentation: integration of UPSNet (an open-source panoptic segmentation model) lets users upload traffic images or video and receive segmented outputs where every pixel is classified, separating objects like cars, pedestrians, and road markings into individually coloured regions. Users can also skip inference by uploading pre-segmented data in Cityscapes dataset format.
Ego entity nomination: users can nominate any detected entity as the ego (the focal point of interest), so the scene graph highlights its specific relationships with all surrounding entities. This enables focused analysis of how one object interacts with the rest of the scene.
Scene graph visualisation: after segmentation, the portal generates a scene graph by combining the knowledge graph and panoptic segmentation results. Both a standard perspective view and a bird's-eye view are supported, giving researchers two lenses on the spatial relationships within the traffic scene.
User access control and admin panel: secure login with hashed passwords stored in SQLite. An admin dashboard supports user management (add, modify, delete), permission-level control over page access, and automated error reporting when code-level issues occur.
Tech stack
Python · Flask · Jinja2 · Bootstrap · JavaScript · jQuery · Axios · SQLite3 · UPSNet · Cityscapes Dataset · MVC design pattern · GitHub / Bitbucket (GitFlow) · GitHub Actions (CI) · Google Colab · Figma
Architecture
The project used the MVC design pattern, with code organised into auth, config, models, utilities, and logging modules. Jinja2 template inheritance consolidated shared libraries and layout into a base.html, eliminating repetitive markup. Dynamic front-end behaviour used Axios for API calls and the DOM event binding model to avoid full page reloads. SQLite served as a lightweight database for user data, with pydantic and Python typing for incoming data validation. The full application runs with a single flask run command and includes a Colab deployment script for GPU-backed inference.
Development process
The team followed Agile with two-week sprints, weekly client meetings, and tutor check-ins. Requirements were gathered iteratively, with several user stories added or revised after client demos (for example, admin permission management was scoped in at week 5). The codebase was managed on Bitbucket with GitFlow branching and mandatory pull-request reviews before merging. The initial Vue.js front-end was refactored to Flask + Bootstrap after the client expressed a preference for a simpler, single-framework stack.
