Complex System Redesign
A Real Case Study
OVERVIEW
This project involved completely redesigning a complex system that had been developed without UX/UI considerations. Together with my team, we conducted in-depth work to understand user needs and designed an intuitive and efficient interface.
ROLE
Product designer & Team lead
PROBLEM
The initial system lacked proper UX/UI, resulting in a broken overall user experience. The search screen was overloaded with fields, making it difficult and slow to search, while the dashboard was cluttered with too many columns, forcing users to search for long periods to find the needed information.
GOALS
The goal of the project was to simplify the user experience by improving the search screen and the results table. We aimed to reduce the number of fields in the search, making it faster and easier to use. Additionally, we focused on decluttering the results table, which appeared after a search, by minimizing unnecessary columns. This allowed users to quickly and efficiently find the information they needed. Overall, the goal was to transform a technically challenging platform into a seamless and accessible experience.
Research & Design System
For this project, we adopted a minimalist approach inspired by concepts like Zero UI and design practices from major companies like Google. The original system used a specific shade of blue for the buttons, and we decided to keep this color in the new UI to ensure visual continuity. We chose shades of grey and blue to create a clean, modern, and intuitive interface. User research helped identify the core needs, and the design system was built to simplify the experience while maximizing efficiency.
Colors of the old system
Colors of the new system
New Grids and Radius Design
The spacing between elements is consistently set to 20 px, with rounded corners using a radius of 5 pixels for a cohesive and modern design.
Step-by-Step Process and Before/After Comparisons
Given the complexity of multiple user flows, we adopted a step-by-step approach to building the design. This project involved addressing various user journeys, including one where a user opens the system, performs a search, and reviews the history log. We also worked on other key flows and present before/after comparisons here to highlight the significant improvements made at each stage.
A Smarter and More Customizable Search Bar
The search bar has been completely redesigned to deliver a more intuitive and customizable experience. Users can now add fields to their search and leverage a multiple adding option to add several fields simultaneously. Predefined templates further streamline the setup process. A new feature allows users to locate and jump directly to the desired column in the table, while a drag-and-drop option makes it easy to rearrange fields as needed. The table updates in real-time, providing immediate feedback on changes. These enhancements make the search process faster, more flexible, and tailored to diverse user needs.
A Clearer, More Informed History Log
The permissions log has been enhanced for a clearer and more efficient experience. The interface is now streamlined, with visible filters and sorting options. Detailed changes, such as the user's name and the exact timestamp, are explicitly displayed. Additional context (organization name, client ID) and color-coded statuses improve readability and understanding. Pagination buttons make navigating large datasets more intuitive and user-friendly.
A Smarter Export Function
The updated export interface is more intuitive and customizable. A search function helps quickly locate fields, while drag-and-drop or direct input allows precise positioning in the table.
Simplified and Flexible Permissions Management
Permissions management has been redesigned to be simpler and more practical. Now, each user is assigned a predefined team role upon creation. Permissions can be easily customized if needed. The interface is designed to be clear and user-friendly, with accessible options for quick and efficient management.
Simplified and Modern User Creation
The user creation feature has been completely redesigned with a strong focus on the user interface. The modern, streamlined design makes each step intuitive, reducing complexity and errors. Clear visual elements, well-structured fields, and contextual actions allow for quick configuration of new users while ensuring a smooth and pleasant experience.
_edited.png){kind=small}
.png)
%201.png){kind=small}
