SysAid ITSM Platform. Rethinking Legacy

In 2022, I joined SysAid to redesign the ticketing experience for one of the largest ITSM platforms on the market.

After observing the existing system, I knew there was a lot of potential to make it more intuitive, efficient and visually engaging.

Back then, submitting or resolving a ticket felt like navigating a maze: clunky, inconsistent and often frustrating for both agents and end-users. The challenge wasn’t just about updating the UI, it was about rebuilding clarity into a tool that had grown wide, deep and difficult to navigate over the years. The product needed simplification, not decoration.

Now let me walk you through the process of how I approached the challenge of redesigning Ticket Page and delivered a polished redesign.

- Ticket page Classic Version -

Research & Problem Mapping

The ticketing experience had grown dense and disjointed, a legacy of years of additive development. Dense by default. Every click felt like a detour. Every action was buried behind too many decisions. Simple tasks like finding the latest user reply, assigning a ticket or tracking its resolution often required jumping between tabs or scrolling through multiple timelines. And because every customer could configure the system differently, we had to find patterns that worked across a range of use cases.

Before starting with screens, I started with scenarios. I worked with my team to identify the core flows for three key roles: agents, end-users and admins; and mapped them against the product’s current structure:

• How are tickets created, prioritised and reassigned?

• Where do conversations happen?

• Where is all important ticket's data?

• When and where is resolution data added?

  
  

The UI had become a patchwork of well-meant features:

• Important actions hidden in unpredictable places

• Redundant fields scattered across ticket types

• Layouts that made it hard to scan or prioritize

The most telling moment? One developer, mid-demo, sighed and said:

---

“You need a map to get around this screen”

---

That stuck with me. I wasn’t just redesigning a UI. I was redesigning orientation.

I spent time reviewing how other platforms structured similar pages. I explored designs from companies like ServiceNow, Freshdesk and NinjaOne. This gave me ideas on best practices for information hierarchy, layout and visual cues. I wanted to combine SysAid’s unique requirements with proven patterns in ticket management.

How I Untangled the Mess - Step by Step Process

I didn’t jump into pixels. First, I had to figure out what belonged where and more importantly why.

This wasn’t a new UI slapped over an old workflow. I had to rebuild the logic behind it: What mattered? What didn’t? What did users keep clicking and what did they avoid entirely?

Step 1: Structuring the screen with purpose

The old ticket layout mixed everything together: details, messages, logs, metadata. It was hard to know where to look, even harder to know what to do.

So I split the screen in two:

• Left side: Critical ticket info - who what and why

• Right side: The full story, a timeline of every action, message and update.

-Low-Fidelity Mockup-

Step 2: Building the timeline that should’ve existed all along

Support tickets are stories. But in the old UI, the story was chopped up and buried across tabs and side menus.

I created a persistent timeline - one stream that shows everything that happened, when it happened and why. Updates. Assignments. Status changes. Notes. Automations. It's all there, in context.

Now agents didn’t need to chase the narrative. It came to them.

-Journey-

Step 3: Putting conversations where they belong

Messages, internal notes, system logs, resolution data - all of it used to live in different corners of the product.

I grouped them under one roof which triggers in Journey by clicking.

-Bottom Action Bar-

Messages: Chronological, like chat, no more scrolling back and forth

- Notes. Editing Mode-

Notes: Internal, with a subtle privacy toggle

-Time Tracking Activity-

Activities: Lightweight time tracker, so agents could track their work

-Messages. Editing Mode-

Resolutions: Clear final step - no guessing whether a ticket was done or not

-Ticket Resolution-

Step 4: Keeping attachments within reach

Files and linked tickets were previously buried. I surfaced both inside a simple tabbed interface.

No more digging. No more "where did that file go?" Now attachments and related items sit where they belong, not in another modal five clicks away.

-Journey Tabs-

Behind the Scenes: The Design System That Held It Together

To make the redesign scalable, I developed a design system alongside the work. It defined core components: buttons, inputs, status tags, tables and color tokens; and helped align the visuals across ticket types, states and future screens.

I focused on structure:

• Clear logic for typography and spacing

• Unified behavior for interactive elements

• Reusable modules for different kinds of fields.

  
  

This system wasn’t built as a separate project, it evolved through real use, refined during design reviews and implementation. By the time we reached later iterations, it gave us a shared language and faster handoff to dev.

- Design System Folders-

Prototype and Feedback Loop

Once the core redesign was in place, I turned it into a clickable prototype and started testing it with the people who would actually use it. Nothing fancy, just enough fidelity to see what broke, what confused and what needed a rethink.

Some fixes came fast and small. Others revealed bigger cracks.

Every round of feedback made the product sharper: fewer clicks, fewer question marks, correcting visual weight, spacing and hierarchy until nothing felt out of place.

-Full Ticket Page-

Development & Handoff

With the final design in place, I worked closely with developers to make sure everything translated cleanly from idea to implementation. I annotated components where behavior wasn’t obvious, exported clean specs straight from Figma and leaned on the design system to keep things consistent across the board.

The goal was simple: make implementation as smooth and unambiguous as possible so devs could focus on building, not guessing.

Reflection

This project pushed me to balance two opposing forces: importance of blending consistency and flexibility. The new ticket page has significantly boosted user experience and productivity, gave users a clearer path through their work, reduced cognitive friction and made routine tasks feel lighter.

After launch, the work didn’t stop. We kept refining the design as everyday use revealed gaps and opportunities, the kind that only show up once people rely on the system in real work. Updates are still ongoing and each iteration continues to shave off friction, improve clarity and make the page feel more intuitive.

SysAid is a 20-year-old platform, used by enterprises across the globe, with layers of complexity built up over decades. We weren’t just shipping a page; we were laying new foundations while the old structure kept running.