MailSafe

Inspiration

as we have spent some time in our new Covid-19 world, we have noticed work from home and such has resulted in an increase of phishing and fraudulent emails. We noticed this is strongly apparent in our educational community as well noticing that our inboxes and our peers' inboxes get spammed with fraudulent E-mails that pose a risk and threat to our finances.

What it does

MailSafe allows you to verify the integrity and legitimacy of your emails by generating a QR Code in a Google Chrome Extension pop-up for your phone to scan. The QR Code is scanned by the phone in the MailSafe Mobile App that cross references the QR Code to a list of verified email senders. If present on the list, it means the email is verified and the user can trust the email they received. If it is not on the list, the email is most likely fraudulent as it does not belong to any of your financial service providers.

How we built it

We had used standard Google Chrome Extension structure. We constructed a main manifest file for the Chrome Extension to function and call a popup.html file upon an Chrome Extension Action that showed a button. Clicking that button generated a QR Code from a standard qrcode.js library that your phone could actually scan. Then we created the way the app would function on your mobile device using Figma.

Challenges we ran into

The main challenge we ran into was in the Google Chrome Extension. We had to use the email sender ID to generate a QR Code. After some trial and error, and countless stackoverflow guides, we came to a library, qrcode.js, that allowed us to pass the email sender ID and generate a QR Code from it. That QR Code is functional and usable by most devices.

Accomplishments that we're proud of

We are proud of the functional Google Chrome Extension that generates actual QR Codes for devices to scan. All in all, we are proud to have come up with an idea to protect users from fraudulent E-mails and phishing scams and proud that we have implemented a major element of the system. Now that we have that foundation, we are on our way to complete the mobile application element to have a functional system.

What we learned

The project was a great learning experience for us at MailSafe. Spending most of our time implementing the Google Chrome Extension we learned to manipulate an existing HTML file, parse it and extract information we specifically needed such as the email sender ID. Using that we learned how to convert it into a QR Code that actually is recognized by anyone's cellular device. All in all, it was an amazing opportunity and learning experience.

What's next for MailSafe

Our goals for MailSafe is to implement a functional phone application. Furthermore, we would like to implement the the extension add-on for non-chromium based browsers such as Mozilla Firefox. In the future, we are looking forward to wide-spread adoption by many companies, not just Bank Institutions, who would like to provide their users with a seamless and safe experience in communicating over E-mail.

Built With

• figma
• google
• html
• javascript
• json
• vscode