Warehouse
Management System

UI/UX Design for Real-Time, Accessible, and Accurate Weather Data

Overview

We partnered with Spacemaker Inc. to design a mobile and embedded interface for managing their smart racking systems. The application allows warehouse staff and system technicians to operate automated storage units—mirroring the physical controls found on rack trays. This modern interface streamlines tray movement, item retrieval, and storage organization, improving safety and speed while minimizing training requirements. The system supports both forklift-mounted fixed screens and mobile devices used by service staff. Our goal was to create a responsive interface that adapts to both contexts—prioritizing visibility, interaction speed, and task clarity for industrial users on the move.. The existing system was slow, visually outdated, and difficult to use in fast-paced industrial environments. Our task was to modernize the experience to enable warehouse staff to quickly check inventory, report issues, and monitor logistics workflows—all via an embedded touchscreen system.

Challenges

The previous UI failed to support real-time decision-making and required too many steps for common tasks. Users often struggled to locate time-sensitive alerts or key metrics. Visibility was poor in warehouse lighting conditions, and the interface lacked support for accessibility standards or multilingual staff. We also needed to balance improvements with device constraints and legacy system dependencies.

Our Approach

Role-Based Prioritization

We defined workflows for forklift operators and mobile service staff. Each role was presented only with actions relevant to their responsibilities—reducing cognitive load and streamlining tasks like shipment tracking, item lookup, and tray operations.

Visual Clarity in Harsh Lighting Conditions

We optimized for both forklift-mounted screens and handheld mobile use. High-contrast colors, bold icons, and responsive layouts ensured visibility in bright or low-light warehouse conditions. Critical alerts and status indicators were easily scannable—even in motion.

Maintainable UI Architecture

While this was a single-application deployment, we developed the interface using lightweight React patterns and minimal framework customization. This ensures easy future updates, clean code maintenance, and support for added functionality without overengineering the system.

Device Adaptability

The application runs seamlessly on both embedded fixed screens and mobile devices, adjusting layouts and controls as needed. Whether accessed via a kiosk interface on a forklift or through a phone by service staff, the app delivers consistent usability across environments.

Design System

To ensure visual and functional consistency across current and future interfaces, we developed a foundational design system. This included typography, spacing rules, iconography, and component behaviors adapted to Spacemaker’s brand and industrial use cases. The system was built to support embedded touchscreens, mobile devices, and potential expansion to other digital tools—providing a cohesive visual language and minimizing rework as new features are added.

Results

The redesigned Weather Canada app delivered significant improvements in both usability and performance, meeting the diverse needs of its user base.

Enhanced User Experience

The new design significantly improved navigation and usability for both professional and casual users. Professionals, including sailors and construction workers, praised the clarity of radar data and weather alerts, while casual users found the app much easier to navigate for daily weather checks.

Bilingual Usability

Testing in both English and French ensured that the app performed seamlessly across Canada's bilingual population. Users reported a consistent and intuitive experience in both languages, contributing to broader user satisfaction.

Scalable Design

The app's design allowed for the integration of future updates and features without compromising the overall user experience. This scalability ensured that the app could continue evolving to meet both user needs and technological advancements over time.

Increased Engagement

Following the redesign, user engagement rose as users found the interface more intuitive and the content easier to access. The custom-designed icons, in particular, were a key element in improving the speed and ease with which users could interpret complex weather data.

Improved Accessibility

By adhering to WCAG 2.1 standards, the app became more accessible to users with disabilities. This led to positive feedback from users who rely on assistive technologies, further expanding the app's usability and inclusivity.

Faster Access to Critical Information

Professionals who rely on real-time weather data, particularly for radar features, reported quicker access to critical information. This was especially beneficial in high-pressure environments, such as marine and construction industries, where real-time data is crucial for decision-making.

Let's Work Together

Let’s bring clarity to complexity. We help industrial teams move faster with better software.

Warehouse Management System