PoolPal Platform

Designing a real-time operational platform for commercial pool automation

A responsive SaaS web application combining admin tools, real-time dashboards, connected device interfaces, and monitoring workflows for commercial swimming pool operations.

YEAR

2022

DURATION

1 Year

ROLE

Sole UI/UX Designer

TOOLS

Figma, Adobe Illustrator

Overview

PoolPal is a commercial pool automation web application designed to help operators monitor facilities, manage connected devices, and streamline operational workflows through real-time dashboards and centralized administrative tools.My role focused on translating this complex operational ecosystem into clear dashboards, admin interfaces, responsive web experiences, and scalable UI patterns.

Discovery & Product Context

Before designing the platform, I worked closely with the founder and development team to understand the operational landscape, product requirements, and connected device ecosystem.I also needed to understand the technical direction of the platform early on, including the component framework the development team planned to use.
Through stakeholder discussions and product requirement reviews, I gathered insights into how operators manage facilities, how devices behave in the field, and how administrative tasks are handled behind the scenes.This discovery phase helped define the core user needs and shaped the information architecture, dashboard structure, and system flows of the PoolPal platform.

The Challenge

Commercial pool operations involve large amounts of operational data, connected hardware systems, maintenance workflows, and time-sensitive monitoring procedures.

I needed to design a platform that could simplify operational complexity while still giving operators fast access to critical information, real-time alerts, device controls, and configuration workflows. The challenge became even larger as the platform expanded into multiple connected products, administrative environments, and responsive web interfaces. I also had to work within Ant Design implementation constraints, which meant balancing custom visual experiences with a component-based development system.

The challenge was designing a platform capable of:

✓ Simplifying complex operational workflows ✓ Supporting rapid decision-making ✓ Managing multiple connected devices ✓ Visualizing live system data clearly ✓ Scaling across dashboards and admin interfaces ✓ Adapting complex dashboards for responsive web use ✓ Designing within Ant Design component constraints ✓ Creating both monitoring and settings experiences for multiple device types

The Solution

I designed the platform as a centralized SaaS ecosystem that connected monitoring dashboards, device interfaces, settings workflows, and administrative tools into one operational experience. The goal was to reduce complexity while improving visibility, usability, and real-time decision-making across the platform. I also aligned the design direction with Ant Design constraints so the interface could remain both visually coherent and development-friendly.

Design Priorities

✓ Modular dashboard structure ✓ Real-time data readability ✓ Scalable UI patterns ✓ Centralized admin management ✓ Simplified operational workflows ✓ Consistent device configuration ✓ Responsive web application behavior ✓ Development-friendly UI patterns

Designing the Platform Ecosystem

To support the platform’s growth, I organized the experience around connected products, real-time monitoring tools, and centralized admin workflows. This structure helped keep dashboards, devices, and operational controls consistent across the PoolPal ecosystem.

Platform Ecosystem Diagram

I used this ecosystem map to clarify how connected devices, integrations, user roles, dashboards, admin tools, analytics, and alerts could work together inside one centralized operational platform.

Information Architecture

I structured the information architecture around two core experiences: admin management and real-time operations. This helped connect accounts, assets, devices, inspections, logs, and work orders into one clear platform structure.

Connected Device Layer

I treated the hardware ecosystem as part of the user experience, because each device introduced its own data, status, alerts, and control needs inside the platform.

Dashboard & Admin Experience

After defining the platform structure, I designed the core web application experience across two connected layers: operational dashboards for monitoring live pool conditions and device activity, and an admin environment for managing accounts, assets, workflows, and system-wide issues.The challenge was to keep these complex, data-heavy experiences clear, consistent, and adaptable across desktop and mobile use cases.

Admin Management Layer

I structured the admin side of the platform around the system’s main management objects: accounts, contacts, assets, connected devices, work orders, log sheets, monitoring, and software updates.
Because this environment supported setup, oversight, troubleshooting, and operational coordination across multiple properties, I designed it as a scalable, table-driven system with direct access to related assets, dashboards, device actions, and issue tracking.

Real-Time Operational Dashboards

For the operational side of the platform, I designed a dashboard system that allowed users to monitor live conditions and switch between connected devices within the selected account and asset context.
Each device required its own data, alerts, and operational logic, so I created specialized dashboard views while maintaining a consistent navigation structure and visual language across the product.

Device Settings & Configuration

In addition to real-time monitoring, I designed dedicated settings interfaces for each connected device, allowing users to configure operational rules, calibration values, thresholds, scheduling, and device-specific behaviour within the same web application.
Because each product had different technical requirements, the settings varied by device, but I kept the overall structure consistent so users could move between products without relearning the interface.

Remora Settings

SCMC Settings

RoboGuard Settings

RoboArm Settings

Cross-device Clarity
Adaptive Layout
Consistent Actions

UI Logic & Design System

To make a complex operational platform easier to use, I built a consistent UI system across dashboards, admin tools, and device settings. This helped users quickly understand live status, alerts, critical data, and available actions across the platform.

Applied UI Logic

I used repeated interaction patterns and clear status cues to make device activity, alerts, controls, and live operational data easier to scan across the platform.

Device Status & Switching

Live device status and quick contextual switching across connected devices.

Threshold-Based Alerts

Configurable operating ranges for triggering safety and monitoring alerts.

State Visibility

Colour-coded states for quickly identifying normal, warning, and critical conditions.

Visual Foundations

I defined a restrained visual foundation to support readability across dense operational screens. Typography created clear hierarchy, colour communicated live status and alerts, and iconography helped users recognize devices, actions, and system conditions quickly.

Typography

Color System

Iconography

Reusable Interface Patterns

I created reusable patterns for buttons, forms, status indicators, device switching, and content containers. These patterns helped keep dashboards, admin tools, and device settings consistent across the platform.

Operational Dashboard Components