fleet tv & activity tracker 2.0

Extending Watercare’s Nerve Centre digital experience with Fleet TV, Activity Tracker 2.0 and Media Control Panel.

Client: Watercare (Digital)

Roles: user research / design strategy / co-design / prototype / user testing / interaction & UI design / design system

the nerve centre background

In this second part of the Nerve Centre Digital Design project (October 2020 - April 2021) I continued the design work on additional digital products that are connected with the Central Overview Screen app. To learn about the CS app, or the Nerve Centre’s project background, check out the first part of this story.

related: Nerve Centre Digital Design

2. Fleet TV

In Screen Group 3 there are four TV screens that display traffic information & fleet data from three maintenance teams (orange). I proposed merging all these screens, and adding the missing team, into a single view called the Fleet TV. This way the users can have a consolidated view to monitor all field teams and send out the right workers based on their locations, skills, status or traffic condition to the right jobs.

Original Diagram (Copy)

Revised Diagram (Copy)

Metro & N2S Views (Copy)

The two views provided a visual overview of how busy we are across Auckland. And where most of the fleet are concentrated. The Activity Tracker 2.0 is the app where the Fleet TV function will be most usable.

POV 1: Operations Controller (Copy)

How the Fleet TV looks from where the Operations Controller is sitting.

POV 2: Right Team (Copy)

How the Fleet TV looks from the perspective of NC Operators sitting on the right.

POV 3: MD (Copy)

How the Maintenance Delivery planner and manager see Fleet TV. They will either have to walk to the Fleet TV or simply access it on their laptop via Activity Tracker 2.0.

The Fleet TV is presented in two views: Metro and North to South so operators can quickly see the fleet distribution and compare them with traffic or other geospatial information in two practical zoom levels. Two colours were used to differentiate between Watercare’s internal fleet (mint) from the external contractors (green). In deeper zoom levels you can also see key pump stations since works occurring there could cause a ripple effect down the networks.

In this short Fleet TV video, you can see a fade in/out transition effect to indicate the vehicles moving. In a future version, my idea was to have each vehicle would move smoothly from one position to the next.

3. Activity Tracker 2.0

With Actitivy Tracker 2.0 (AT2) maintenance problems can be mitigated or resolved more efficiently than ever before. It will enable Watercare to have a better response time and informed communication with customers regarding their water utility issues. What’s powerful about version 2.0 is that it provides access to the features of Central Screen, Fleet TV and AT 1.0 independent of the Nerve Centre physical space.

The Design Process

In the AT2 design process, we engaged the NC Operators, Customer Faults and Maintenance Delivery teams equally in co-design workshops, qualitative interviews and feature prioritisation. Lastly, I created interaction and hi-fi visual design in Figma, making sure that all the main components were designed before we closed for Christmas 2021.

AT2 will have the ability to display richer data sets that appear at different zoom levels, e.g. filtering activities based on priority levels, viewing planned works, trade skills, fleet information along with potential advanced features such as Asset Historical Insights and Activity Radar.

This video shows an early draft of the Activity Tracker 2.0 prototype. Users can view key customer’s location, check who is closest to an incident/activity and what trade skills they have, and so on. When combined with other IoT data, the Activity Tracker 2.0 can well be that predicitve tool that Watercare needs in order to change its response strategy from reactive to proactive.

The next step in this project is to validate the design concepts with users and continue with data integration, alarm sanitation and back-end development. Relevant and new functions will then be rolled back onto Central Screen and Fleet TV.

4. Media Control Panel

Pain Point

The OOTB Control Panel UI provided by the hardware vendor had a few usability issues (first slide below).

Solution

I provided concept sketches for the Brightness and Volume Settings screens, then recruited another UX Designer to prototype the interaction design for the Video Wall Settings. Due to time and technical constraints, the UI aesthetics was not as important as focusing on improving the usability factor, e.g. optimising size for buttons and sliders, having clear information architecture and a better layout.

Nerve Centre's screens view from Working Group area

The finalised UI design from Fleet TV and Activity Tracker 2.0 were added to the Watercare Design System’s dark mode pattern library. Also shown above are different views of the Nerve Centre screens from different areas.

Keen to know more? Let’s chat over tea or coffee.

Request NC Case Study