How to Build a Custom UI in ServiceNow to Display Lead and Quote Details

[RohitPapann]

Hi ServiceNow Community,

I'm currently working on a custom application in ServiceNow where I have created two custom tables:

• Lead Table – This stores the lead details like name, email, phone, status, etc.

• Quote Table – This stores quotes/orders made by the lead (each quote is related to a specific lead).

What I want to achieve is:
To create a custom UI page (or widget) in the Service Portal that displays:

• All the Lead details (from the Lead table)

• All the related Quote records (from the Quote table) that belong to that Lead

This UI should be user-friendly and follow our own layout/design and should not rely only on the default form or list views.

---

 What I’ve done so far:

• Created custom tables for Lead and Quote (u_lead, u_quote)

• Quote table has a reference field to Lead

• Able to display single lead info using sys_id from URL

• Exploring how to query and show related quote data

• Trying to use Service Portal Widget with client and server scripts

---

What I need help with:

1. What is the best approach to build this kind of custom UI?

2. Should I use a custom widget, UI Builder, or something else?

3. How do I show related Quote records for a selected Lead?

4. Any sample code, docs, or examples to refer to?

---

Any Udemy or other learning resource suggestions to understand how to build real-time CRM-like interfaces using ServiceNow CSM or Custom Apps are also welcome.

Thanks in advance!
Looking forward to your suggestions and guidance.

Best regards,
Rohit