project screenshot 1
project screenshot 2
project screenshot 3
project screenshot 4
project screenshot 5

0xRococo

A dApp leveraging on-chain payment infrastructure to accelerate connections between content creators, merchants, and consumers by 100 times.

0xRococo

Created At

ETHGlobal London

Project Description

Problem Statement/Background:

In Web2, content creators, merchants, and consumers engage in fragmented interactions. To collaborate on paid promotions, content creators often establish off-chain contracts with merchants. Once these contracts are formed, merchants provide affiliated links for content creators to include in their public content, enabling access to potential consumers. Each content post, whether on a personal URL domain or social media platform, can contain multiple affiliated links. For instance, a travel post about Tuscany might feature affiliated links for car rentals, hotels, restaurants, experience vouchers, and more. Consumers typically navigate through these links individually to determine their purchasing interest.

Lately, content creators in Web2 have tackled this challenge by offering specialised packs containing curated content (such as Google maps, guidelines, etc.) alongside a selection of affiliated links. While this approach abstracts the link-opening process for consumers, the payment mechanism between creators and merchants remains obscure, relying on manual ledger tracking and off-chain agreements. Consequently, payment settlement for both parties occurs after consumers purchase the pack, leading to delays in receiving payment. Moreover, redeeming the pack's contents in real life presents difficulties for consumers, who must retrieve their email QR code instead of conveniently redeeming purchased vouchers through contactless methods. As these issues accumulate, the digital experiences intended to replicate the immersive user experience depicted in content posts often fall short of expectations.

In Web3, several projects have inadvertently addressed these challenges by introducing specific NFT packs for consumers to purchase. These packs typically include tokenized vouchers and may even airdrop consumable vouchers to users who sign up for events. For example, ETH Global offers specialized hackathon packs containing items like Uber vouchers, eSIM cards, and real-world crypto event tickets. Upon purchase, consumers can redeem these vouchers individually. However, ETH Global does not receive recognition for distributing the vouchers, as they are tokenized independently by the ETH Global team through ERC-721. Similarly, creators do not receive compensation for distributing or promoting vouchers when they are airdropped to whitelisted wallet addresses.

Here, we foresee the future of the internet being constructed upon decentralized ledger networks, enabling seamless interactions among creators, merchants, and consumers across both virtual and real-world domains, independent of social platforms or individual URLs. With the increasing prevalence of near-field communication (NFC), consumers can effortlessly redeem vouchers in real life using their mobile devices, thus immersing themselves fully in the experiences envisioned by content creators. This progress also enables merchants to expedite the shipping of products or experiences worldwide, leveraging independent media penetration channels such as bloggers and influencers.

Solution

Introducing 0xRococo, a consumer-oriented dApp empowered by on-chain payment infrastructure. Our platform aims to enhance connections among content creators, merchants, and consumers, fostering immersive real-life experiences. Leveraging cutting-edge blockchain infrastructure and the integration of near-field communication (NFC), we strive to revolutionize the way users interact and engage across digital and physical realms.

However, we are not just another social platform reliant on building network effects to function effectively. Our aim is to collaborate with existing social platforms, decentralized social networks, global merchants, individual bloggers, and influencer IPs to bring our dApp to life. We envision a future where deplatforming becomes a norm, or where users regain ownership and control of their data. Our mission is simple: to facilitate more efficient transactions and enable content creators, consumers, and merchants to fully immerse themselves in the world of experiences around them. As William Shakespeare once said, "the world is your oyster," and 0xRococo serves as the shucking knife, allowing users to seamlessly transition from virtuality to reality, unlocking endless possibilities.

With 0xRococo, content creators can create packs of NFTs on-chain, including curated content and merchant offers. Merchants can also tokenize their offers through 0xRococo and partner with content creators. Consumers can then buy these packs, with the NFTs stored in their wallets for real-world redemption. Crucially, funds paid by consumers are instantly rebated and transferred to the merchant upon pack purchase, highlighting 0xRococo's on-chain payment infrastructure, in a nutshell.

There are three ways that consumers can interact with 0xRococo:

  1. (Rococo 2 Consumers) Introducing a chatbot interface for consumers to engage with, indexing all content creators and merchants across the internet, who are utilizing 0xRococo's on-chain payment infrastructure. For instance, a user can query, "Hey Rococo, I'm in London today for ETHLondon, what experiences do you recommend?" The chatbot responds by presenting a list of packs indexed with various creators matching the consumer's request. For example, ETHGlobal may offer a pack featuring Vodafone eSIM cards, Uber Eats vouchers, and a ticket to Oxford Blockchain Week (as illustrated in the prototype below). Consumers can instantly purchase these packs using their wallets, with the contract currently deployed on Base, allowing transactions with ERC20 tokens. Additionally, Web2 users can onboard using their credit cards. As more merchants and content creators join 0xRococo, consumers will have a wider array of pack options to choose from. In the finalized product, users will gain access to a map function where their purchased NFTs are distributed, allowing consumers to navigate more effectively in real life.
  2. (Rococo to DeSo) Introducing the Farcaster Frame, where consumers can mint packs on Warpcast, enabling a seamless transaction experience. Content creators utilizing 0xRococo can distribute their packs and collaborate with merchants within the Farcaster ecosystem. Likewise, merchants can establish a 0xRococo frame for their tokenized offers, enticing relevant content creators to engage in collaborative ventures. This symbiotic relationship fosters a dynamic marketplace where creators, consumers, and merchants interact fluidly, unlocking new possibilities for commerce and creativity.
  3. (Rococo to Web2 social media) In centralized social media platforms such as Twitter or Instagram, content creators utilizing 0xRococo can tokenize their content and offerings, simplifying the process by sharing the original content link for consumers to purchase the packs directly.

