VMS

A video management system for business and government clients.

Sergek builds video surveillance and road safety systems. VMS is the part operators work with every day: video, map, events and recordings.

I led the product as its only designer: scenarios, mockups, design system, handoff to development.

This case shows a small part of the client interface. There is also an admin side and separate solutions for government clients.

An operator cannot watch every camera at once.

There are more cameras than a person can keep in view, and video, map, analytics and recordings lived in different places.

The product brings them into one workplace and builds the work around events.

Video, map and events in one window.

Cameras get found in different ways: by address on the map, by object in the tree, or by eye in the grid of streams. All three open the same video, with the event feed running beside it.

The mobile app solves a different problem: check a camera and review an event without being at the desk.

Desktop, tablet and phone follow the same logic.

The set of functions does not change — density and order do: everything side by side on a large screen, one step at a time on a small one.

Navigation and components are shared, so moving between devices takes no relearning.

Every interface is built for both colour schemes.

The themes are built on variables: colours, states and shadows are described once and switch over as a whole.

The small things go through the same work as the main screens.

Utility windows, empty states and rare scenarios are worked out in the same detail. In a system someone sits with for a whole shift, those are what they see most.

Components, states and icons.

The product is large, so screens are assembled from a shared library: grid, typography, components, dark and light themes, a custom icon set.

Neighbouring products in the company use the same system.