Developing a Mobile App for Generating Digital QR Code for Business Card using Open Source

Share

Digitalization is impacting businesses across industries with key business processes and functions getting automated for improved performance and enhanced customer experience. The rise of digital solutions to process business card information is one such example. A business card has the professional information about a company or an individual. It is an easy way to procure your contact information, but it’s also fairly easy to get them displaced while sharing and managing physical printed paper business cards. Again, there is a challenge in manually updating the phone and e-mail contacts with the new business card details.

In order to prevent this, mobile based QR code business cards are developed which help us to add contact information to the mobile devices without the hassle of manually typing it. All you need to do is scan the QR code from the person’s mobile or by using a QR code link, shared via WhatsApp or SMS, and save to your phone contacts. Also, in the current COVID-19 situation as a precautionary measure, you can use QR code business cards for touchless handover of physical cards.

The cameras in the latest smartphones are well-equipped with a built-in QR reader. The native camera in iPhone running on iOS 11 and in Android phones equipped with Google Lens, includes functionality that allows you to scan QR codes and access content like URLs without having to download third-party apps.

Advantages of QR Code Business Cards

  • QR code business cards eliminate the possibilities of human error. The occurrence of errors for manually entered data is significantly higher.
  • A QR code scan is fast and reliable, and takes infinitely less time than entering data manually.
  • From saving a contact by scanning a QR code, you can save a lot of details including profile image, e-mail ID, designation etc. just by the click of a button.
  • QR code business cards help you in touchless handover of contact details from anywhere anytime.
  • You have the convenience of sending business contacts via SMS or WhatsApp or scanning QR code, and instantly saving to the device phonebook.

How to Develop a Mobile Application to Generate QR Code

In one of our recent projects, there was a requirement for the users to be able to create their own QR code from the mobile application and sharing it digitally. The QR code created should be downloadable as an image file so that users can keep it in their personal device for future use. Here’s how we went about the solution:

There are multiple sources from which professional contact details can be sourced for QR code like listed below:

  1. If the QR code is generated based on a company and if the company stores the employee details in a directory service, like Microsoft Active Directory (AD), then the details for creating the QR code can be fetched from the AD.
  2. The users can create their own QR code by manually entering all the details and submitting it.
  3. The user details can be saved in a database server in the user management system and then can be fetched from the database for creating the QR code, as well as for creating the vCard to save in the mobile devices.

Generating Custom QR Code using Open Source Libraries

The custom QR code is generated using a JavaScript plugin ‘easyqrcodejs’. EasyQRCodeJS is a feature-rich cross-browser JavaScript QR code generation library. In a developed project, the user details are obtained from an active directory (AD) API, as shown in the Fig (a) below. The user details are also obtained from the details that are provided by the user while generating the QR code as shown in Fig (b). From the obtained user details, the unique user ID is fetched and is encoded in the QR code. Along with this, the QR code has the URL of the web application embedded in it.

Fig (a): QR Code Business Card Generation Process Flow

Fig (b): QR Code Generator Screen by Manually Entering the Details

When the QR code is scanned, it will provide the redirection link to the web application. The redirection link is created with respect to the User ID of the logged in user and the User ID will be in an encoded format in the URL. When the user clicks on the URL, it navigates to the web application that displays all the contact details in the scanned QR code. On loading of the web application, the data is decrypted from the URL param and the AD API is invoked to fetch the corresponding Contact details from the AD. If the QR code is generated by manually entering the details, then it will be saved in a server. In this case, the contact details are fetched from the corresponding server. Along with this the image, API is invoked to get the user image and the values are bound to the business card/vCard. With the help of the business card node_modules, the contact is saved to the phone on clicking the save contact button.

Fig (c): QR Code Scanning Process Flow

Along with the save to contacts feature, the web application can also provide the sharing options like email, WhatsApp, SMS etc. Hence, the user can send an email or text to the person just by clicking a button as shown below. The redirection to these sharing features is done using the URL schema.

Fig. (d): vCard with Save Contact and Sharing Options

Conclusion

In this digital world, the QR code business cards are eradicating the need to carry and exchange cards for sharing the contact details. This also helps you to save the contact details in the most efficient way without the hassle of manually typing it. All you have to do is to scan the QR code with the smartphone’s camera and save it to the contact list. With the development of the QR code business cards, interaction with people through email, WhatsApp, text messages etc. is possible just by the click of a button and facilitates zero touch digital sharing of business cards.

 By,
Amrutha KB
Software Engineer, RapidValue 

Want to know more about this solution? Contact us here >>

LEAVE A COMMENT

How can we help you?