# General Grant Proposal

* **Project:** TAZ Dapp - Semaphore Experience for Bogota Devcon

## Project Overview :page_facing_up:

### Overview

* TAZ is a Dapp with the purpose of allowing new users to experience the possibilities that can be built with Semaphore Protocol. Dapp visitors will be offered two paths to explore: the first will allow the user to ask/answer questions or leave feedback anonymously, the second will lead the user to create and mint an NFT of their own generative art.

### Project Details

#### User flow:
1. User will input their identity by scanning a QR code or pasting in a given Identity Key.
2. User can also select the option to create an Identity and then join the Group directly.
3. Once connected, a user will select which path he would like to take: Path 1 - Anoymous Q&A, or Path 2 - Create a Generative Art Piece.

* #### Path 1 - Anonymous Question and Answer
4. Users can see existing questions/feedback.
5. User can ask or answer a question.
6. User will generate zero knowladge proof using Semaphore Protocol.
7. User will click "Send/Post", the proof and the signal/question/answer will be sent to Dapp backend, which will send a transaction to the Goerli Network.
8. User will receive back the transaction hash and see his signal/question/answer displayed on the Q&A board.

Note: In this path the user will be able to send up to 3 Questions to avoid Spam

* #### Path 2 - Create a Generative Art Piece
4. User can see the art previously generated by other users.
5. User will be given a blank screen and a few parameters he can fill to setup his Gen Art.
6. User will interact with fingers on a blank screen to draw something.
7. User will click "Generate Art" and the dapp will generate a piece incorporating his drawing and the given parameters.
8. User will generate a zero knowladge proof using Semaphore Protocol.
9. User will click "Mint" to send the art, proof, and address to the dapp backend, calling the "mint" function to first verify the zero knowladge proof and then mint the Gen Art to the user's address.
10. User will receive back the transaction hash of the newly minted NFT and see his piece displayed on the Art Board.

Note: In this path the user will be able to use his zero knowledge proof only once.

Question: If users can create as many identities as they want, wouldnt they be able to create as many art pieces as they want?

* #### 11. At the end of each path, the user is given a link to claim a POAP.

### Development tools
* Next.js for frontend and backend
* Ethers.js for smart contract / blockchain interaction
* Semaphore libs for Proof Generation / Membership Verification
* p5.js or Three.js for Generative Art (still in research)

### Components
1. User Login/Auth Component takes input by QR code, pasting Identity Key, or generating a new Identity.
2. Paths Page displays the Q&A and Generative Art paths.
3. Q&A Board page displays Questions/Answers and Feedback items (a mapping of list of Questions/Answers and Feedback).
4. Generate Proof Component (maybe a modal) and Send Tx Component.
5. Generative Art Board page displays created art pieces.
6. Generate Art Page with Drawing Component, input fields for arguments to generate the piece, and Create/Generate Art Button.
7. User address input field and Mint/Generate NFT Button sends the transaction to the backend.
8. Tx Succesful Modal(?) with Mint Poap Function.
9. API to Join Group calls the Semaphore addMember function(Backend).
10. API to post Question/Answer/Feedback calls the Semaphore contract to add a Question/Answer/Feedback.
11. API to Generate Art calls the NFT contract to verify proof of membership and generate the NFT.
12. Semaphore Q&A smart contract.
13. Semaphore Mint NFT custom smart contract.

## Team :busts_in_silhouette:

#### Danilo Woo Hyung Kim
Email: [e-mail]
Telegram Handle: @danilo1080
Discord Handle: @danilowhk#8056
Github: https://github.com/danilowhk

#### Rich Warner
Email: [e-mail]
Telegram Handle: @richie5596
Discord Handle: @richie#5596
Github: https://github.com/richwarner

#### Colleen Rose
Email: [e-mail]
Telegram Handle: @cjRose853
Discord Handle: @cjRose#2596
Github: https://github.com/CJ-Rose

#### Lee Poettcker
Email: [e-mail]
Telegram Handle: @pumpedlunch
Discord Handle: @pumpedlunch#0641
Github: https://github.com/pumpedlunch

