top of page
Search
  • Writer's pictureKelly Adams
    • Jul 12
    • 2 min read

Heatmap Example for LinkedIn Post 7-12-24

Updated: Jul 18

In my LinkedIn post LinkedIn Post 7-12-24, I shared a heatmap example. Note this is not based on the heatmap I made for my company but a general one I created for teaching purposes.


Please note after more feedback this heatmap has been revised. For the reasoning/process check out my blog post here.


Here it is in more detail:


Why use a heatmap? 


  • I needed to group user data into bins while also showing distribution patterns.

  • The heatmap below is a fictional example. Here it’s used to how different types of users interact with various sections of their website. This insight can help edit the website design to improve user experience and increase engagement.

How does this help?


  • Optimized Navigation Paths: By understanding which sections are most visited by different user types, you could streamline navigation to make these sections more accessible.

  • Improved Content Placement: Identify where to place key content to catch the attention of specific user segments.

  • Enhanced Personalization: Tailor the website experience to different user types, making it more relevant and engaging for each segment.


Heatmap Setup


  • User Types: Segments such as New Visitors, Returning Visitors, Subscribers, and Premium Users.

  • Website Sections: Categories like Home Page, Products Page, Blog, Support, and Account Settings.


Note: For user types it assumes a user can only be in one segment.


Code

View on Github repo: example-heatmap.


import numpy as np
import pandas as pd
import seaborn as sns
import matplotlib.pyplot as plt

# Sample data setup
user_types = ['New Visitors', 'Returning Visitors', 'Subscribers', 'Premium Users']
website_sections = ['Home Page', 'Products Page', 'Blog', 'Support', 'Account Settings']

# Generate realistic data
data = [    [10, 20, 15, 5, 5],    # New Visitors    
[20, 30, 25, 15, 10],  # Returning Visitors    
[30, 40, 45, 25, 20],  # Subscribers    
[40, 50, 55, 35, 30]   # Premium Users]

# Create a DataFramedf = pd.DataFrame(data, index=user_types, columns=website_sections)

# Createthe heatmap
plt.figure(figsize=(10, 7))
sns.heatmap(df, annot=True, cmap='Purples', fmt='d', cbar=False) # Use only one color
plt.title('Website Interaction Heatmap by User Type')
plt.xlabel('Website Section')
plt.ylabel('User Type')
plt.xticks(rotation=45)
plt.yticks(rotation=0)
plt.show()


Chart


This is the result of the code.


Heatmap showing website interactions by user type. The rows represent different user types: New Visitors, Returning Visitors, Subscribers, and Premium Users. The columns represent different website sections: Home Page, Products Page, Blog, Support, and Account Settings. Color intensity ranges from light purple for lower interaction counts to dark purple for higher interaction counts. New Visitors have lower interaction counts, especially in Support and Account Settings. Premium Users have the highest interaction counts, particularly on the Products Page and Blog

For accessibility here's an image description of the heatmap above:


Heatmap showing website interactions by user type. The rows represent different user types: New Visitors, Returning Visitors, Subscribers, and Premium Users. The columns represent different website sections: Home Page, Products Page, Blog, Support, and Account Settings. Color intensity ranges from light purple for lower interaction counts to dark purple for higher interaction counts. New Visitors have lower interaction counts, especially in Support and Account Settings. Premium Users have the highest interaction counts, particularly on the Products Page and Blog

Comments

bottom of page