Xapp Gateway.
Connecting offline fire alarm panels to the Cloud.
About the product.
Fire alarm panels often lived offline in basements, with no mobile signal and no way to stream inspection data. Inspectors relied on a two-person loop, one testing devices, another stationed at the panel to confirm results. This slowed inspections, doubled manpower, and delayed reporting to managers.
While some newer fire alarm panels are beginning to ship with built-in internet connectivity, millions of legacy panels are in service worldwide. Replacing them outright is costly and often unrealistic for building owners.
With the Xaap Gateway, we created a low-barrier bridge between these legacy panels and the cloud, enabling real-time visibility, single-inspector workflows, and instant compliance reporting.
My role: Senior Product Designer
Timeline: Nov 2017 – Jun 2018
Results.
%
Faster first-time inspections
%
Manpower cut
%
Reduction in inspection costs
Design approach.
Understand → Create ←→ Validate→ Deliver
The problem.
Fire safety inspectors must test thousands of devices accurately and quickly, yet legacy fire panels make the process slow and error-prone.
Most panels sit offline in basements, forcing a two-person loop: one inspector at the device, another at the panel, confirming results through walkie-talkies or phone. This doubles manpower, delays reporting, and increases compliance risk.
Replacing these panels isn’t always realistic; there are millions still in service worldwide, and upgrading is costly. Additionally, inspectors need both hands for tools, leaving limited room extra tools or manual logging, while managers remain blind to deficiencies until reports are uploaded days later.
How might we…
- Enable single-inspector workflows without sacrificing accuracy?
- Connect legacy panels to the cloud without costly replacements?
- Deliver real-time visibility even in no-signal environments?
- Create a clear, intuitive experience when the device itself has no screen?
Discovery & Research.
We partnered with embedded engineers to map the communication flow between fire panels and the Xaap Cloud. User testing with early prototypes revealed how inspectors interacted with the gateway in real-world conditions, highlighting needs around feedback clarity, reliability, power supply, and internet access.
This research confirmed the opportunity: if the gateway could automate device inventory pulls and securely stream results, inspectors could cut inspection times dramatically.
Every design decision was grounded in what we learned from inspectors on site. The table below distills our research into questions, answers, and the behavioural insights that ultimately defined the gateway experience.
| Behavioural Question | What we heard (Inspector voice) | Underlying Need | Pain / Risk |
|---|---|---|---|
| Q1. Walk me through a typical inspection day. Where does time go? | “Most of it is coordination. One of us is at the device, one at the panel. We’re calling back and forth, waiting for confirmation, then moving on.” | Reduce coordination overhead and waiting. | Long cycles; duplicated effort; slower delivery. |
| Q2. Describe the moment you verify a device at the panel. | “I watch panel lights and listen for tones. If I’m not 100% sure it registered, I ask for another trigger.” | Immediate, unambiguous confirmation. | Repeat tests; wasted time; uncertainty. |
| Q3. What slows you down the most? | “Walking back and forth, repeating tests after miscommunication, fixing missing entries at the end.” | Fewer repeat passes; fewer communication breaks. | Throughput loss; rework; schedule slips. |
| Q4. What do you do when there’s no signal or internet? | “We take notes on paper or locally and upload later. That’s when things go missing.” | Reliable capture in dead zones. | Data loss; compliance gaps; callbacks. |
| Q5. What’s in your hands while testing? | “Tools. Both hands. I can’t hold a radio or phone on a ladder.” | Hands-free status feedback at a glance. | Safety risk; slow, awkward comms. |
| Q6. How do you onboard a new building/panel? | “Find the panel room, check model, wiring, and look for a power socket. Basements are cramped and dark.” | Clear first-time setup guidance; environment awareness. | Setup errors; delays; technician frustration. |
| Q7. What common pitfalls do you see? | “Panel not in test mode, mislabeled points, missed logs, or commands that didn’t execute.” | Clear state awareness; prevent silent failures. | Missed defects; re-inspection; audit risk. |
| Q8. When do you feel most confident? | “When feedback is instant and consistent, and I can see results being captured as I go.” | Consistent real-time feedback; visible capture. | Low trust; second-guessing; slow progress. |
| Q9. How do you manage power on long days? | “We hunt for outlets or carry spares. Battery anxiety is real, especially in basements.” | Predictable power expectations; minimal downtime. | Unexpected stops; incomplete runs; stress. |
| Q10. What happens to records at day’s end? | “We reconcile notes, then upload. That’s when we find gaps and sometimes need to return.” | Reduce end-of-day reconciliation. | Rework; extra site visits; cost. |
| Q11. What do managers ask you for on site? | “Live status, what’s failed so far, and when we’ll finish.” | Live visibility into progress and deficiencies. | Limited oversight; planning uncertainty. |
| Q12. How do legacy panels affect your work? | “Most panels we see are legacy. Replacing them is expensive; we work around it.” | Work effectively with existing infrastructure. | Cost barriers; fragmented workflows; slow modernisation. |
| Q13. What do you do when a command fails? | “We try again, radio back, then walk to the panel to check. It breaks the flow.” | Fast detection of failed commands; clear reasons. | Flow interruptions; hidden errors; time loss. |
| Q14. What environmental factors make it harder? | “Noise, poor lighting, cramped rooms, metal enclosures, heavy doors, and no connectivity.” | Feedback that cuts through noise; works in constraints. | Missed cues; safety risks; slower pace. |
| Q15. What tells you it’s safe to proceed? | “I need to know the panel is in test mode and ready before I move.” | Clear readiness cues before action. | False triggers; safety issues; redo work. |
Personas.
Inspector Persona
District Manager Persona
Marc works on site, often in basements or plant rooms, with limited signal, poor lighting, and tight schedules.
Gateway connectivity changes the inspection from a two-person loop to a single-inspector flow. That shift puts more cognitive and physical load on Marc.
He needs feedback he can trust at a glance while both hands are on tools, and he needs confidence that results are streaming to managers even when the site has no signal.
Mapping the journey.
Inspections usually require two inspectors working in tandem: one testing devices on site, the other stationed at the fire panel to confirm results. Communication happened over radios or by shouting across floors, while both inspectors juggled tools and paper notes. At the end of the day, handwritten logs were typed into spreadsheets and sent back to managers, often with missing data or delays. Managers couldn’t see deficiencies until much later, and customers sometimes received reports days after the inspection, forcing costly callbacks when errors surfaced.
Understand → Create ←→ Validate→ Deliver
Information architecture.
The overall Xaap mobile app supports many inspection tasks, from setting up new jobs to generating reports. For this specific case study, the focus is on how Panel Commands were designed and integrated to support the gateway.
Why it matters:
Panel Commands are not tied to a single screen or inspection phase. Inspectors may need to connect, reset, silence alarms, or pull device lists at any moment. To reflect this reality, we elevated these commands into global functionality, always accessible, regardless of where the inspector is in the app.
Key considerations:
- Gateway setup and connection: Clear entry points for pairing the gateway and managing multiple units.
- Hands-on tasks: Essential commands (reset, evacuation, get points) surfaced globally so inspectors don’t break their flow when working in basements or high-pressure conditions.
- Feedback-driven states: Access level login and disconnect are mapped directly to the LED patterns on the gateway, reinforcing clarity and reducing uncertainty.
- Device trigger alerts: As soon as a device is triggered and the Inspector app receives the trigger, it will clearly show that a device was impacted, additionaly we added haptic vibrations on the device based on the type of event received.
By treating Panel Commands as global rather than nested, the information architecture aligned with the inspector’s mental model: the panel is always present, always active, and always critical. This decision was directly informed by research and became the backbone of how the gateway was experienced in the field.
Our research showed that inspectors didn’t just need a better app, they needed a way to interact with the physical gateway and the fire panel in a clear and reliable way. This meant designing the UX at two levels:
1. Gateway UX.
We designed the Xaap Gateway to connect fire panels directly to the cloud. Inspectors could now test devices with both hands free, no second inspector required.
Since the gateway device had no screen, we had to define how it communicated its states through LED signals, connection patterns, and feedback loops. Inspectors needed to understand at a glance whether the gateway was connected to Xaap, paired with the panel, executing a command, or in error.
Design & Prototyping.
Solid yellow
Connected to Cloud, but not in inspection.
Rapid yellow blinking
Connecting to inspection.
Slow yellow blinking
No Internet connection (No connected to Cloud).
Solid red
Connected to panel & Inspection (Panel not authenticated).
Rapid red blinking
Authenticating Panel.
Slow red blinking
Connected to inspection but not to Panel
Solid green
Connected to panel + Inspection + Authenticated (On standby).
Rapid green blinking
Command is being executed on the panel (device pull, reset, sound alarm, others).
Alternating Red / Yellow
Error (gateway restart recommended).
2. Inspector App ↔ Gateway ↔ Fire Panel.
We needed to design how the inspector app interacted with the gateway and fire panel across the full inspection flow. This meant defining three critical layers: system setup (connecting app, cloud, gateway, and panel securely), command execution (pulling device inventories, resets, silencing alarms, triggering evacuation), and device testing (capturing triggers and confirming results).
The gateway acted as the bridge, receiving instructions from the app, executing them on the panel, and sending results back into the inspection workflow in real time.
To make this seamless, we defined three key use cases to cover across the touchpoints:
- System connection setup: pairing the inspector app, cloud, gateway, and panel.
- Sending commands: executing instructions through the gateway to the fire panel.
- Testing devices: triggering devices and receiving real-time confirmations back in the app.
These use cases became the backbone of the interaction model, shown in the diagrams below:
Hi-fidelity mockups.
Connecting Gateway user flow.
Understand → Create ←→ Validate→ Deliver
Testing & Iteration.
To validate our interaction model, I built a clickable prototype in Figma and tested it with inspectors in real-world scenarios. The prototype simulated connecting to a gateway, authenticating a panel, sending commands, and receiving results back into the app.
During testing, we observed three key patterns:
- Gateway setup: Animated guidance prevented inspectors from assuming the device was faulty when it was simply unpaired.
- Feedback timing: Inspectors needed confirmation at every step; even short delays caused repeated triggers.
- Error handling: Clear, specific errors (e.g., “Panel not authenticated”) were preferred over generic failures, leading to state-specific LED codes and matching app prompts.
Connect Gateway Prototype.
This prototype was designed to test how inspectors would connect to a fire panel through the gateway during an active inspection.
The task guided users step by step, from accessing panel commands to verifying a secure connection, while surfacing real UX challenges around setup clarity, error handling, and feedback timing.
Understand → Create ←→ Validate→ Deliver
Delivery & Iteration.
Once designs were in place, the real challenge was ensuring the experience held up during implementation and field use. To keep the team aligned, we documented every gateway state (LED patterns, error codes, command flows) and mapped them directly to app behaviours. This gave engineers and QA a single source of truth.
Floating action button across the app
Panel Command action sheet (Opened)
During early firmware builds, inspectors reported confusion around delayed feedback, they often re-triggered commands, believing the gateway had failed.
Instead of treating this as an only engineering issue, we made some very valuable UX contributions to enhance the experience: adding progress states in the app and refining LED blink patterns to make “in progress” vs. “completed” clear.
Panel Commands action sheet – excecuting commands
Impact & Results.
Inspection efficiency.
- 80% faster first-time inspections: device inventories pulled instantly.
- 50% manpower cut per inspection: no second inspector needed at the panel, opening the possibility to increase the number of inspections performed by the same number of inspectors
- 60% faster gateway setup: guided onboarding reduced training time.
%
Faster first-time inspections
%
Manpower cut
%
Faster gateway setup
Cost & Operations.
For businesses, efficiency translates directly into savings and visibility. The gateway bridged legacy panels to the cloud, cutting costs while giving managers real-time oversight.
- 16% reduction in inspection costs: fewer hours, less rework.
- 100% real-time reporting: deficiencies surfaced instantly, not days later.
%
Reduction in inspection costs
%