Behind the consumer application, content creators will have access to a dedicated web application tailored for crafting NFT packs. Within this platform, creators can explore a global marketplace of tokenized offerings provided by merchants. They can seamlessly integrate these offerings into their NFT packs using the 0xRococo smart contract. Simultaneously, merchants will utilize a dedicated web application for tokenizing their offerings and accessing a marketplace of content creators whom they wish to collaborate with via the 0xRococo smart contract.

Hackathon Prototype:

Due to the time constraints for this hackathon, we did some experimentations with smart contracts, the UI/UX designs, and front-end demonstrations to show the concept of 0xRococo.

  1. Smart Contract

To make the primitive 0xRococo idea work, our smart contract engineer Kris wrote a smart contract called “Voucher”, and it serves as a platform for creating, purchasing, and redeeming offers represented by ERC1155 tokens. Let's break down its key components and functionalities:

  1. Contract Inheritance:
    • This contract inherits from two other contracts: Ownable and ERC1155.
    • Ownable provides functionality for ownership management, allowing certain functions to be restricted to the contract owner.
    • ERC1155 is an implementation of the ERC1155 token standard, which enables the creation and management of fungible and non-fungible tokens.
  2. Events:
    • The contract emits several events to notify external parties about key contract activities, such as adding/removing promoters, purchasing offers, and redeeming offers.
  3. Structs:
    • The contract defines two structs: Offer and Promoter.
    • Offer struct contains information about an offer, including its price, expiry timestamp, the number of tokens issued, and the issuance limit.
    • Promoter struct stores details about a promoter, including their address and rebate percentage.
  4. State Variables:
    • offers: A mapping from offer IDs to Offer structs, storing information about each offer.
    • promoters: A mapping from promoter addresses to Promoter structs, maintaining details about each promoter.
    • lastOfferId: An integer to keep track of the last offer ID assigned.
  5. Constructor:
    • The constructor initializes the contract, setting the initial owner as the deployer of the contract.
  6. External Functions:
    • setURI: Allows the owner to set the URI for token metadata.
    • addPromoter and removePromoter: Functions for the owner to add or remove promoters along with their rebate percentages.
    • queryOffer: Returns information about a specific offer.
    • createOffer: Enables the owner to create new offers.
    • purchaseOffer: Allows users to purchase offers, transferring tokens to the purchaser and rebates to promoters if applicable.
    • redeemOffer: Allows users to redeem offers, burning the corresponding tokens.
  7. Modifiers:
    • onlyOwner: Modifier restricting access to functions only to the contract owner.

Overall, this smart contract facilitates the creation, purchase, and redemption of offers represented by ERC1155 tokens, with functionality for ownership management and promoter incentives.

  1. UI/UX
  2. Frontend

(2 and 3 will be shown on the media file)

How it's Made

  • ERC-1155 Multi Token Standard [https://eips.ethereum.org/EIPS/eip-1155]
  • Base [https://www.base.org/]

This contract allows merchants to tokenize non-fungible assets in a high-throughput and non-unique manner using ERC1155. Additionally, it provides functionality for ownership management, adding/removing promoters, creating and purchasing offers, and redeeming offers. If desired, ERC6551 can be added on top of this smart contract to enable token-bound accounts for consumers to mint specific content posted by creators and receive embedded NFTs bound with the blog post.

After compiling the smart contract using the Solidity compiler, solc, the bytecode was generated, ready to be deployed to the Base Layer 2 (L2) blockchain. Once the compilation was complete, Kris proceeded to deploy the smart contract to the Base network, (in this case Base Sepolia). Base was selected as the deployment network due to its optimal user experience for the creator economy. Following the Dencan upgrade, gas fees on Layer 2 solutions became even more economical. Therefore, it was believed that in order for 0xRococo to provide the best service to its users, a decentralized ledger network like Base was essential for onboarding as many users and transactions as possible. This strategic decision aimed to ensure scalability and cost-effectiveness for the platform's operations.

Deployer: 0x87a157A8433ec034F2D6326a60266336C9e43AeD Deployed to: 0xb6843935139f2E7E4c37eEF2502119BBdBB578b9 Transaction hash: 0x61d8e909735ccf22bf3fa0a6a319b11ece1d5771d035f4060882989162bbf24c

  • Foundry [https://github.com/foundry-rs/foundry]
  • OpenZeppelin [https://openzeppelin.org/]

Next Steps:

To utilize the smart contract, the next steps involve interacting with it using Web3.js or ethers.js libraries, which provide APIs for Ethereum smart contract interactions. Incorporating either of these libraries into the frontend application enables connection to an Ethereum node (e.g., Infura or a local node) and facilitates interaction with the deployed smart contract using its address and ABI (Application Binary Interface). Subsequently, it's crucial to make the deployed smart contract's address and ABI available to the frontend application, either by hardcoding them into the code or dynamically retrieving them from a backend server. Following this, a JavaScript object representing the smart contract is instantiated in the frontend code using its ABI and address, enabling the invocation of functions and listening for events. Function calls to the smart contract can be made from the frontend code to execute various functionalities, such as purchasing items, transferring tokens, or retrieving blockchain-stored data. Transaction confirmation processes must be managed when executing functions that alter the blockchain's state, while event listeners in the frontend code respond to emitted events to reflect changes on the blockchain. Finally, the frontend user interface (UI) is updated to display relevant data obtained from smart contract function calls or emitted events, enhancing user interaction and experience through text updates, list rendering, or notification displays based on contract state changes.

background image mobile

Join the mailing list

Get the latest news and updates