OmniDeq

Application Modernization Platform

Helping energy-intensive teams anticipate risks, act faster and decide with confidence.

AI/ML

Operations

B2B

Details are modified due to NDA.

What is OmniDeq?

OmniDeq helps businesses upgrade legacy systems into modern solutions, be it On-Premise, Cloud, Edge or IoT solutions; boosting efficiency and scalability for updating their IT infrastructure.

My role & responsibilities

UX + UI Designer

UX Analysis, Heuristic review

Define and prioritize goals

Journey Maps

Navigation & Information Architecture

Prototypes

Design System

Iterative design

Implementation support

Team

Founder

CTO

Solution Architect

5 Software engineers

Product Designer

Platform:

SaaS and Enterprise, Web

B2B

SaaS and Enterprise, Web

B2B

Client:

CloudHedge Pvt. Ltd.

Need for a redesign

Usability issues in the existing platform were identified by customer-facing teams through user feedback. With OmniDeq accelerating application modernization for multiple Fortune 500 companies and US Federal agencies, the need for a redesign was evident for the client.

This led to a redesign aimed at enhancing:

Navigation issues

Ambiguity for user's next steps

Lack of intuitiveness

Confusion

Visual inconsistency

The global application modernization services market size of USD 15.2 billion in 2022 is projected to grow to USD 32.8 billion by 2027.

Old interface analysis

By analyzing the old interface, I identified usability issues across all screens and workflows. These insights informed the redesign, aiming to streamline and simplify the modernization process while enhancing efficiency and reducing task completion time. Below are key screens that were analyzed.

Defining the challenge

How might we enhance the user experience of OmniDeq to streamline and simplify the application modernization process, making it more intuitive and efficient for enterprises to adopt and fully leverage the platform’s capabilities?

What was the process?

We used agile practices like iterative design and continuous feedback to deliver a high-quality and efficient design. Weekly client review and early developer involvement helped to meet deadlines while incorporating actionable feedback at each stage of the process and improving the experience.

Discovery

Discovery

Discovery

Map existing workflows & identify opportunities for UX enhancements.

Map existing workflows & identify opportunities for UX enhancements.

Map existing workflows & identify opportunities for UX enhancements.

Review

Review

Review

Heuristic evaluation and analyzing user interactions.

Heuristic evaluation and analyzing user interactions.

Heuristic evaluation and analyzing user interactions.

Prioritize

Prioritize

Prioritize

Develop a structured priority for phased UX UI enhancements.

Develop a structured priority for phased UX UI enhancements.

Develop a structured priority for phased UX UI enhancements.

Design & Prototype

Design & Prototype

Design & Prototype

Ideate solutions and craft prototypes to visualize the redesign

Ideate solutions and craft prototypes to visualize the redesign

Ideate solutions and craft prototypes to visualize the redesign

Evaluate

Evaluate

Evaluate

Gather feedback from stakeholders and refining designs

Gather feedback from stakeholders and refining designs

Gather feedback from stakeholders and refining designs

Iterate

Iterate

Iterate

Feedback

Feedback

Feedback

Old interface analysis

By analyzing the old interface, I identified usability issues across all screens and workflows. These insights informed the redesign, aiming to streamline and simplify the modernization process while enhancing efficiency and reducing task completion time. Below are key screens that were analyzed.

Discover section

1

1

2

2

3

3

1

1

Ambiguous information hierarchy and navigation

Ambiguous information hierarchy and navigation

2

2

Selection-dependence

Selection-dependence

3

3

Visual inconsistency

Visual inconsistency

Transform section

1

1

2

2

3

3

1

1

Lack of contextual actions

Lack of contextual actions

2

2

Unclear grouping and hierarchy

Unclear grouping and hierarchy

3

3

Limited information on cards reduces clarity

Limited information on cards reduces clarity

Customize build

1

1

2

2

3

3

1

1

3

3

2

2

1

1

Cluttered workspace because of dual panel layout

Cluttered workspace because of dual panel layout

2

2

Overloaded dropdown menu for version control

