Summary

The concept: to enhance the grocery shopping experience by replacing standard grocery freezer doors with digital "cool screen" doors that have a 4k display of each product photo and quantity left in stock.

Verizon was in need of an application to supervise, service, and troubleshoot all of these devices remotely. The management software was built using Losant’s IoT platform, which provided the backend infrastructure to monitor and control the devices remotely.We used Losant's IoT Platform to manage and maintain the equipment.

My Role

As the Lead UX Designer, my focus was on designing the software the Verizon technicians and store operators use to manage the Cool Screens network. This included building tools for remote device management, ad scheduling, real-time diagnostics, and system health monitoring.

Details

  • Role: Lead UX Designer
  • Project Name: Verizon Conditioned Based Management / Cool Screens
  • Type: Desktop, Mobile App
  • Software: Adobe XD, Jira, Confluence
  • Project Date: February 2020 - July 2020
  • Company: LOSANT
  • Client: VERIZON

How it Works

COOL SCREENS

Cool Screens transform traditional cooler doors into interactive digital displays. Using motion sensors and cameras, they showcase real-time product visuals, prices, promotions, and dynamic advertisements—no door opening required.

UX Process - Step 1

Discovery

Research and Discovery

Interviews

I had several meetings with the stakeholders for Verizon and Cool Screens to help better understand how this software would be used, to design a platform that would optimize the process for the technicians.

Competitive Analysis

To design a user-centric platform for managing Cool Screens across multiple locations, I conducted a competitive analysis of industry leaders in digital signage software and IoT dashboard tools. This helped identify usability patterns, technical capabilities, and feature gaps relevant to enterprise-level screen control and content management.

Cross-Functional Collaboration

To ensure alignment between design and development, I participated in daily standups with our four-person engineering team. These quick syncs allowed us to discuss technical constraints, clarify design decisions, and explore how features would be built within our timeline.

Data Visualization:

Losant’s unique combination of low-code development and remote deployments greatly reduces the complexity and time to market for your edge computing requirements.

Below is an example of the data that is retrieved in the back-end when indicating Asset warnings and alerts.

These workflows start with a trigger, and that trigger includes a payload. The purpose of the workflow is to make decisions based on this payload, modify the data if needed, and eventually result in some kind of output.

UX Process - Step 2

User Journey

Pain Points and Challenges

Multiple Locations

 Technicians needed to remotely manage cooler screen content across multiple locations.

Delayed Reporting

They needed real-time hardware performance monitoring, including sensors and cameras.gaps relevant to enterprise-level screen control and content management.

Accessibility

Non-technical users like store managers needed an easy way to make simple updates.
UX Process - Step 3

Low Fidelity Wireframes

Feedback

Dropdown Options are more complex.

Can we filter the alarms with the cards?

Its hard to see multiple alarms in small map areas.

UX Process - Step 4

Prototype Desktop

Overview Dashboard

Throughout this UX process the importance of documentation became a priority. Confusion on the branding guidelines and source of truth resulted in lot of rework, which we corrected by updating our Design System.

Alarm Map

Communication between the Developers, Design and stakeholders was causing unneeded bottlenecks.  Restructuring how we manage new enhancements, design changes and components went through a specific order before it went into development was a huge improvement.

Prototype Mobile

Alarm System

Notes and updates

UX Process - Step 5

Design System 

Custom Components

We had a lot of complexity in our components. Designing a system that carefully laid out those components in Adobe XD was essential.

Documentation

Communication between the Developers, Design and stakeholders was causing unneeded bottlenecks.  Restructuring how we manage new enhancements, design changes and components went through a specific order before it went into development was a huge improvement.
UX Process - Step 6

Design Handoff & Developer Collaboration

Once the high-fidelity designs were finalized, I prepared a thorough handoff package for the development team. This included detailed Figma files with organized components, consistent design tokens, interaction specs, and responsive behavior notes. I conducted a walkthrough session with the developers to align on functionality, clarify any areas of complexity, and address edge cases.

Throughout the build process, I stayed closely involved—attending regular standups and syncing directly with developers to ensure accurate implementation. I reviewed staging builds, provided visual QA, and made adjustments based on technical constraints when necessary. This close collaboration helped maintain design integrity while supporting a smooth and efficient handoff-to-launch workflow.