REAL-TIME CLOUD CONTROL / VEHICLE AND ROADSIDE OPERATIONS

Vehicle and Roadside Cloud Control Platform

A unified cloud control interface connecting vehicles, roadside units, maps, video, controls, and operational events in real time.

Vehicle operations dashboard with controls, map, live status, video, and events

Background

This real-time cloud control platform supports coordinated management of vehicles and roadside units. Operators need to view object location, operating status, video, control actions, and event feedback within one interface.

Challenge

Vehicles and roadside units carry different information, but both require a clear current object and operating context. The interface had to combine dense data, maps, video, and controls without confusing objects or overwhelming the operator.

Case Details

My role:: Sole UI/UX Designer
Duration:: July to August 2024
Responsibilities:: End-to-end design process

Selected Work

Vehicle dispatch, roadside operations, video, and point-cloud maps form the platform’s core real-time workspace.

Selected interfaces from the vehicle and roadside cloud control platform

Information Architecture

Vehicle dispatch and roadside control carry different information, but both follow the current object through one shared operating sequence.

OBJECT 01

Vehicle Dispatch

Organizes real-time status, controls, tasks, camera views, location, and operating events around a selected vehicle.

Vehicle Details Remote Control Task Management Five Camera Views Operating Events

OBJECT 02

Roadside Units

Organizes unit status, signal configuration, live signal states, recognition results, roadside video, and events around the current intersection.

Unit Information Signal Configuration Live Signals Recognition Results Roadside Events

01Select Object

02Confirm Location

03Review Status

04Execute Control

05Observe Feedback

1 secVehicle and roadside status update cycle

5 viewsCabin, front, rear, left, and right cameras

4 viewsEast, west, south, and north roadside cameras

30 secOperating and roadside event request cycle

Prototype and Information Framework

The prototype first defined the roles of the central map and side panels, allowing both dashboards to share one reading order while supporting different control tasks.

Vehicle operations wireframe with a central map and information and control panels on both sides — **Prototype**

Left: Object and Actions

Vehicle or roadside-unit information, controls, and task entry points.

Center: Location and Relationships

The map preserves the spatial context between the current object, nearby objects, and signals.

Right: Status and Feedback

Live status, video, and events make the result of each action observable.

Dual-Object Coordination

The vehicle dashboard prioritizes status, tasks, and remote control; the roadside dashboard adapts the same structure to signals, recognition results, and device feedback.

Roadside operations dashboard with unit information, signal control, map, recognition, video, and events — **Roadside Operations Dashboard**

OBJECT SWITCH

One layout,
two control contexts

Switching from a vehicle to a roadside unit does not require relearning the interface. The map still holds spatial context, the left side handles the object and controls, and the right side carries live feedback.

Vehicle: tasks, lights, doors, and five camera views Roadside: signal timing, recognition, and four camera views Shared: object selection, map location, status, and events

Experience Optimization

The overall business framework came from the project requirements. I proposed and implemented the following interaction and layout improvements during design.

01 / OBJECT LINKAGE

Link vehicle selection to map highlighting

When multiple vehicles appear together, operators should not repeatedly match names, locations, details, and video. One selection establishes a persistent current object.

01Select a vehicle or its map marker

02Locate and highlight the current object

03Update details, status, and video together

04Keep subsequent controls in the same context

Point-Cloud Visual Delivery

Using the site scan supplied by the project team, I refined color, brightness, and depth, applied the direction to the high-fidelity UI, and handed implementation parameters to engineering.

Operational point-cloud map with roads, vehicles, and routes

01Raw Scan

Receive the site point-cloud data.

02Visual Treatment

Refine color, brightness, and spatial depth.

03High-Fidelity UI

Validate contrast with interface information.

04Parameter Handoff

Provide executable visual parameters to engineering.

05Implementation QA

Review rotation, zoom, and detailed rendering.

Delivery and Outcome

Within a compact team, I delivered prototypes, two dashboards, high-fidelity UI, production assets, 3D assets, point-cloud visual direction, and implementation review.

MY SCOPE

Sole designer on the project

In a five-person cross-functional team, I translated product requirements into the complete design chain from prototypes and two cloud-control dashboards to high-fidelity UI and engineering delivery. I also continued to propose functional and layout improvements during design.

Dashboard Prototypes Vehicle Operations Dashboard Roadside Operations Dashboard All High-Fidelity UI Blender 3D Assets Point-Cloud Parameters Production Assets Implementation QA

View the Cloud Control Design System →

DELIVERY TAKEAWAY

The core structure and visual direction carried through implementation

After design handoff, I continued reviewing interface fidelity and point-cloud rendering, working with frontend engineers to refine implementation details.

The goal was not to display more data, but to make vehicles, devices, status, space, and controls work as one clear operational system.