Overloaded dropdown menu for version control

3

3

Inconsistent functions of buttons

Inconsistent functions of buttons

Discovery log

2

2

1

1

2

2

3

3

1

1

Visibility of system status is not evident

Visibility of system status is not evident

2

2

Difficult to navigate log list

Difficult to navigate log list

3

3

Hidden dependency on user action

Hidden dependency on user action

Defining the challenge

How might we enhance the user experience of OmniDeq to streamline and simplify the application modernization process, making it more intuitive and efficient for enterprises to adopt and fully leverage the platform’s capabilities?

Heuristic evaluation

Conducted a Heuristic evaluation based on Nielson’s heuristic principles, and these were the top recommendations based on the findings.

Features

• Navigation on Discover and Transform pages could be improved .

• A Guided tour can help new users complete their first modernization journey in an easier way.

• Advanced search and filter options could be implemented.

• Navigation on Discover and Transform pages could be improved.

• A Guided tour can help new users complete their first modernization journey in an easier way.

• Advanced search and filter options could be implemented.

• Group content in a logical order & prioritize valuable content and features .

• Making it easier for users to access the next step in the process.

• Providing more and better visual cues and visual affordances .

• Improve visibility of the discovery statuses across processes.

• Group content in a logical order & prioritize valuable content and features .

• Making it easier for users to access the next step in the process.

• Providing more and better visual cues and visual affordances .

• Improve visibility of the discovery statuses across processes.

• Bringing consistency in the visual components.

• Keeping all terms like process, images and service consistent for clarity in understanding.

• Navigation on Discover and Transform pages could be improved.

• A Guided tour can help new users complete their first modernization journey in an easier way.

• Advanced search and filter options could be implemented.

Theme

Usability

Usability

Discoverability

Consistency and standards

Discoverability

• Group content in a logical order & prioritize valuable content and features .

• Making it easier for users to access the next step in the process.

• Providing more and better visual cues and visual affordances .

• Improve visibility of the discovery statuses across processes.

• Navigation on Discover and Transform pages could be improved.

• A Guided tour can help new users complete their first modernization journey in an easier way.

• Advanced search and filter options could be implemented.

Usability

Consistency and standards

• Bringing consistency in the visual components.

• Keeping all terms like process, images and service consistent for clarity in understanding.

Prioritize and plan

I collaborated with the project manager, engineers, and product team to tailor a plan that fits business goals and eases implementation. We opted for a phased approach, ensuring minimal disruption and smooth user transitions. This strategy allowed for seamless enhancement integration.

Immediate fixes

Structural changes

Structural changes

New features

Consistency, error messages, empty states, tips, accessibility..

Revamp information architecture, improve navigation flows

Revamp information architecture, improve navigation flows

Rationalization, Reports, Dashboard...

Rationalization, Reports, Dashboard

Product design goals

The UX review pinpointed areas needing improvement that helped me define the project goals:

Intuitive navigation & improved interactions

Improve navigation & interactions

Enhance information organization

Enhance information organization

Achieve visual harmony

Achieve visual harmony

Optimize usability and user guidance

Optimize usability and user guidance

Design recommendations

After the quick overall fixes recommended, the process involved majorly taking on redesign of each section in order of the workflow and designing new features. Here are some key enhancements from the extensive tool.

The product was later rebranded as 'Omnideq', and a new branding language was set in place. So two different sets of brand colors and typography will be noticed in the screens presented ahead.

Dashboard

Previously, the home page featured only shortcuts for primary product functions (Assess, Prepare, Transform, Deployment), leading to the respective workflow.

Pre-modernization and Post-modernization Dashboards were introduced. The dashboard views were tailored to different user needs.

The activity timeline makes it easier for the user to stay updated on the ongoing work across the application, across users, depending on the user’s role and access.

The activity timeline makes it easier for the user to stay updated on the ongoing work across the application, across users, depending on the user’s role and access.

The activity timeline makes it easier for the user to stay updated on the ongoing work across the application, across users, depending on the user’s role and access.

