"dab" Agent Application
Enhancing user interface and user experience of data extraction web application
This application allows users to connect to an external system (such as SAP), test and confirm the connection, and then run a data extraction or analytics process while clearly showing its progress. The user starts by entering connection details, verifies them with a test, and once the connection is successful the system initializes and begins extracting or analyzing data through the Nexus module. During the run, the app provides visible progress feedback, and the process ends in either a successful completion or an error state, making a complex technical workflow easy to understand and follow.
Role: UI/UX Designer
Tools: Figma
Timeline: 3 months
Old user interface of web application
Workflow of web application
The Challenge
From user feedback, it was clear that the tool was too complex for many users. Because it lacked clear guidance, validation, and onboarding, users often made mistakes, had connection problems, and found the results hard to understand. This made the tool frustrating for non-technical users.
Discovery
To better understand recurring user issues, I reviewed support tickets from the last three months. This helped identify the most common problems users faced while using the product, especially during connection setup and data extraction. I wanted to answer the question:
Where do users get stuck most often?
Users frequently reported connection and authentication issues. Many also mentioned that extraction jobs felt unclear or “stuck” because there was no visible progress or confirmation. Others shared that the extraction progress screen was difficult to understand and did not clearly explain what was happening.
Problems Identified
Critical UX issues
Problem
Complex form layout
Poor Error Feedback
Cluttered Progress view
Description
All fields were shown at once with little guidance, making the form hard to understand.
Errors were unclera and too technical
The progress view was crowded and difficult to use.
Information Architecture
From user feedback, it was clear that the tool was too complex for many users. Because it lacked clear guidance, validation, and onboarding, users often made mistakes, had connection problems, and found the results hard to understand. This made the tool frustrating for non-technical users.
I created the user flow of the web application:
User flow of the web application
Exploring two design directions
​I created two design concepts and tested them with users. At first, users preferred the first design because all settings were visible on one screen and felt familiar, especially for experienced users. After further evaluation and discussions with developers and designers, we found usability and scalability issues with this approach. We decided to use the second design because it guides users step by step, reduces complexity, fits better with the system logic, and makes it easier to add new features in the future.
Initial Concept (All-in-One Layout)
Final Concept (Step-Based Layout)
