Project Background:
A mortgage provider with a robust financial presence across multiple industries and regions initially briefed Coforge on an obstacle in their note-taking system.
Specifically, the client was looking for two solutions:
- A note-taking system to log information/communications with borrowers seeking a mortgage.
- A matching UI for the standard activity timeline in their Salesforce instance.
The Challenge:
What stood in Coforge's way was a series of technical and design problems that each required solutions. Each solution had to be pieced together to meet the client's objectives. Some of the more salient issues Coforge solved were:
- The client's data was API dependent and spread out across multiple databases.
- They still needed to figure out a way to amalgamate their data inside of their Salesforce and have it logged in the standard activity timeline.
- We needed to find a way to capture their dossiers while providing a simpler view of their complex interactions with entire swathes of people without risking the previous databases in use.
- Delivering a straightforward, easy-to-use UI that the client could introduce quickly, without any major headaches. All so the solutions would actually be used and not ignored.
The Coforge Solution:
After in-depth analysis and several design iterations, it became clear to Coforge that we needed to use Salesforce's Lightning Design System and Lightning Web Components. to inspire and implement a custom solution. What coforge delivered was a custom activity timeline that:
- Mimics the standard activity timelines core functionalities via Salesforce's Lightning Design Systems cloning ability.
- Can log all of their data in the one place.
On top of this, because we took the custom approach, the project was able to deliver more value from a UI perspective as well. This was due to the increased flexibility on top of Salesforce's vast array of tools at our disposal.
The primary focus behind each decision taken with the UI was to ensure that each individual function was built with robust logic that was easily understood, learned, and actively used.
Examples of this were:
The clear and thoughtful "load more" and "load less" functions in the descriptions with an initial view limited to 190 characters to allow for enough information without flooding the user with info and the option to find out more.
The introduction of client-customized design, like on-brand icons. Helping to make everything more easily recognizable, reducing mental load, and improving productivity.
Another example was the filter functionality (shown below). We could not set activity types in columns; we had to assign all values vertically instead. The second challenge came when hitting the 'Apply' button. The selected filter needed to be displayed, but it was a complex job requiring lots of JavaScript.
Technologies Involved:
Salesforce Lightning Design System:
The Salesforce Lightning Design System includes the resources to create user interfaces consistent with the Salesforce Lightning principles, design language, and best practices. Rather than focusing on pixels, developers can focus on application logic, while designers can focus on user experience, interactions, and flows.
Salesforce Lightning Web Components:
Lightning web components are custom HTML elements built using HTML and modern JavaScript. Lightning web components and Aura components can coexist and interoperate on a page. To admins and end users, they both appear as Lightning components.
Activity Timelines:
Salesforce builds tools designed to give us a 360-degree view of customers. Activities are critical to this; they consist of Tasks, Events & Calendars that show entries such as follow-ups, emails, and meetings. It provides a simpler view of otherwise-complex interactions with entire swaths of people. Because our task was based on the capture of dossiers, we chose to mold everything as custom.
The Activity Timeline displays activities associated with the name field (such as mortgage user or agent) and the Related To field (such as account).
References:
Related reads.
About Coforge.
We are a global digital services and solutions provider, who leverage emerging technologies and deep domain expertise to deliver real-world business impact for our clients. A focus on very select industries, a detailed understanding of the underlying processes of those industries, and partnerships with leading platforms provide us with a distinct perspective. We lead with our product engineering approach and leverage Cloud, Data, Integration, and Automation technologies to transform client businesses into intelligent, high-growth enterprises. Our proprietary platforms power critical business processes across our core verticals. We are located in 23 countries with 30 delivery centers across nine countries.