Unified Portal

Bringing together multiple services under one intuitive,
seamless portal to optimize user experience,
reduce complexity, and maximize product value.

Cybersecurity company acquired 2 subsidiary companies.

Unify 3 products, create a single cohesive interface.

Ongoing process, this project will review only the first phase.

My Role & Resposibilities

  • Design and develop wireframes, prototypes, and pixel-perfect UIs.
  • Own features from idea to implementation.
  • Provide UX and UI solutions for complex configuration.
  • Research.
  • Collaborate seamlessly with cross-functional teams throughout the project lifecycle.

The fragmented structure of existing services created disconnected experiences,
overwhelming users with multiple platforms, inconsistent interfaces, and unclear navigation.

Our mission was to unify these into a single, coherent portal while maintaining functionality,
improving usability, and reinforcing product value.

Technical level

Integrating Independent Products
Distinct products with unique data structures.

Legacy Code Navigation
Diverse underlying codebases from each product.

Data Harmony
Managing complexities in data integration to avoid inconsistencies and maintain data integrity.

User Experience Level

Inconsistent User Interfaces
Different interfaces and design styles.

Fragmented User Journeys
Require users to navigate between separate platforms.

Usability Issues
Inefficiencies and disrupting workflows.

 Unified Portal

Objective: Enhance operational efficiency, reduce costs, and improve data coherence.

Benefits: Simplify user experience, and empower better decision-making.

Cross Sale

Objective: Facilitate targeted marketing strategies and enhance sales efforts.

Benefits: Increase revenue streams, and capitalize on customer needs more effectively.

User Experience

Objective: Offer a consistent experience and easy access to comprehensive information.

Benefits: Improve user satisfaction, streamline workflows, and enhance productivity.

Screenshots of the original products.

Offer a glimpse into the visual design and user experience challenges that led to the unified solution

To tackle this challenge, the product design team and I developed a strategy focused on aligning visual design elements, enhancing user experience, and harmonizing the underlying codebase.
We followed these key steps to achieve our goals:

Visual Design Alignment

The first step was a thorough analysis of the visual design elements across all three products to identify both commonalities and discrepancies.
This analysis revealed a critical challenge: inconsistent UI elements across the products.
To deliver a seamless user experience, it became essential to establish a unified design language that aligned both visual style and functionality.

Unified Design System

The analysis guided the development of a unified visual language
to ensure consistency across the interface.
We established standardized color palettes, typography, layouts, and UI components to create a cohesive and intuitive user experience.

Strategic UI Refresh

With a full rewrite off the table (due to extensive legacy code),
we took a smarter route: a targeted UI refresh.
We modernized the look, kept the experience seamless,
and protected the value of existing systems — all while moving faster toward a unified, user-first platform.

Dark Mode

As part of a broader strategy to modernize the portal,
we implemented dark mode to address user demand and enhance long-term usability.
This addition supports better accessibility, reduces visual fatigue, and strengthens the portal’s alignment with current UI best practices.

Merging the three products into a single portal created an opportunity to reimagine
the user experience across key functionalities.
Following the consolidation, we introduced unified features designed to enhance user interaction,
streamline workflows, and improve overall efficiency.

Here are some examples:

Side-by-Side Configuration

For complex systems with large datasets, the side-by-side configuration offers a seamless solution.

Users can access a side panel within the same screen, eliminating the need for additional navigation and allowing them to configure settings while viewing the main content.

This approach streamlines workflows and enhances the user experience by enabling simultaneous interaction.

 

Data-Driven Insights

The new portal enabled the design of innovative dashboards that leverage advanced data visualization techniques to present security metrics and trends clearly and concisely.
This empowers users to navigate large volumes of data effortlessly, uncover valuable insights, and make informed decisions to proactively mitigate risks.

Product Visibility

The unified portal introduces a new approach to product visibility.
Unlike previous versions, it showcases all available features, even those beyond a user’s current plan, providing full transparency.
This empowers users to explore the platform’s complete cybersecurity offerings and tailor their subscriptions to their evolving needs and preferences.

Transforming the User Experience

Through features like side-by-side configuration, data-driven dashboards, and enhanced product visibility, the unified portal delivers a streamlined, intuitive, and future-ready user experience.
Each improvement was thoughtfully designed to empower users, simplify complex workflows, and drive greater engagement across the portal.

This project highlights how strategic design can drive real transformation, even within the constraints of complex legacy systems.
By unifying three standalone products into a seamless, user-centered platform, we delivered a major leap forward in usability, consistency, and product value.
While evolution continues, the foundation we’ve built positions the platform for ongoing innovation, ensuring it remains a leading force in the cybersecurity landscape.

By unifying complex systems into one seamless platform, we turned challenges into opportunities — setting a new standard for user experience and innovation in cybersecurity.

Thank you

Accessibility Toolbar