Salesforce Integration 

RelPro-deduping
Overview

RelPro needed a feature that lets users update a lead or a contact in Salesforce by merging with RelPro data and updating into a single cohesive record.  The new feature informed users if the individual or company profile page they are viewing already exists as a lead or contact in Salesforce, thus keeping the CRM clean of duplicates. 

Overview
RelPro needed a feature that lets users update a lead or a contact in Salesforce by merging with RelPro data and updating into a single cohesive record.  The new feature informed users if the individual or company profile page they are viewing already exists as a lead or contact in Salesforce, thus keeping the CRM clean of duplicates. 

Project Scope

The Salesforce project were broke down to two parts; a deduping process for a individual and a deduping process for a company. I tackled main deduping process for a company and expand to individuals, so that both process can have consistent navigation and UIs. 

The Flow: Matching a company

In order to design screens, it was essential to understand every possible scenario and provide appropriate processes for users. I discussed with the tech team to figure out navigation and consulted with stakeholders to gather business requirements.

Salesforce Integration image 1

The First Draft

I communicated my designs through low-fidelity wireframes and screen flow while gathering feedback and business requirements. The deduping screen went through a lot of iterations and discussions with stakeholders. During the first ideation, I focused on making the process simpler and digestible for users by eliminating the data that exists in RelPro platform. My assumptions were users wouldn't spend much time reading through each data on both RelPro and Salesforce to compare and they would normally trust RelPro's data. I simplified the table, so that users simply review their data in Salesforce, see what's matched & unmatched and decide whether they need to overwrite the data or not. 

 

The First Draft

I communicated my designs through low-fidelity wireframes while gathering business requirements. The deduping screen went through a lot of iterations and discussions with stakeholders. During the first ideation, I focused on making the process simpler and digestible for users by eliminating the data that exists in RelPro platform, so that users simply review their data in Salesforce, see what's matched & unmatched and decide whether they need to overwrite the data or not. 

Salesforce Integration-revised-3.8.2018 (1)
First ideation-deduping

Business Needs

During ideation, I conducted stakeholders' interview to listen to their feedback.  I received comments that the deduping screen needs to display RelPro's data next to the Salesforce data in order to emphasize the richness of RelPro's data.  Also, I was informed to follow an existing UI element and labeling methodology as seen below.

 

The Business Needs

After sharing the first draft, I conducted stakeholders' interview to listen to their feedback.  I received comments that the deduping screen needs to display RelPro's data next to the Salesforce data in order to emphasize the richness of RelPro's data.  Also, I was informed to follow an existing UI element and labeling methodology as follows.  

Second ideation-deduping

Test with Users

I needed to find out how users would perceive the existing UI element and the table. I reached out three users and asked for feedback from the customer success team. I found that the drop down is hardly used and the labels are confusing. 

Test

I needed to find out how users would perceive the UI element and the data table. I reached out three users and asked for feedback from the customer success team and found that the drop down is hardly used and the labels are confusing. 

drop down for deduping process

Iterations

I went through multiple interations based on the feedback from users and the customer success team. 

Iterations

The deduping screens evolved through a multiple tests and stakeholder interviews.  

Iteration

While refining the designs for the deduping process for companies, I expanded to the deduping process for individuals. In order to make decisions on design details, I conducted guerrilla tests. I quickly created clickable prototypes for a short task to figure out which UI element helps people to better understand the process. Each test helped me to eliminate unncessary UI elements and make the interface more intuitive. 

While refining the designs, I also did quick guerrilla tests to make decisions for some design details. I quickly created clickable prototypes for a short task to figure out which UI element helps people to better understand the process. Each test helped me to eliminate unncessary UI elements and make the interface more intuitive. . 

test process

Finalize and Deliver

The deduping process for individual profiles required more steps, so I organized all the screens by scenario and added annotations to help developers. The deliverables were created in Google Slides, so that developers can leave comments and update the changes real-time. 

https://files.acrobat.com/a/preview/4ce043cf-2bc9-42f2-837a-fa0a36f39caa

Deliver

In order to help developers understand the flow, I organized all the screens by scenario and added annotations. The deliverables were created in Google Slides, so that developers can leave comments and update the changes real-time. 

https://files.acrobat.com/a/preview/4ce043cf-2bc9-42f2-837a-fa0a36f39caa

Task Flow

Task Flow

Flow Chart

Annotations

Annotations

Final Screens (Individual Profile)

deduping-revised

I’m a lifelong learner who always tries to be a better designer than yesterday. If you need a collaborator on your project or just want to discuss UX/UI with me, feel free to contact me. 

email icon 60 x 60
linkedin icon white 60×60