Errors and cautions highlighted on the top

Errors and cautions highlighted on the top

Errors and cautions highlighted on the top

Overview of the status across application blueprints

Overview of the status across application blueprints

Overview of the status across application blueprints

Overview of

recently active waves.

With an overview of applications and their progress

Overview of

recently active waves.

With an overview of applications and their progress

Overview of

recently active waves.

With an overview of applications and their progress

Expandable card

Error/blocker in the journey

Expandable card

Visual representation of where the wave is on its modernization journey

Visual representation of where the wave is on its modernization journey

Error/blocker in the journey

Expandable card

Improved hierarchy of information and grouping

Defining styling for primary, secondary and tertiary actions

Defining the hierarchy of page-level elements and designing layout accordingly

Making progress status visible and clear

Primary

Primary

Discovery progress status

Discovery progress status

Secondary

Secondary

Breadcrumbs for better discoverability

Breadcrumbs for better discoverability

Horizontal tabs to lay out information in the wave

Horizontal tabs to lay out information in the wave

Enhanced workflow continuity

The "Go to Transform" action seamlessly transitions users to the 'Transform' section.

Bulk actions make the process faster

Applications panel for easy, consistent access and filtering

Understanding the product and modernization flow

Through multiple interactions and walkthrough sessions with the founder, CTO and subject matter experts, I mapped the modernization flow.

Application deployed to target

Application deployed to target

Deployed

Deployed

(Containerize)

(Containerize)

Transform

Transform

Check network connectivity

Check network connectivity

Start Xray

Start Xray

Build container images

Build container images

Validate pre-requisites

Validate pre-requisites

Functional tests

Functional tests

Probe/Discover Host

Probe/Discover Host

Stop xray

Stop xray

Analyze

Analyze

Cruize

Cruize

Waves

Waves

Wave 1

Wave 1

Wave added

Wave added

Host added

Host added

Host 1

Host 1

Add Wave/s

Add Wave/s

Add Host/s

Add Host/s

Profiles ready for transform

Profiles ready for transform

Processes ready for Xray

Processes ready for Xray

Xrayed

Xrayed

Services

Services

Discovered

Discovered

Built

Built

Discovery process

Discovery process

1

1

Xray process

Xray process

2

2

Containerization

Containerization

3

3

Blueprints for deployment

Blueprints for deployment

5

5

Create Applications

Create Applications

4

4

Create Applications

Create Applications

4

4

Deployment Targets

Deployment Targets

6

6

Deploy blueprints

Deploy blueprints

7

7

Docker file

Docker file

Files

Files

Runtime parameters

Runtime parameters

Validate and build

Validate and build

Transform profiles

Transform profiles

Created

Created

DISCOVER

DISCOVER

TRANSFORM

TRANSFORM

CRUIZE

CRUIZE

Enhanced Discovery log

In the earlier design, clicking the discovery log prompted an empty panel to slide up, indicating that selecting a Host was a prerequisite to access its log. This added an unnecessary step.

Collapsible log panel

Collapsible log panel

The summarized progress overview on the persistent bar of the log was acknowledged as a valuable addition for the users.

The summarized progress overview on the persistent bar of the log was acknowledged as a valuable addition for the users.

The summarized progress overview on the persistent bar of the log was acknowledged as a valuable addition for the users.

Optimized workflow progression

Organized tabs ‘Define and Transform applications’ to align with workflow stages make task progression clear, minimize errors, and optimize completion by enforcing defined order while reducing cognitive load.

Aligned ‘Define and Transform applications’ with workflow stages to make task progression clear, minimize errors, and optimize completion by enforcing defined order while reducing cognitive load.

Enhanced containerization process

Earlier, buttons on the top were used by the user to perform actions on the profile selected below. The redesign changed the layout by creating tabs for processes.

Collapsible panel

Designed to save space & keep the workspace tidy and focused.

Collapsible panel

Designed to save space & keep the workspace tidy and focused.

Collapsible panel

Designed to save space & keep the workspace tidy and focused.

Buttons changed to Tabs

