The Floaters Project

Creating a Revolutionary NFT Collection

Liked it? Share this case study to inspire other's

About This Product

The Floaters Project is an avant-garde NFT collection made up of 88 distinct images and their associated metadata. Conceptualized by Sonni Chen, the project's key requirement was the creation of an ERC721A smart contract and a user-friendly decentralized application (dApp) with a minting function. Powered by Solidity, Truffle, and Hardhat for smart contract development and React.js, Web3.js, HTML, CSS for the dApp, The Floaters Project is a comprehensive integration of NFT technology and IPFS storage, promising a unique user experience.

Our Contribution

Frontend Development
NFT Collection Development
dApp Development

Languages and Technologies

Solidity
Truffle
Hardhat
React.js
Web3.js
HTML
CSS
IPFS (InterPlanetary File System)
Pinata
Heroku
ERC721A

Problem

Sonni Chen, a pioneering entrepreneur in the NFT space, approached our team at Core Devs with her innovative concept of transforming 88 unique images into a comprehensive NFT collection. Sonni envisioned a platform that would seamlessly handle the minting of NFTs, with a set limit per user to maintain exclusivity and value. user-friendly experience for trading NFTs and physical items.


Solution

In response to Sonni's specifications, Core Devs created a robust ERC721A smart contract integrated with all essential functionalities, including the setRevealed feature for unveiling the original metadata, whitelist sale for minting for whitelisted individuals, and presale and public sale provisions for general minting.

To ensure smooth user interaction, we developed an intuitive dApp allowing users to mint NFTs directly from the platform. As per Sonni's request, we limited the minting capacity to five tokens per wallet, implementing this constraint within the smart contract.


Challenges We Faced

In the course of this project, we faced several significant challenges. The task of creating five unique scrapers to extract data from five distinct websites, each constructed with different technologies, was a complex one.

Furthermore, managing an enormous volume of incoming data, over 10,000 new entries each day, was demanding, especially as this data needed to be filtered, sorted, and manipulated into a usable form.

Another obstacle was the task of managing and coordinating seven distinct scripts, a crucial requirement to ensure seamless operation, especially during the deployment phase. There was also the challenge of building a system that allowed the client to easily add new location links and automatically detect the website from the link.

Finally, we needed to find an effective way to present the vast amount of data in a user-friendly manner with adjustable graphs - daily, monthly, and yearly.


How We Solved Them

Despite these hurdles, our team remained committed to overcoming them and delivering a robust and efficient application. We employed Python and Selenium to build efficient and reliable scrapers that could effectively handle the unique technologies of each target website.

To address the challenge of managing the high volume of data, we leveraged the capabilities of Django and MongoDB to design a robust backend system. This system could efficiently filter, sort, and manipulate the incoming data into a structured form.

We also ensured the smooth operation of the seven different scripts by deploying them to two different servers - Heroku for the frontend and backend, and VPS for the scrapers.

To enable the easy addition of new locations, we integrated intelligent parsing functionality into our system, allowing it to automatically detect the website from any newly added link.

Lastly, we utilized React.js for the frontend development to create adjustable graphs for data visualization. This enabled the client to easily understand and analyze the storage rental rates over various time periods.


Why We Choose This Tech Stack?

To build The Floaters Project, an NFT-based platform, we chose a diverse tech stack. Solidity, Truffle, and Hardhat were chosen for their reliability in creating and testing smart contracts on Ethereum.
Pinata, an IPFS Pinning Service, ensures secure and straightforward storage and management of NFT metadata. We used React.js, Web3.js, HTML, and CSS for creating a dynamic, user-friendly, and visually appealing decentralized app (dApp).
Backend development was handled by Python and Django, while Selenium automated browser activities. MongoDB was selected for its scalability in managing large data sets.
We used Heroku for deploying both backend, frontend, and Virtual Private Servers for deploying scrapers, ensuring their efficient operation. This tech stack was chosen to meet the high expectations in the NFT world, delivering a quality product as per Sonni Chen's vision.


More About the Design Process

Here’s our journey through the entire development process, highlighting each step and the challenges we faced along the way:

Step 1 - Uploading Data to IPFS