#### Falco Ramon Rodenburg
Email: [e-mail]
Telegram Handle: @ramon123
Discord Handle: @Falco90#6246
Github: https://github.com/Falco90

### Team Website
#### Some of the projects we have built previously as a team
* https://ethglobal.com/showcase/ozen-web-3-0-music-player-cpw4i (Our first Hackathon Experience)
* https://ethglobal.com/showcase/om-zkdao-k94t2 (Our first implementation of Semaphore)
* https://ethglobal.com/showcase/emergence-o3tns (Our first Hackathon Finalist win implementing Semaphore)

### Team's experience
Google Drive Link with all team members CV https://drive.google.com/drive/folders/1QLtyze5urBIVeYmvQpgYQfRx44q_oEky?usp=sharing

### Team Code Repos
* https://github.com/danilowhk
* https://github.com/richwarner
* https://github.com/CJ-Rose
* https://github.com/pumpedlunch
* https://github.com/Falco90

## Development Roadmap :nut_and_bolt:

### Overview
* **Total Estimated Duration:** 3 weeks / 21 days
* **Full-time equivalent (FTE):** 1.5
* **Total Costs:** $10,000(rounded up)

### Milestone 1: First TAZ Dapp Developments V1
* **Estimated Duration:** 7 days
* **FTE:** 1.5
* **Costs:** $3,333
* **Estimated delivery date**: Aug 31st 2022

| Number | Deliverable | Specification |
| ------------- | ------------- | ------------- |
| 0b. | Documentation | We will provide both inline documentation of the code and a basic tutorial that explains how a user can spin up the application. Once running, it will be possible to send test transactions that will show how the new functionality works. |
| 0c. | Testing Guide | The code will have proper unit-test coverage (e.g. 90%) to ensure functionality and robustness. In the guide we will describe how to run these tests |
| 1. | Alpha Front-End UI | Front end that will allow us to test all the functionalities of the user flow. Our goal is to first have all the steps and if possible to have them the same as proposed by Rachel's design.
| 2. | QR Code and Identity Generation | Test component for generating an Identity manually or using the QR code |
| 3. | Q&A Layout Component | Test component for displaying questions and answers|
| 4. | SmartContracs | Test Q&A and Generative Art smart contract integrated with Semaphore |
| 5. | Backend API to call Smart Contracts | First version of the 3 APIs that will be used to interact with the smart contracts (addMember, postQuestion, generateArt)
| 6. | Application | Will have the layout of most components and be testing them separately, to be integrated in the following week |

### Milestone 2: TAZ Dapp Integration
* **Estimated Duration:** 7 days
* **FTE:** 1.5
* **Costs:** $3,333
* **Estimated delivery date**: Sept 7th 2022

| Number | Deliverable | Specification |
| ------------- | ------------- | ------------- |
| 1. | Generative Art Component | Functioning Generative Art component that will generate art pieces based on user's input and possibly interactions |
| 2. | Dapp Integration | The Front-End will be integrated with all APIs and Smart Contract calls|
| 3. | Generating Proof and Sucessful Tx Modals | Implementation of first version of the modals related to Generating Proofs and Sucessful Transaction display
| 4. | Q&A Board | Q&A board that displays added items and updates with each transaction posted |

### Milestone 3: Finalized V1 of the TAZ Dapp
* **Estimated Duration:** 7 days
* **FTE:** 1.5
* **Costs:** $3,333
* **Estimated delivery date**: Sept 14th 2022

| Number | Deliverable | Specification |
| ------------- | ------------- | ------------- |
| 1. | Integrate Generative Art Component | Generative Art component will be integrated with the Dapp flow to allow users to Mint NFTs |
| 2. | Dapp UI and UX | Design and UX updated to match exactly to what is proposed by Rachel|
| 3. | Dapp Test | Testing implemented for each step of the user flow following both paths
| 4. | Responsivness of the Dapp | Fully responsive behavior implemented for larger desktop and laptop screens (initial development will be focused on mobile)
| 5. | Deployed Dapp| Dapp will be deployed and links functional for users to start accessing and interacting |

## Additional Information :heavy_plus_sign:
Any additional information that you think is relevant to this application that hasn't already been included.

* We will update our work on this document every week.