The Reef
Client
Gulp Data
Team
Sticky Ventures LLC
My Role
Jr. Product Designer
Project Type
Internal Portal
Project Timeline
5 Months
Release
2023
Background
the client
GulpData is a startup specializing in evaluating data assets and providing a lending service that enables businesses to borrow money by using their data as collateral.
The Needs
As a rapidly growing startup, GulpData faced an exponential increase in the number of clients and tasks to handle. Consequently, there was a pressing need for access to global information regarding the company's performance and the ability to swiftly retrieve data and information about clients in order to assist them to the best of their abilities. Prior to this development, all operations were managed manually.
Project Overview
This project serves a dual purpose, providing valuable functionalities for both company performance evaluation and customer management. Users can access detailed information related to the startup's operations through the internal portal. Additionally, the portal includes a dedicated "activities and notes" section, which facilitates team communication and keeps everyone informed about the latest events and updates.
Understanding
User Research
As the initial step in the process, we conducted user research, which involved interviewing members of the company team since the app was intended for internal use within the organization. The method used for this first user research was to send a questionnaire to all the employees of this startup who would use the product.
As a result we were able to understand the main needs of the users:
As a result we were able to understand the main needs of the users:
- A dashboard designed to provide a comprehensive overview of the company's performance. Additionally, they needed the capability to filter the displayed information by selecting specific dates.
- The capability to search for clients and access detailed information about them, including their activity across various applications within GulpData.
- The capacity to review recent activities of their clients' companies and post comments about them for other team members.
Information architecture
(Click to enlarge it)
In the upcoming sections, I will outline the primary components of this project, which are comprised of three pages: Dashboard, Reef, and Activity & Notes.
Dashboard
During the design process, we proposed an addition upon noticing ample available space for it. Below, I will explain the original part followed by the additional section.
First Version
As a result of the UX research findings, we were required to design a dashboard divided into two sections: Directly below, there is a section titled "Overall," which encompasses additional specific key performance indicators (KPIs) and also offers the functionality to filter these by specified periods of time.
- The top section, labeled "All Time", displays information from the entire duration of the company's operation.
- The bottom section, labeled "Overall" encompasses additional specific key performance indicators (KPIs) and also offers functionality to filter them by specified periods of time.
(Click the image to enlarge it and view the second part)
Additional Section
After designing the section for the KPIs, we observed that there was considerable available space. Consequently, we proposed the addition of a side panel to showcase recent activities of the company's customers. We created an initial version of the side panel for feedback, which helped enhance and finalize it with necessary filters and functions:
- We chose to include two tabs in the side panel: one for 'Activity' and another for 'Notes'
- We incorporated a search bar and a filter button to facilitate searching for clients based on predefined categories
- We added a button for writing a quick note instead of requiring the user to navigate to the Activity & Notes page
(Click the image to enlarge it)
Final Version
(Click the image to enlarge it)
Reef
"Reef" is the designated name for the page dedicated to browsing Gulp Data clients. As this forms the core of the project, the name "Reef" also serves as the overarching title for the entire project.
Designing this page was relatively straightforward as it primarily functions as a browser. We aimed to keep it simple, considering that not all users are IT experts.
On the left, we chose to display a list of all clients with the filters always visible. When a client company is clicked, the right side displays all the relevant information about it.
Designing this page was relatively straightforward as it primarily functions as a browser. We aimed to keep it simple, considering that not all users are IT experts.
On the left, we chose to display a list of all clients with the filters always visible. When a client company is clicked, the right side displays all the relevant information about it.
(Click the image to enlarge it)
activity & notes
As the name suggests, this page is dedicated to showcasing activity and notes. The 'Activity' section consists of updates regarding GulpData clients, while the 'Notes' section is reserved for comments left by GulpData users.
The layout comprises a card on the left with two tabs—one for Activity and one for Notes. On the right, there is a Filters panel that remains visible at all times.
The Activity tab serves as a read-only display of all activities related to GulpData clients. In the Notes tab, the primary call to action is to 'Take Note.' Additionally, we have included the ability to reply to other users' notes, making it more akin to a main notes section with corresponding comments below.s to "Take Note" and then we also added the ability to reply to other users notes so it would be more like a main notes and below the relatives comments.
The layout comprises a card on the left with two tabs—one for Activity and one for Notes. On the right, there is a Filters panel that remains visible at all times.
The Activity tab serves as a read-only display of all activities related to GulpData clients. In the Notes tab, the primary call to action is to 'Take Note.' Additionally, we have included the ability to reply to other users' notes, making it more akin to a main notes section with corresponding comments below.s to "Take Note" and then we also added the ability to reply to other users notes so it would be more like a main notes and below the relatives comments.
(Click the image to enlarge it and view the second part)
final consideration
The project has not been fully developed yet; in accordance with the startup's requirements, they opted to concentrate solely on Reef's development.
Our clients express high satisfaction with its user-friendliness and, notably, its practicality, as they incorporate it into their daily routines.
Throughout the project, I acquired the skill of tempering my artistic style and focusing on the client's needs, which, in this instance, demanded a straightforward layout. This marked my inaugural experience in engaging with diverse professional roles. Alongside designers and developers, I had to collaborate with individuals possessing entirely different backgrounds in computer science. This exposure enabled me to explore and learn, particularly during the initial research phase for the application's development. I endeavored to align everyone on the crucial functions to prioritize in this MVP.
Our clients express high satisfaction with its user-friendliness and, notably, its practicality, as they incorporate it into their daily routines.
Throughout the project, I acquired the skill of tempering my artistic style and focusing on the client's needs, which, in this instance, demanded a straightforward layout. This marked my inaugural experience in engaging with diverse professional roles. Alongside designers and developers, I had to collaborate with individuals possessing entirely different backgrounds in computer science. This exposure enabled me to explore and learn, particularly during the initial research phase for the application's development. I endeavored to align everyone on the crucial functions to prioritize in this MVP.