Work / Chargebacks911 / Email Signature Generator

Email Signature Generator

An interface to create dynamic, conditional email signatures
Overview 📋

In my refactor of the company's email signature, we also needed to have working, custom signatures for the sales team. I quickly realized how timely and repetitive of a process it was to code custom signatures for sales team members manually.

Each sales team member required various, conditional values in their signature:

  • The team member's profile picture
  • The team member's home office
  • The team member's mobile phone
  • The team member's meeting link
  • The team member's extension line

In a bit of my free time, I decided to create a small a Vue JS app that would help members of the sales team create their own Hubspot email signature.


Could we give team members access to create their own email signatures but also remain consistent with the brand?

Version 1

Chargebacks911 Email Signature Generator

Version 2 🎉

After seeing the increase in efficiency and consistency in creating new email signatures for onboarded team members, it was time to tackle the other formats for which their email signatures may be used.

We needed to outline a few goals for a version 2 of the signature generator:

  • Add optional fields (e.g. Skype, Mobile, etc.) thay be be customized and toggled
  • Build and test signature for Chrome, Outllok, and the plethora of email clients
  • Build a more fluid, simple UI that provides better clarity in generating a signature

Since this was a simple front-end application, I thought using Vue, jQuery, and any other heavy, third-party JS libraries may be unnecessary for such a simple project. Therefore, I opted to use simple, modern JavaScript to build out the interactivity of the signature generator

Version 2

Chargebacks911 Email Signature Generator

Change Themes

Dark Mode Toggle

Export ✈️

To help accomadate for the array of email clients in use by our team members, we needed a way to help explain and export their new signature for each of the popular email platforms.

While we provided the export for each client, we also wanted to link the import tutorials provided by the help centers from each of the email cleints.

Allow users to export for multiple clients

Email Signature Export