Inspiration
On a day-to-day basis, we use a lot of social media services. There is no standard method to verify and validate all of your social media accounts and services. Important documents like passports, citizenship documents(aadhar cards, pan cards, birth certificates), and important educational certifications are essentially the verified identity of a person. While storing these documents digitally we generally store them on cloud services or google drives, etc.
But all these services store our data on centralized systems. These systems are often prone to data breaches and our data is at risk. Also, the service owners have the power to extract important confidential information and use it to their will. Hence it has become necessary to make use of decentralized systems where data is more secure and everyone is the owner of their data.
What it does
DigitZen is a decentralized document management system. Using digitzen, a user can store his/her important documents on a blockchain in the form of NFTs. For uploading the documents, the user 1st has to signup/log in using google, Facebook or metamask. In the case of metamask, the wallet address remains the same. But in the case of google or Facebook, a new smart wallet address is generated and that address is used for minting NFTs. When the user fills out the form for uploading documents and clicks on submit, the NFT object is returned along with the transaction hash and contract address indicating that documents are uploaded on the chain. This address can be verified on etherscan. Thus, the documents of the user are managed using Digitzen.
How we built it
It was a pretty challenging task to build digitzen . We used React to build the front end of digizen. We also used Tailwind CSS to build footer, navbar, and landing page
User onboarding is a difficult task in web3 Dapps since it is not necessary for all the users to have a metamask or any other wallet address. To solve this problem we made use of Biconomy. Biconomy allows users to log in through google or facebook and generates a unique smart wallet address.
The whole idea of the project is a mint document as NFT. We used NFTPort to mint documents as NFT. Each document minted by the user is mapped with the wallet address. Dynamically mapping of NFT documents with wallet addresses was also done with NFTPort.
Challenges we ran into
The first and foremost challenge we ran into was user onboarding and authentication. User onboarding is a difficult task in web3 Dapps since it is not necessary for all the users to have a metamask or any other wallet address. Adding to this we had problems in managing the state of smart wallet address . There were instances where the user was logged in but still the smart wallet address was undefined. Mapping a minted document to the exact wallet address was a challenging task . This was the first time we tried to do such a complex task .
Accomplishments that we're proud of
While developing a web3 application, onboarding users is a slightly different process than normal web2 applications. Users need a metamask wallet ID to interact with a web3 application. For that, first a user needs to install metamask extension on the web browser, set up network ID, chain ID, get ETH, etc. This process can be a bit complex for new users who have less idea about web3. Hence we used the Biconomy service for onboarding the users to our application. It allows users to sign in using their google and facebook accounts. For each account, a new smart wallet address is generated and a new user profile is created. The new smart wallet address is mapped to the google/facebook account and the user gets signed in. While interacting with wbe3 functions this address can be used instead of metamask wallet address. We were able to store all the images along with its metadata on ipfs(decentralized storage system). A unique hash for each image and its metadata is generated using the SHA256 algorithm. The ipfs URL where it is stored is used as base URI while minting the NFTs. We were able to integrate NFTPort service which simplifies the process and directly returns the NFT object which contains all the metadata along with transaction hash and URL. This URL can be viewed on EthereScan. Thus we were able to manage the important documents of the user by uploading them on a blockchain where they are more secure and no one except the user who uploaded them can claim their ownership.
What we learned
While building this project we learned a lot of new things like onboarding users to a web3 application using Biconomy SDK. We managed to integrate social authentications like google and Facebook into our app. We learned how data is stored on a decentralized system and how NFTs are minted. We learned how to use the NFTPort service to mint the NFTs.
What's next for DigitZen
Currently, a user can upload images of all sizes, we are planning to have some standard constraints on the display dimensions. Also, we are thinking of setting a limit for the number of documents that a user can upload. To exceed the limit, we are planning to add a subscription plan and turn it into a working business model. There are plans for improving UI and improving authentication by verifying mail id and introducing more authentication options other than Gmail and Facebook. We are also planning to implement a wallet-to-wallet notification feature to notify the users when an NFT is minted using push protocol.
Built With
- biconomy
- framer-motion
- material-ui-icons
- nftport
- react
- react-copy-to-clipboard
- react-router
- tailwindcss
- toastify
- web3-auth


Log in or sign up for Devpost to join the conversation.