Previous action buttons changed to tabs for improved usability.

Buttons changed to Tabs

Previous action buttons changed to tabs for improved usability.

Buttons changed to Tabs

Previous action buttons changed to tabs for improved usability.

Final image version visibility

This streamlines the process better than the earlier interface.

Final image version visibility

This streamlines the process better than the earlier interface.

Final image version visibility

This streamlines the process better than the earlier interface.

'Build Container Image’ button, streamlines the final step in the process. (button activates when all the steps are complete)

'Build Container Image’ button, streamlines the final step in the process. (button activates when all the steps are complete)

'Build Container Image’ button, streamlines the final step in the process. (button activates when all the steps are complete)

Portfolio Rationalization

A new sub section called Portfolio Rationalization and Report is introduced under the Discover section. This section serves as a strategic tool, offering users an in-depth overview of their ongoing modernization journey across applications.

Here, users can meticulously plan and strategize their modernization process by organizing it into manageable waves, ensuring a smoother and more structured approach, while being assisted by intelligent recommendations from Omnideq platform.

Modernization order

The tool displays the applications in order of priority of modernization based on its intelligent recommendations.

The user can reorder and change the priority.

Modernization order

The tool displays the applications in order of priority of modernization based on its intelligent recommendations.

The user can reorder and change the priority.

Overview of Applications

Overview of Applications

This includes:

Defining App Criticality

Modernization goals

Migration classificaton

This includes:

Defining App Criticality

Modernization goals

Migration classificaton

Modernization order

The tool displays the applications in order of priority of modernization based on its intelligent recommendations.

The user can reorder and change the priority.

Overview of Applications

This includes:

Defining App Criticality

Modernization goals

Migration classificaton

Report

The Report section provides comprehensive summaries of all workflows and key activities within the platform. It is a centralized hub for users to get a holistic view of their operations, helping with better decision-making and analysis.

Users can meticulously plan and strategize their modernization process by organizing it into manageable waves, ensuring a smoother and more structured approach, while being assisted by intelligent recommendations from Omnideq platform.

Modernization order

Modernization order

Modernization order

The tool displays the applications in order of priority of modernization based on its intelligent recommendations.

The user can reorder and change the priority based on their needs.

The tool displays the applications in order of priority of modernization based on its intelligent recommendations.

The user can reorder and change the priority based on their needs.

The tool displays the applications in order of priority of modernization based on its intelligent recommendations.

The user can reorder and change the priority based on their needs.

Applications summary

Applications summary

Applications summary

Topology

Topology

Topology

The visual representation of the process communication and connections.

Users can refine their view using filters, providing a more detailed and customizable understanding of system interactions.

The visual representation of the process communication and connections.

Users can refine their view using filters, providing a more detailed and customizable understanding of system interactions.

The visual representation of the process communication and connections.

Users can refine their view using filters, providing a more detailed and customizable understanding of system interactions.

An overview of critical application details and an ability to change parameters like application complexity, classification method, labels, processes, and more.

An overview of critical application details and an ability to change parameters like application complexity, classification method, labels, processes, and more.

An overview of critical application details and an ability to change parameters like application complexity, classification method, labels, processes, and more.

What did I learn?

Leading the UX efforts

As the sole UX designer, I got the opportunity to enhance my skills in managing diverse design tasks, improve communication with team members, adapt to complex challenges, and grow more confident in my design choices.


Navigating complexity through collaboration

Constant collaboration with the team, facilitated a deep understanding of complex technical workflows. Despite the remote setup, the founder's adept use of relatable examples made intricate concepts easily graspable.


A different viewpoint
Being new to designing a modernization tool was an asset. Approaching the platform with a fresh perspective enabled me to capture invaluable insights regarding usability, which might have been overlooked otherwise.


The importance of an iterative process & step by step progress

Timely iterations after feedbacks and discussions led to better outcomes. In the process of redesigning the current tool, there were instances where giving priority to specific issues and systematically addressing them, step by step, proved more effective in achieving the desired results than proposing significant fixes all at once.