Role

UX Planning and UI Design

Tools

Figma, Adobe Illustrator

Company

Privafy technologies Inc

Introduction

SITE is a Saudi-based Information Technology company specializing in cybersecurity, cloud computing, systems integration, software development, and human capital management. One of its products, SITE Metras, is an enterprise management system designed for comprehensive user and device management, cybersecurity protection, and network monitoring. Metras provides end-to-end security solutions tailored for enterprise needs.

The goal of this project was to enhance the user experience of the Metras portal without a complete overhaul, given a tight timeline due to a recent acquisition. This project presented valuable learning opportunities while successfully achieving its objectives.

Problems

  • Excessive nested scrolling issues
  • Large amounts of empty space in the portal
  • Difficulty in browsing through extensive content lists
  • Readability challenges
  • Ineffective navigation system
  • Poor responsiveness on different devices

Solution

  • Eliminated all inline scrolls.
  • Optimized space utilization to ensure most content fits within the viewport.
  • Improved typeface for better readability, even at smaller sizes.
  • Redesigned the header and navigation for enhanced intuitiveness.
  • Enhanced adaptability for smaller screens.

Focus Points

Typeface

Color

Data Table

Calendar Component

Left Navigation

Buttons

Page Header and sub tabs

Input components

Navigation Remap

Improved Interface

Outcome

The UI improvements to the SITE Metras portal resulted in a more intuitive and efficient user experience, fulfilling the project’s goals within the limited timeline. Key achievements included:

  • Increased Usability: Simplified navigation and reduced scrolling made it
    easier for users to access and manage critical data, resulting in faster task completion

  • Enhanced Readability: The new typeface, along with optimized spacing, significantly
    improved content legibility, especially for users working with extensive datasets.

  • Improved Responsiveness: The interface now adapts seamlessly across devices, expanding
    accessibility for mobile and tablet users without compromising functionality.

  • User Satisfaction: User feedback indicated higher satisfaction with the streamlined design and
    ease of use, supporting SITE’s goal of delivering a high-quality experience without a full-scale redesign.

Overall, the UI enhancements have strengthened SITE Metras’ position as a reliable enterprise management tool, supporting both cybersecurity and usability needs while achieving a modern, cohesive design.