We initiated our project by uploading Sonni’s 88 unique images along with their metadata to the IPFS server using Pinata. The decentralized nature of IPFS presented initial challenges concerning data upload speed and maintaining the integrity of metadata. We overcame these hurdles by implementing a more efficient data upload protocol and implementing data verification steps.

Step 2 - Building the Smart Contract

Moving forward, we engaged in creating the robust ERC721A smart contract, infused with all required functionalities like the setRevealed for revealing the original metadata, whitelist sale, presale, and public sale. We faced the challenge of ensuring the smart contract was watertight and capable of handling various sales stages. With diligent testing and refinements, we crafted a smart contract that was resilient and efficient.

Step 3 - dApp Development

Our team then dedicated its energy towards developing the interactive dApp. Sonni Chen's requirement was to limit the minting to five tokens per wallet, which was a bit of a challenge as we had to prevent any potential workarounds. We spent considerable effort in ensuring that this limit was hard-coded into the smart contract and couldn’t be bypassed.

Step 4: Testing and Deployment

One of the significant challenges was to deploy the smart contract to the Rinkeby testnet and making sure that the NFT would be available on OpenSea. It involved running a gamut of tests and adjusting the contract based on the feedback received. Ensuring the proper interaction of the smart contract with the Ethereum network and OpenSea platform was a task requiring detailed attention.

Step 5: User Interface and User Experience

With the backend ready and robust, we shifted our focus to the frontend. We aimed to create a user-friendly, intuitive interface. A significant challenge was to ensure the UI was responsive and adaptable to different screen sizes without losing its functionality or aesthetic appeal.

Step 6: Security and Final Touches

Given the nature of NFTs and blockchain, the platform's security was a critical challenge. We ensured stringent safety measures to protect against potential attacks. We also incorporated error-handling mechanisms to prevent any disruptions in service and give users a seamless experience.

Step 7: Review and Iterations

The final step was to present our solution to Sonni Chen and gather feedback. We had to be extremely responsive and agile to incorporate any changes that were required. This iterative process was necessary to ensure the final product was up to the mark and exceeded the client's expectations.


Features

The application contains the following features:

Intuitive User Interface

The dApp is designed with a clean, easy-to-use interface, making it straightforward for users to interact with and mint NFTs.

ERC721A Smart Contract Integration

The dApp is fully integrated with an ERC721A smart contract, facilitating the seamless minting of NFTs.

NFT Minting

Users can directly mint NFTs from the platform, providing them with an easy and direct way to participate in the collection.

User Minting Limit

To maintain the exclusivity and value of the NFT collection, a minting limit of five tokens per wallet has been set.

Data Stored on IPFS

The dApp is integrated with the InterPlanetary File System (IPFS), ensuring the metadata associated with each NFT is securely and permanently stored.

Presale and Public Sale Functionality

The dApp includes options for presale and public sale minting, providing flexibility for different types of sales and distribution strategies.

Whitelist Sale Functionality

The dApp supports whitelist sales, allowing for exclusive minting periods for pre-approved addresses.

SetRevealed Functionality

The dApp includes a setRevealed function, allowing the original metadata of the NFTs to be unveiled at the chosen time.

Ethereum Network

The dApp operates on the Ethereum network, allowing users to easily connect their Ethereum wallets and ensuring broad compatibility with the NFT marketplace.

Floaters Project is an excellent example of a comprehensive integration of NFT technology and IPFS storage, delivering a high-quality, user-friendly product that aligns with the founder's vision, while also addressing the challenges that surfaced during its development. This project is a testament to the potential and versatility of blockchain technology and the growing NFT space.


Client Review

"It has been a really great journey to work on the project with Mahbub and his team at Core Devs. I started the project with some uncertainty and confusion about how NFT smart contacts will work an in the end, I've learned so much from the team, and they are super patient about explaining to me lots of detail. The overall process is super smooth and the final deliverable is beyond expectation."

Previous Case study

A Cutting-Edge Solution for Profitable Cryptocurrency Trading

Next Case Study

Revolutionizing Storage Rental Rates Analysis

Ready to create a more decentralized and connected future?

Our technical experts offer a free consultation to help you plan your idea, requirements, and tokenomics before beginning development.

Let's discuss your idea imageTag
Or need to speak with business consultant expert?

Mahbub Shuvo

CEO at Core Devs ltd