Untangling Interface Architecture

---

Background

RZero is a startup that offers occupancy sensors for companies to manage and strategize their office space utilization across different industries. In addition to occupancy data, the platform also captures temperature and air quality metrics. I was tasked with redesigning the user-facing occupancy analytics dashboard to transform how customers understand and act on their space utilization insights.

The Challenge: Designing for Complex User Needs

I inherited a dashboard with ambitious goals but execution gaps. My initial analysis revealed three key opportunities for improvement:

• Serving Multiple User Types. The platform was attempting to serve facilities managers (who needed to configure sensors and manage system settings) and workplace managers (who needed to analyze occupancy data for space planning) in a single interface. This created an opportunity to better tailor experiences for each user group.
• Visualization Clarity. The floor plan views suffered from color overload with no intentional hierarchy, resulting in UI that was difficult to read and interpret quickly.
• Information Hierarchy. The tag filtering system presented users with a non-hierarchical multi-column list of their tags. Users had to mentally map relationships between tags without clear visual guidance.

---

My Process: Deep Listening, Strategic Design

Discovery: Embedding with Customer Success

I joined weekly customer success calls with customers from different industries (corporate, medical, etc.) to gain direct access to user feedback. During these calls, I paid specific attention to users commenting about UI challenges. For example, during one call, a workplace manager mentioned they couldn’t distinguish between mid level utilization percentages on the floor plan. I would then probe further to learn about the underlying reasons they were seeking those mid-level percentages—understanding how this data was important and for what purpose, ensuring the UX aligned with their actual objectives.

I focused on moments when users exported data into spreadsheets and shared their custom solutions, as these clearly highlighted gaps in the application’s functionality. Question I asked were, for example:

• “What prompts you to login to the application? What questions are you trying to answer?”
• “How do you currently make decisions about space reallocation?”
• “If you could instantly see which conference rooms were underutilized in the past 90 days, what action would you take?”

Through these conversations, I learned that admin users logged in 1-2 times per week primarily for sensor maintenance and configuration, while workplace managers visited daily to check real-time occupancy and weekly for trend analysis.

Information Architecture: Designing for Mental Models

Challenge 1: The Admin Portal Separation

During user interviews, I noticed admin users would navigate to different parts of the interface than end-users, often spending time in analytics features they rarely used. This behavior pattern revealed an opportunity for more targeted user journeys. My Solution Process:

1. Journey Mapping: I mapped out both user types’ typical workflows, discovering that admins spent 80% of their time on sensor configuration tasks that end-users never touched.
   
2. Information Architecture: I designed a separate admin portal with a sensor-centric view rather than an analytics-centric view. The admin view will show sensors by type (motion, desk, room) with configuration options, and the end-user view will shows occupancy status regardless of sensor type.

I chose to create two distinct entry points rather than role-based permissions within the same interface because the mental models were fundamentally different—admins think in terms of hardware and configuration, while end-users think in terms of spaces and insights. This approach also substantially increased engineering velocity because the admin portal required less pixel-perfect attention to visual details.

Information architecture: before and after

Examples: end user vs admin interface

Challenge 2: Floor plan Visualization Enhancement

Our charts were designed with clear intent: the real-time map helps users locate an available seat instantly, while the historical map reveals which spaces are consistently under- or over-utilized.

To resolve existing interface issues and create an intuitive, easy-to-read experience, I focused on visualization clarity. The floor plan views previously suffered from color overload and lacked intentional hierarchy, making the UI difficult to scan and interpret quickly using the following design solutions:

• Map Layers: introduced layers for different data types like occupancy status and temperature 
• Real-time view: Used a simple 3-color system (Available/Occupied/Offline) for instant recognition
• Historical view: Applied the 5-color gradient to show clear patterns (0-20%, 21-40%, etc.)
• Interaction states: Implemented a combination of brightened color + contrasting outline + subtle drop shadow for selected elements, and ensured an accessible interface

In follow-up calls, users confirmed they could now quickly identify underutilized areas. The users approved of the 20% intervals since they had access to exact numbers in the detailed analytics reports, and the broader intervals were sufficient for the visualization layer.

Real-time and Heatmap Floor Plan Transformation

Before and After

Challenge 3: Filter System Enhancement

The original filter showed all possible tag combinations in a flat list, creating an opportunity to better reflect the logical relationships between categories. My solution strategy was:

• For MVP: Created a two-column layout where selecting a primary category in column 1 dynamically populated relevant sub-options in column 2
• Advanced Feature: Designed sequential select inputs allowing users to choose building, then space type, then additional categories, giving full flexibility for hierarchical tag filtering
• Interaction Clarity: Used checkboxes for multi-select scenarios (room types) and radio buttons for exclusive choices (buildings), plus a prominent “Reset Filters” button for easy error recovery

Tags Hierarchy Redesign

---

Strategic Enablers

Visual Design: Constraint-Driven Design

With tight development timelines, I strategically adopted components from the existing design system rather than creating custom elements. I used the same SHADCN component library already implemented in the project, creating a starting style library for velocity prototyping while maintaining consistency.

Collaboration: Presenting Options for Strategic Decision-Making

I learned to assess project priority, importance, and timeline before deciding whether to present the UX-ideal solution or prioritize low-effort engineering approaches. I developed a practice of offering design options sorted by anticipated implementation effort.

Initially, I presented the ideal two-column hierarchical filter approach, and the engineering team found an efficient way to implement it using existing component patterns. Later, when timeline allowed, I was able to design a more thoughtfully crafted advanced filtering experience.

I established regular check-ins with both 8-person engineering teams, not just for handoffs but for ongoing design questions during implementation. This included providing alternative solutions when technical constraints emerged and making real-time decisions about interaction details.

---

Impact & Results

• Usage: 40% increase in weekly platform visits measured over 3 months post-launch
• Feature transformation: Real-time dashboard became the most visited feature after previously being the least visited
• Enhanced usability: Customers reported on routine calls how easy it became to analyze data and export insights for executive presentations
• Customer Success Quote: “For the first time, customers are asking us how to integrate the floor plan view into their office kiosks. They want to replace traditional wayfinding with our real-time occupancy data.”
• Internal Recognition: Received a company-wide “Kudo” for the project impact—specifically for improving customer perception of our platform’s sophistication.
• Business Value: Customers began incorporating our charts directly into their executive presentations because the visual clarity allowed external audiences to understand the insights without additional context.

---

Key Learnings and Insights

• Direct Customer Access Is Invaluable: Joining customer success calls provided insights that filtered feedback couldn’t capture—especially around emotional reactions and behavioral patterns that drive daily usage decisions.
• Present Options, Enable Strategic Decisions: Rather than aspiring to perfection, I learned to present design options from UX-ideal to low-effort implementation, then collaborate with teams to find the best balance for each situation. This approach consistently produced better outcomes than self-limiting designs based on assumed constraints.
• Systems Thinking Under Pressure:Adopting existing design system components rather than creating custom ones allowed us to maintain quality while meeting aggressive timelines—but required careful selection and strategic adaptation to serve our specific use cases.