Enable dark mode

Digital Business Card Generator

Posted by Vishnu Raghav B • 03 August, 2020 • 4 min read
cover image for Digital Business Card Generator

Introduction

Business cards are the primary way that business people present their contact information to potential customers or clients. Even in this digital age, business cards are thriving and is almost a ritual in several countries. In spite of it, digital business cards have made their way as an attractive choice for business people as it can consolidate more amount of information in a single view. In simple terms, they are actually mini-websites.

Nowadays you can find hundreds of online services that provide digital business cards which basically hosts your business cards for a monthly or annual fee. Sounds similar to web hosting right? Exactly. Next comes data privacy, why risk trusting a third party. There are chances that they can sell your or your employee’s data for their profit.

To address these issues, I have built a free and open-source project called Digital Business Card Generator, which is an easy to use web app that lets anyone to quickly generate an interactive and responsive HTML-based digital business card that can be hosted with their website. I did this project totally out of public interest.

The idea

Why pay third-party services to host your digital business cards when you have already paid for your website hosting plan? You can utilize your own storage space to host your business cards and most importantly, you will be the owner of your data.

Principles

Design

This web app is designed to be simple and consistent so that it delivers a straightforward user experience which will eventually get your job done in minutes.

Privacy

This web app is built upon the concept of Privacy by Design. When you use this web app, your data are never actually stored online or sent anywhere, everything stays in your device. You own your data, it is as simple as that.

Why use Digital Business Card Generator?

For businesses

  • It minimizes the cost to pay a third-party to host your digital business cards
  • Quick and easy setup
  • Simple, clutter-free design
  • Rich user experience
  • Complete data control

For developers

  • You can now attract your clients by utilising this free service to offer digital business cards along with a web design project

Features

  • Generate unlimited number of interactive and responsive HTML based business cards
  • Clean and simple design with concise action buttons
  • Enables people to contact you via Phone, WhatsApp, Email, etc in a single click
  • Direct vCard download allows users to quickly add you in their contact list
  • Display your social media presence with social links
  • Feature your product images, artworks, music releases, video showreels and brochures
  • Share your card to anyone with either a link or QR-code
  • Option to share your PGP public key to facilitate secure communication
  • Simple copy and paste is all you need to make your business cards go online.

Technologies in use

This web app is built using Vue.js ( actually Nuxt.js ) which is an open source JavaScript framework. For the styling part, for the first time I’ve used Tailwind CSS which is a utility-first CSS framework. I’ve to say this, I’m totally impressed with the workflow. To make the webapp work offline and installable on a device, I’ve used the popular PWA technology.

External resources

Icons

Most of the icons used on this project are from Feathericons and Boxicons, both of them provide beautiful open source icons. A few of them has been designed by myself, including the logo.

Scripts

Special thanks to the creators of qrcode-svg, ID3 Parser, PDF.js, JSZip, FileSaver.js, vue-colorpicker.

The Future

This web app will not stop here. I will make sure it stays alive and fresh. To do so, all I need is your feedback. Just make use of this web app, for yourself or a business, recommend it to others and spread the word.

If you use this service in your work quite often or making some profit out of it, please consider making a donation. Visit Digital Business Card Generator and keep supporting. Thanks!

The source code is available for public review.

Having a project in mind?

Lets get it started