Why stick with me?
I know you have a lot of portfolios to review—it’s time-consuming. So why is this one worth your time?
Optimizing UI Real Estate: Designed a reusable component to tackle spacing constraints, ensuring a scalable and efficient UI layout.
Structuring Chat for Clarity & Scalability: Developed a clear separation between public and private chats, laying the foundation for long-term improvements in user experience.
Project Summary
Rescue has been the company’s flagship product for almost 25 years. Its Desktop Technician Console enables technicians (support agents) to efficiently provide remote support, troubleshoot issues, and manage devices seamlessly across various environments.
Rescue launched the Web Technician Console, a web-based version of the product, aiming for near-complete feature parity with the desktop version. The feature adaptation is a multi-year process, prioritizing features based on importance. In-Session Collaboration is one of the most highly requested by customers.
My role
As a Product Designer, I led the UX delivery process, translating PM briefs into new designs while incorporating feasibility feedback from Engineering.
Project goals
Adaption: Adapt the feature to the Web Technician Console while using the Desktop Technician Console as the baseline, ensuring its logic and functionality remain intact.
UX improvements: Enhance the invitation flow and chat with UX improvements for a better user experience
Challenges
Space, space, space...
Instead of introducing the entire design process, I want to focus on one particularly challenging aspect: spacing.
For technicians, the key performance indicator is resolution time. My design must help them quickly find relevant information, identify issues on the customer’s shared screen, and communicate via chat—all within a limited interface. Screen real estate is crucial, requiring information and actions to be easily accessible without overwhelming the user.
New Designs - ‘Invite Technician’
Improving the Invitation Flow
The invitation flow was originally a two-step process within a single dialog, requiring excessive scrolling. To improve focus and usability, I redesigned it as a sequential two-step flow, allowing users to complete one action at a time.
Additionally, instead of keeping it in a dialog, I proposed moving it to the Session Container, which serves as the central hub for secondary session features like chat and collaboration. This integration not only enhances consistency but also ensures a more scalable and intuitive user experience.
The Challenge of Scalability
The initial design worked well for one or two Technician Groups (assigned by admins). However, during our first design review with Product Managers, we identified a key scalability issue:
In complex cases with multiple sub-group space constraints made it difficult to display technicians efficiently.
This challenge prompted us to consider long-term scalability, ensuring Web Technician Console could support future expansions without recurring UI limitations.
The Scalable Solution
✅ Established the side panel as a reusable component for future multi-step flows
By adopting this solution, we not only solved the immediate scalability issue but also future-proofed the UI for upcoming feature adaptations.
Balancing Readability & Action Accessibility
On the Desktop Console, actions are always visible without extra clicks, suggesting that keeping them immediately accessible might be vital in Web Technician Console as well.
Solution: Prioritization for Task Efficiency
To evaluate the impact of different solutions, we interviewed PMs to understand how often these actions are used. We found that:
Most technicians primarily use this page for communication, and these actions are not frequently accessed.
New Designs - ‘Chat’
Moving Private Messaging to a Separate Tab
While keeping all chat interactions in one place may seem intuitive, discussions with PMs revealed that technician-to-technician messaging is infrequent. This led us to reconsider whether private chat should remain in the main chat area or be better integrated into a broader collaboration hub.
To improve clarity and usability, we decided to move private messaging into the Collaboration tab. This change:
✅
Keeps public chat distraction-free
✅
Prevents accidental miscommunication
✅
Creates a cleaner, more structured experience
Making collaboration tools easier to navigate.
Since user testing wasn’t possible due to resource constraints, we plan to monitor performance post-launch and refine the design based on real-world feedback.
Takeaways and lessons learned
Through this project, I gained valuable insights into adapting complex desktop features for a web-based environment while balancing usability, scalability, and technical feasibility. Key learnings include:
Space constraints demand creative solutions – Truncating names, restructuring the invitation flow, and moving private messaging all reinforced the importance of designing for limited real estate without compromising functionality.
Stakeholder collaboration drives better decisions – Engaging with PMs and engineers early helped validate feasibility and refine solutions before investing too much in a single direction.
Balancing value and effort is crucial in design – Balancing usability and technical feasibility is crucial in UX design—decisions should be driven by user needs while considering implementation complexity.
