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

FlexiPay

Flexipay is a solution which makes the attendees of the event pay only for the amount of time they attend an event by establishing a stream between an attendee and the organizer. It also includes a discord bot which regulates the event.

FlexiPay

Created At

ETHOnline 2022

Winner of

🥇 Push Protocol — Best Use

🏊‍♂️ Tableland — Pool Prize

🏊‍♂️ Superfluid — Pool Prize

Project Description

Problem Statement

Ever thought about that it can be possible for paying for the amount of time you were attending an event (Events organized by DAOs) ? Ever felt like the money you paid for buying the NFT for the event gone in vain as you are interested only in some part of event not the whole one ?

It happens! Nowadays, there are literally so many DAO events going on (mostly on discord voice channels) and mostly people aren’t interested in attending the whole event rather they would like to get engage/attend in the part of their interest. Also, often the event isn’t conducted in the way it has been planned and promised. At the end of it, people feel that what if there was a way which is more Flexible to register and pay for attending Events without the entire money being locked as Registration Fees. Also the current NFT gated access to DAO events is not an absolute solution where user needs to buy an whole NFT as a pass for a whole bunch of events even though user is only interested in attending a few of them.

Solution

Introducing FlexiPay, a Flexible Payment solution for DAO events (which are organized at community discord voice channels). FlexiPay creates a stream of money flow between the Event Attendee and Organizer so that as the event starts, money/tokens flows from attendee’s wallet to organizer’s wallet for every second they are the part of the event. We have used Superfluid for this feature. Once the attendee stops attending the event, they won’t be charged for the remaining duration of the event.

FlexiPay comprises of two components: A Web Application and A Discord Bot.

Web application have major role plays for different parties (DAO communities and normal users).

DAO communities can come to the web application where they are given the facility to register and manage event ticketing. Once event is created it will be listed at the events page.

Normal user: User can utilize the platform to surf through all the available events in the platform and can register and confirm their seat to the events by paying the RSVP fees and agreeing to the stream rate for the event further Once registered user they will receive the alert notification for the event they are registered <30 minute prior to the event commencement also user could utilize the platform to start stream as they are proceeding to attend the events and if they choose to leave again they can end the stream from the web application itself.

Discord bot: Nowadays as mostly DAO conducts their events on discord voice channels due to which we developed our own discord bot named Vlad which is a easy to use stream monitoring bot which will help DAO communities to keep check on user attending events whether the user who is attending event has his stream active or not. If not the bot will kick the user from the voice channel.

Usage Workflow

Web Application:

  • Connect Wallet and Get Started.
  • You can see the scheduled events on the Events Page. The past events have been marked as over for better UX.
  • Click on any Event Card and it will redirect you to the Event Details Page.
  • You can view the Event Details and can Join the event by filling the form and paying the RSVP fee mentioned on the same page.
  • You can then join the Discord Server of the Event by clicking on the Discord Invite button.
  • Just before the start of an event, you have to start the Stream by clicking on the Start Stream button on the Event Details Page. Don’t worry you receive a notification alert for that.
  • You can then join the discord voice channel of the Event.
  • Remember to stop the Stream after you leave the Event.
  • Once the Event is over, attendees can withdraw their RSVP Fees from the Event Details page of the respective Event.
  • Further DAO communities can come to the web application and register and list their events and can manage the events ticketing.

Discord bot (Vlad)

  • You can find the link to invite Bot on your discord server on the About Vlad Page on Web app.
  • Select the server to which you would like to add Vlad.
  • Paste the following command in your #general channel. !init eventInfo {eventId} {vc-name}
  • Replace {eventId} with the Event Id of your event and {vc-name} with the Voice Channel Name on which the event would be hosted.
  • Before the event starts make sure to enable bot to monitor the Voice channel by entering the command /start-monitoring on your #general channel.
  • After the event ends, you can stop the bot from monitoring the Voice channel by entering the command /stop-monitoring on your #general channel.

Usecases

  • It will be used for organizing and managing event funds and stream token to event organizers.
  • Stream gated event access (powered by discord bot) will ensure only registered + active stream attendees to attend the event.
  • FlexiPay enables a pay per join model where the user will only be paying for the amount of time he/she is the part of the DAO events organized in discord voice channel.
  • DAO events can monitor time for which the stream is active and could be utilized while issuing POAP tokens to the users.

How it's Made

As we said there as two facets for the whole system to work

  • FlexiPay Web app
  • Vlad Discord bot

We had use the following tech stack for building the FlexiPay web app:

  • React.js
    • We bootstrap our project with React js javascript library to speedily build scale and reusable frontend components.
  • Ant Design (UI Library)
    • We utilize the reusable frontend component available at antd so as to create soothing UX friendly functionalities Most of the UI components visible in the application are take antd design UI library.
  • Tableland:
    • In the web application side we were required to save the events related information as well as multiple attendee related information including attendee wallet address, discord info, event organizer info. and wanted to make this data available as discord bot end for monitoring purpose. As all these data are interrelated we use tableland for the purpose as it allow us to create tables and fetch data with simple SQL queries. And helps us to keep data as normalized as possible to support faster and efficient retrieval and management of data. On top of all it’s very easy to use and decentralized database solution.
  • Covalent:
    • We used covalent endpoints as a data feeds for our application to fetch the Realtime dai to usd price as it will be utilize to convert the USD price given by user to corresponding no of DAI tokens.
  • IPFS & Moralis:
    • While creating events we are savings all the props used while registering event of IPFS decentralized storage solutions and saving the hash of it as one of the cell of table land land table corresponding to the events it belongs to and for the pinning purpose we used moralis gateways and apis.
  • SuperFluid (To establish payment stream)
    • One of the most crucial feature of flexipay is to allow user to manage stream so as to define users attendence to the events. Using superfluid sdk we enabled user to start the stream on it’s own with just a single click using the web application. and once the event is over user can further stop the stream with a single click.
  • Polygon (To deploy smart contracts)
    • To make application UX friendly fast and scalable we deployed our smart contracts to polygon mumbai testnet.
  • EPNS
    • We also implemented a notification service as user would like to remain updated about the event timings and don’t wanna mess up with the commencement of the events. for enabling notifications we created a flexipay channel user just need to subscribe to that channel once subscribed they would start receving the notification regarding their registered events commecements.
  • Quick Node
    • We used quicknode as provider execute all of our network calls on it.

Discord Bot:

  • Node.js (Library to create servers)
    • As discord bot requires a server to function up we utilized nodejs to create a server the disord bot to function up.
  • Discord.js (Library to develop discord bot)
    • All the behaviours and actions take by discord bot are implemented using the methods and functions availaible in discord js package.
  • Tableland
    • As all the attendee data is availaible in table land we were required to fetch it as the bot end to flourish bot with user username to their wallet address mapping which could be utilize to check the stream of user present in voice channel.
  • Superfluid (For checking the user streams)
    • We utilize several superfluid sdk methods and function to whether the stream of user is active or not if he/she is attending an event.
  • Quicknode
    • Used tableland to create a signer and to act as a provider for network calls at discord bot end.
background image mobile

Join the mailing list

Get the latest news and updates