LC Phone Micro Frontend

The LC Phone System is a groundbreaking self-contained web application built on micro frontend architecture, designed to seamlessly manage telephony functionalities within the HighLevel platform.

Screenshot

Technology Stack

Firebase
Firebase
GitHub
GitHub
Google cloud
Google cloud
Jenkins CI/CD
Jenkins CI/CD
Jest
Jest
Kubernetes
Kubernetes
Mongo DB
Mongo DB
Nest.js
Nest.js
Pinia
Pinia
Postman
Postman
Tailwind CSS
Tailwind CSS
Typescript
Typescript
Vue3
Vue3
Webpack
Webpack

Project Overview

As a senior frontend engineer, I recently had the opportunity to work on an exciting project that has significantly improved the way businesses manage their telephony needs within the HighLevel platform. The LC Phone System is a cutting-edge web application built on a micro frontend architecture, designed to simplify and streamline telephony management for agencies and businesses of all sizes.

This self-contained system is a game-changer in the world of sales & marketing platforms. It allows users to purchase and manage phone numbers, set up verified caller IDs, and implement sophisticated call tracking through number pools. By incorporating advanced features such as regulatory compliance handling and Stripe-powered payments, the LC Phone System transforms complex telephony tasks into user-friendly processes.

Objectives

The primary goals of the LC Phone System project were:

  1. To eliminate the need for agencies to sign up for external telephony services like Twilio and manually integrate them into the CRM.
  2. To provide a seamless, out-of-the-box solution for sending and receiving SMS and calls within the HighLevel platform.
  3. To offer a more affordable telephony service without compromising on quality, deliverability, or compliance.
  4. To simplify complex telephony management tasks, making them accessible to users with varying levels of technical expertise.
  5. To enhance the overall user experience by integrating advanced features like number purchasing, caller ID verification, and call tracking directly into the CRM.

Domain and Industry Context

To fully appreciate the significance of the LC Phone System, it’s crucial to understand the landscape of cloud communications and CRM integration. Traditionally, agencies looking to incorporate advanced telephony features into their businesses would turn to services like Twilio. While powerful, these solutions often require significant technical knowledge to implement and manage effectively.

Twilio specializes in providing APIs for various communication channels, including SMS, voice, video, and email. However, integrating these services into a sales & marketing platform can be challenging, especially for smaller agencies or those without dedicated technical teams. This integration process often involves complex network management and routing configurations, creating a significant barrier to entry for many businesses.

The LC Phone System addresses these challenges by offering a fully integrated telephony solution within its platforms. By developing this system, we’ve eliminated the need for separate sign-ups, complex integrations, and the technical overhead associated with managing external telephony services. This approach aligns with the expectations of modern SaaS users, who prefer solutions that work seamlessly out of the box.

Features

The LC Phone System boasts several key features that set it apart from traditional telephony solutions. Let’s explore each of these in detail:

Manage Phone Numbers

At the core of the LC Phone System is the ability to efficiently manage phone numbers. Users can easily purchase, configure, and maintain their phone numbers directly within the HighLevel platform.

This feature streamlines the process of setting up communication channels, allowing businesses to quickly establish their presence across various markets. The system supports local, mobile, and toll-free numbers for selected countries, providing flexibility to meet diverse business needs.

Screenshot
Screenshot
Screenshot

Buy Number Flow (Powered by Stripe)

The number purchasing process in the LC Phone System is designed with user convenience in mind. Integrated with Stripe, a leading payment service provider, the system ensures secure and seamless transactions. Users can browse available numbers, select their preferred options, and complete the purchase without ever leaving the HighLevel platform.

For countries with specific regulatory requirements, the system guides users through submitting necessary address and compliance documentation, making the process as smooth as possible.

Screenshot
Screenshot
Screenshot

Managing Verified Caller IDs

The Verified Caller ID feature enhances the credibility and recognition of outgoing calls made through the HighLevel service. This feature allows clients to use their own phone numbers as the Caller ID, ensuring that recipients see a familiar number on their display. By increasing trust and familiarity, this feature can significantly improve answer rates and overall communication effectiveness.

The system provides an intuitive interface for setting up and managing these verified caller IDs, making it easy for businesses to maintain a consistent and professional communication presence.

Screenshot
Screenshot
Screenshot
Screenshot
Screenshot

Add Number Pool Flow

Number pools are a powerful tool for tracking calls generated by paid campaigns, and the LC Phone System makes implementing this feature straightforward. By assigning specific phone numbers to leads on designated landing pages or websites, businesses can accurately attribute call-tracking conversations to their source.

This feature, often referred to as “call tracking codes” in other systems, provides valuable insights into the effectiveness of marketing campaigns and helps optimize resource allocation. The LC Phone System’s user-friendly interface simplifies the process of setting up and managing these number pools, making advanced call tracking accessible to businesses of all sizes.

Screenshot
Screenshot
Screenshot
Screenshot
Screenshot
Screenshot

Outcome

The LC Phone System has been successfully implemented and integrated into the HighLevel platform, revolutionizing how businesses manage their telephony needs. The project has significantly reduced the technical barriers associated with setting up and managing communication channels, allowing agencies to focus more on their core business activities.

One of the main challenges we faced was ensuring seamless integration with various regulatory compliance requirements across different countries. We overcame this by implementing a flexible compliance module that adapts to specific regional needs, guiding users through the necessary steps for each jurisdiction.

A key lesson learned during this project was the importance of user-centered design in simplifying complex technical processes. By focusing on creating intuitive interfaces and clear user flows, we were able to make advanced telephony features accessible to a broad range of users, regardless of their technical expertise.

Looking ahead, we see potential for further enhancing the LC Phone System. Future improvements could include AI-powered call analytics, advanced number porting capabilities, and integration with additional communication channels such as video conferencing.

Conclusion

Working on the LC Phone System has been an incredibly rewarding experience that has significantly contributed to my growth as a developer. This project challenged me to think beyond just writing code, pushing me to consider the broader implications of our technical decisions on user experience and business operations.

By creating a system that simplifies complex telephony management tasks, we’ve not only improved the HighLevel platform but also empowered businesses to communicate more effectively with their customers. This project reinforced the importance of understanding domain-specific challenges and the value of creating intuitive solutions that bridge the gap between advanced technology and everyday users.

As I reflect on this project, I’m excited about the positive impact it will have on businesses using the HighLevel platform. The LC Phone System stands as a testament to the power of thoughtful design and innovative engineering in solving real-world problems.

abhinay

© 2024 Abhinay Thakur. All rights are reserved.