Building A Customer Churn Prediction App with Gradio.
1. Introduction
In this article, we will explore the process of building a customer churn prediction app with Gradio, a Python library that allows you to quickly create customizable UIs for your machine learning models. We will walk through the steps of collecting and preparing the input data and integrating an already built classification model into the Gradio interface. This project provides a practical example of how Gradio can be used to create user-friendly machine learning applications.
1.1 Overview of customer churn prediction
Customer churn prediction is the process of using machine learning algorithms to predict which customers are likely to churn. By analyzing customer behavior and demographic data, patterns and trends can be identified to predict churn. Predictive models can be trained on historical customer data to predict the likelihood of churn for new customers. Identifying customers who are at high risk of churning allows companies to take proactive measures to retain them, such as offering loyalty programs, discounts, or personalized recommendations.
- 2 Understanding Gradio
Gradio is a user-friendly web interface that simplifies the deployment of machine learning models. It enables data scientists to create intuitive and interactive user interfaces for their models without the need for advanced web development skills.
1.2.1 Overview of Gradio as an Ml App building tool.
Gradio is an open-source web framework that simplifies the process of building machine learning (ML) apps. It allows developers to quickly build interfaces for ML models without writing any front-end code. With Gradio, developers can create interfaces for text, image, and audio-based models. Gradio also supports many popular ML frameworks, including TensorFlow, PyTorch, and Scikit-learn. Gradio’s drag-and-drop interface makes it easy to create custom input fields and outputs, and its built-in support for hosting and sharing ML models simplifies the deployment process. Overall, Gradio is a powerful tool for building user-friendly ML apps, regardless of one’s level of experience in web development.
1.2.3 Gradio capabilities and features.
- Simple interface: Gradio provides a simple drag-and-drop interface for building user-friendly interfaces for ML models. This allows developers to quickly create custom input fields and outputs for text, image, and audio-based models without writing any frontend code.
- Support for popular ML frameworks: Gradio supports many popular ML frameworks, including TensorFlow, PyTorch, and Scikit-learn.
- Deployment and hosting: Gradio has built-in support for hosting and sharing ML models, making it easy to deploy and share these models without requiring any additional setup or configuration.
- Interactive input and output fields: Gradio allows developers to create interactive input and output fields for their ML models, including sliders, dropdown menus, and text boxes. This enables users to interact with the model and see its predictions in real-time.
- Customizable interface: Gradio’s interface is highly customizable, allowing developers to change the layout, color scheme, and styling of the app to match their branding or personal preferences.
1.2.3 Benefits of using Gradio for building ML apps
- Quick deployment: Gradio has built-in support for hosting and sharing ML models, making it easy to deploy and share these models without requiring any additional setup or configuration.
- Multi-model support: Gradio allows developers to create interfaces for multiple ML models in a single app, making it easy to compare and contrast different models.
- Time-saving: Gradio simplifies the process of building ML apps by eliminating the need to write any frontend code. This can save developers a significant amount of time and effort, allowing them to focus on building and refining their ML models.
2. Preparing the Model for Deployment.
2. 1 Overview of the existing churn prediction model
The existing prediction model, which will be embedded in this app, is a classification model that categorizes customers as “Yes” or “No”, where “Yes” indicates that the customer is likely to churn, and “No” means that they are not. The model utilizes 24 features to make its predictions.
2.2 Converting the churn prediction model, pipeline and other features to a format that can be deployed with Gradio
After training and fine-tuning the model, the best-performing model was selected. A higher weight was given to the model’s ability to accurately classify customers who are likely to churn rather than its precision. The model, pipeline, and other components were saved as pickle files and will be used later to construct the app.
# Save the model and the columntransformer
import pickle
filename = 'logistic_reg_class_model.pkl'
filename_2 = 'full_pipeline.pkl'
pickle.dump(logistic_bayes_search.best_estimator_, open(filename, 'wb'))
pickle.dump(full_pipeline, open(filename_2, 'wb'))2.3 Exporting model/app dependencies and requirements.
The classification model that was built used specific modules and frameworks. To embed the model into the app in a separate environment and ensure that the app runs correctly without any version conflicts between these modules and frameworks, the same versions of these modules and frameworks must be installed in the environment. The session_info library was utilized to obtain the names and exact versions of these frameworks and modules from our Jupyter notebook. To utilize the session_info library:
First install session_info.
pip install session_infoSecondly import and run the .show() method.
import session_info
session_info.show()The output of session_info.show() can be copied, edited, and saved as a requirements.txt file, which can be later installed in our environment to build the app.
3. Building the App
3.1 Setting up an Environment
Creating a Python environment is an essential step when building machine learning apps with Gradio. A Python environment is a self-contained space where you can install Python packages and dependencies without affecting the global Python installation on your system. This ensures that your app has access to the correct versions of the required libraries and dependencies.
The gradio_venv environment was created using the venv module in Python. First, navigate to your base folder, which will contain our app, in the terminal.
To create a python environment in Windows/MacOs/Linux:
python -m venv gradio_venvTo activate the environment on Windows
gradio_venv\Scripts\activateTo activate the environment on Linus or MacOs
source streamlit_venv/bin/activate3. 2 Installing dependencies and requirements
After setting up and activating the environment, the app’s requirements and dependencies are installed to ensure that the model has the same dependencies and requirements used during its training.
First install Gradio using pip.
pip install gradioSecondly install the requirement and dependencies saved in the requiremet.txt file.
pip install -r requirement.txt3. 3 Creating the App Interface
Gradio provides two methods for creating interfaces: Gradio’s default interface and Gradio’s blocks. In this case, Gradio’s blocks were used to gain more control over the app’s interface compared to the default interface, which has a predefined format. The app’s interface consists of three parts: inputs, outputs, and a button to run the prediction.
For the input fields, dropdown, radio buttons, and number fields were utilized. The dropdown widget was used for features such as Gender, Contract, and InternetService. Radio buttons were used for OnlineSecurity, OnlineBackup, DeviceProtection, TechSupport, StreamingTV, StreamingMovies, SeniorCitizen, Partner, Dependents, PaperlessBilling, PhoneService, and MultipleLines. The number widget was employed for MonthlyCharges, TotalCharges, Tenure, and PaymentMethod.
Input Fields
For the input fields, dropdown, radio buttons, and number fields were utilized.
Dropdown widget was used for features such as Gender, Contract, and InternetService.
Radio buttons were used for OnlineSecurity, OnlineBackup, DeviceProtection, TechSupport, StreamingTV, StreamingMovies, SeniorCitizen, Partner, Dependents, PaperlessBilling, PhoneService, and MultipleLines.
Number widget was employed for MonthlyCharges, TotalCharges, Tenure, and PaymentMethod.
Output fields
Sliders were used to display the prediction results.
Below is a code snippet of the app’s interface.
import gradio as gr
with gr.Blocks(theme=theme4) as demo:
gr.Markdown(
"""
# Welcome Cherished User 👋 !
## Customer Churn Classification App
Start predicting customer churn.
""", css= "h1 {color: red}")
with gr.Row():
gender = gr.Dropdown(label='Gender', choices=['Female', 'Male'])
Contract = gr.Dropdown(label='Contract', choices=['Month-to-month', 'One year', 'Two year'])
InternetService = gr.Dropdown(label='Internet Service', choices=['DSL', 'Fiber optic', 'No'])
with gr.Accordion('Yes or no'):
with gr.Row():
OnlineSecurity = gr.Radio(label="Online Security", choices=["Yes", "No", "No internet service"])
OnlineBackup = gr.Radio(label="Online Backup", choices=["Yes", "No", "No internet service"])
DeviceProtection = gr.Radio(label="Device Protection", choices=["Yes", "No", "No internet service"])
TechSupport = gr.Radio(label="Tech Support", choices=["Yes", "No", "No internet service"])
StreamingTV = gr.Radio(label="TV Streaming", choices=["Yes", "No", "No internet service"])
StreamingMovies = gr.Radio(label="Movie Streaming", choices=["Yes", "No", "No internet service"]) Below is a photo of the interface:
3.4 Embedding the model into the interface
3.4.1 Collecting and preparing inputs
The inputs provided by the user through the app were gathered and transformed into a dataframe, with the same structure as the data used for training the model, while ensuring consistent column names. Additionally, the data types of the input features were examined and adjusted to their respective appropriate data types.
3.4.2 Feature engineering
After the data was collected and prepared, new features were created using the same function as when the model was trained.
def create_new_columns(train_data):
train_data['Monthly Variations'] = (train_data.loc[:, 'TotalCharges']) -((train_data.loc[:, 'tenure'] * train_data.loc[:, 'MonthlyCharges']))
labels =['{0}-{1}'.format(i, i+2) for i in range(0, 73, 3)]
train_data['tenure_group'] = pd.cut(train_data['tenure'], bins=(range(0, 78, 3)), right=False, labels=labels)
train_data.drop(columns=['tenure'], inplace=True)3.4.3 Transforming data using pipelines
The pickled pipeline was loaded and utilized to transform the collected data into a format that can be understood by the model.
import pickle
import gradio as r
def load_pickle(filename):
with open(filename, 'rb') as file:
data = pickle.load(file)
return data
pipeline = load_pickle('full_pipeline.pkl')3.4.4 Making a prediction
The model component from the pickle file was loaded and integrated into the app. The .predict_proba method was then used on the model to generate the probabilities of a customer churning or not, instead of a straightforward yes or no prediction.
model = load_pickle('logistic_reg_class_model.pkl')The predict_churn function is triggered when the submit button is clicked. It takes in the values of the input fields as arguments, converts them into a list , then to a numpy array and uses the numpy array to create a pandas dataframe. The dataframe is then prepared using the same function used during training, and transformed using the pipeline loaded from the pickle file. Finally, the predict_proba method is called on the model to generate the probabilities of the customer churning. These probabilities are returned and displayed as a slider output in the app.
# function to make predictions
def predict_churn(gender, SeniorCitizen, Partner, Dependents, Tenure, PhoneService, MultipleLines, InternetService,
OnlineSecurity, OnlineBackup, DeviceProtection,TechSupport,StreamingTV, StreamingMovies,
Contract, PaperlessBilling, PaymentMethod, MonthlyCharges, TotalCharges):
# collects data into a list
data = [gender, SeniorCitizen, Partner, Dependents, Tenure, PhoneService, MultipleLines, InternetService,
OnlineSecurity, OnlineBackup, DeviceProtection,TechSupport,StreamingTV, StreamingMovies,
Contract, PaperlessBilling, PaymentMethod, MonthlyCharges, TotalCharges]
# convert data into a numpy array
x = np.array([data])
# creates a dataframe
dataframe = pd.DataFrame(x, columns=train_features)
dataframe = dataframe.astype({'MonthlyCharges': 'float', 'TotalCharges': 'float', 'tenure': 'float'})
# creates the new features
create_new_columns(dataframe)
# preprocess the data using pipeline
processed_data = pipeline.transform(dataframe)
processed_dataframe = create_processed_dataframe(processed_data, dataframe)
# the model make predictions
predictions = model.predict_proba(processed_dataframe)
return round(predictions[0][0], 3), round(predictions[0][1], 3)Calling the predict_churn function when the submit button is clicked.
submit_button.click(fn=predict_churn, inputs=[gender, SeniorCitizen, Partner, Dependents, Tenure, PhoneService, MultipleLines,
InternetService, OnlineSecurity, OnlineBackup, DeviceProtection,TechSupport,StreamingTV, StreamingMovies, Contract, PaperlessBilling, PaymentMethod, MonthlyCharges, TotalCharges], outputs=[output1, output2])4. Testing the app4. Testing the app
In order to ensure a smooth user experience and identify and resolve any potential bugs, it is crucial to continuously run and test the app. Regular testing can help to enhance the overall functionality of the app and improve its usability for end-users.
4.1 Running the App Locally
To run the Gradio app locally, the Gradio command followed by the name of your Python script that contains the app definition must be used. In this case my app was defined in a file called app.py.
To run the app locally, the following command was used:
gradio app.py4.2 Debugging and Troubleshooting the App
Technical Bugs
While developing the app, I encountered some technical issues and bugs, mostly related to the codes I used. Fortunately, most of them were rectified. I used print statements to output debugging information into the console.
Additionally, I set the debug parameter to True when creating the Interface object to enable Gradio debugging mode. This displays detailed error messages and stack traces in the web browser console, making it easier to identify and fix issues.
Non-Technical Bugs
After developing the app, I noticed some non-technical issues.
- The theme- The theme color of the app, which was too plain. This made some of the widgets less visible and easy to forget.
- No pre-defined values — The app lacks pre-defined values, causing it to produce an error when the submit button is clicked if some of the widgets or features are not selected or ticked.
Fixing Errors
- A darker theme was used to make the widget more visible.
theme = gr.themes.Default().set(body_background_fill="#0E1117",
background_fill_secondary="#FFFFFF",
background_fill_primary="#262730",
body_text_color="#FF4B4B",
checkbox_background_color='#FFFFFF',
button_secondary_background_fill="#FF4B4B")2. The code was made successfully captured an error that arose from the pipeline’s inability to process None values. To display a custom error message, the gradio.error method was utilized.
4. 3 Testing the App with several Data
During the development of the app, I performed several tests using different input values to ensure that the app was working as expected. Each time, the churning probabilities were calculated and displayed correctly. It is worth noting that these tests were conducted locally on my machine and the app was not deployed to a production environment.
Photos from the App
5. Conclusion and Further Resources
You can find the entire code for this Gradio app on my GitHub page. I am passionate about Data Analysis, Data Science and Machine Learning, and I am always eager to learn from others and share my knowledge. If you follow me on GitHub, you will gain access to more of my work and receive regular updates. I highly value feedback and contributions, so please do not hesitate to reach out to me with any questions or suggestions you may have.
Resources used include:
