UX / Product Design — Case Study
Designing clarity in a data‑dense world
Space planners rely on the Space Viewer to make high‑stakes decisions about seating, allocations, and workplace strategy. The challenge is that every seat on a floorplan carries multiple layers of meaning—seating function, occupant assignment, org‑unit allocation, capacity, neighborhoods, and even temporary move‑group metadata.
Visualizing all of this simultaneously without overwhelming the user required a careful balance of density and clarity. My goal was to create a visual system that allowed planners to scan a floorplan at a glance, understand its operational state, and make confident decisions—without sacrificing visual harmony or accessibility.
Space planners make decisions that affect seating assignments, workplace utilization, real-estate costs, and employee experience.
The existing viewer presented large amounts of information, but users struggled to balance detail and clarity. Labels overlapped, color systems became noisy, and visualizations designed for one task often performed poorly when applied to another.
My challenge was to design a visual language that could communicate multiple layers of workplace information simultaneously without overwhelming the floorplan.
The challenge
Role
Lead UX Designer
Product
Workplace Visualization Platform
Users
Corporate Real Estate Managers, Space Planners, Workplace Administrators
Challenge
Visualize multiple workplace datasets on a single floorplan without overwhelming users.
Solution
Created a scalable visualization system that supports occupancy analysis, space planning, move management, and wayfinding within a single interface.
Multiple workplace datasets can be explored within a single floorplan view, allowing planners to switch perspectives without losing spatial context. Supporting panels and legends can be expanded when needed or tucked away to maximize floorplan space and maintain focus on the visualization.
Design principles
Throughout the redesign, I used three guiding principles:
Information First: Users should be able to understand the state of a floorplan within seconds.
Progressive Details: Show more information only as users zoom or interact
Consistency Across Data Types: Occupancy, allocation, move planning, and wayfinding should all feel like parts of the same system.
Labels that stay legible at any scale
One of the most persistent issues in floorplan visualization is label overlap, especially when users zoom out to see the broader spatial context. Planners want labels visible at all times because hovering over each asset slows down their workflow. To solve this, I designed an adaptive labeling pattern that fits within a typical seat footprint and intelligently truncates when names exceed available width. This approach preserved scannability while preventing collisions between adjacent labels. The result was a labeling system that remained readable, stable, and unobtrusive across all zoom levels—supporting the planner’s natural scan‑first behavior without introducing clutter.
Labels adapt to available space, truncating at broader zoom levels and expanding as users zoom in, preserving both readability and floorplan clarity.
A multi‑signal marker for modern space planning
To reduce the visual noise created by multi‑colored room fills and borders, I introduced a multi‑signal circular marker capable of conveying up to four pieces of information at once. Each marker combines an icon or occupant initials, a background color, labels and an optional highlight ring—allowing planners to see space function, occupancy status, allocation, and user‑selected metadata in a single compact element. I designed the system to meet WCAG 2.1 AA contrast requirements, ensuring icons and initials maintain a 4.5:1 ratio against any background. This marker system replaced a chaotic color model with a clean, scalable visual language that communicates more while showing less.
Each marker combines multiple signals into a single visual element, allowing planners to understand occupancy, function, and organizational allocation without overwhelming the floorplan.
Revealing the right information at the right time
A workplace floorplan can answer many different questions, but showing every layer of information simultaneously quickly becomes overwhelming. To help users focus on the task at hand, I designed a flexible legend system that organizes visualization controls into distinct categories.
Users can switch between different color schemes to analyze space assignments, organizational ownership, or occupancy patterns. Contextual legends explain the meaning of space markers and point-of-interest icons, while annotation tools allow planners to communicate directly on the floorplan. Custom tags add another layer of flexibility, enabling teams to identify and visualize spaces that share important characteristics such as accessibility, project ownership, or operational status.
By separating these controls into focused views, the system supports rich workplace analysis without sacrificing clarity or overwhelming the user.
The legend serves as the control center for the floorplan, allowing users to change visualization modes, interpret markers, manage points of interest, and reveal additional layers of workplace information as needed.
Outcome
The redesign introduced a cohesive visual language for workplace data, making complex information easier to scan and interpret. By reducing clutter, strengthening visual hierarchy, and incorporating accessible color and contrast standards, the system helped users work more confidently across a wide range of workplace scenarios. The resulting framework balanced information density with clarity while providing a scalable foundation for future enhancements.