# Doodle Banner Maker

### **TL:DR**
Doodle Banner Maker is a fun and easy way to display Doodles on your Discord, Twitter and OpenSea profile Banner.

## **Concept:**
A tool where Doodler's can choose a background image and place their Doodle on the canvas to create a banner/background to be shared or used as twitter/discord/open sea background.

### **References** (*copy paste pics from the internet, real version will be a lot cooler):
Temp Site

Rough Banner Mock Up

### **The Background:**
> - There is a list of pre-set images to be used as a background with multiple sizes.
> - The image needs to be resized to a width compatible with the tool. However, it will keep the aspect ratio.
> - The user can insert a hexadecimal color to set in the border. It will be the Doodles' border inside the canvas.
> - An extensible code to add new background images easily into the Github repo.
>

### **The Doodles:**
> - The tool will have an input to add up to 5 (Maybe More) Doodle Ids from any wallet
> - After choosing it, the user can drag-drop the Doodle to the background
> - Doodle added can be resized and rotated

### **The Banner:**
> - The user will have an option to choose the social media and background to be used in the banner. They are Discord background ratio(16:9 1920x1080), Twitter background ratio (3:1 1500x500), Open Sea background ratio (*1400x400*)
> - User finalize and have a button to open in a new window to save/download the image

### **Development**:
> - **Stack**: React and chakra-UI design system for frontend
> - *If the backend is necessary, I'll try to make it works first on the job runner, secondly on lambda or in the last case using node.js running in a server.*
> - **Repository**: Github + Github Actions for deployment
> - **Database**: it's not necessary
> - **Mobile**: some features can be disabled or replaced for another way to work on it, once it's hard to have things like drag-drop on a mobile device. It will be checked in development time and can be discussed with the DAO.
> - **Infrastructure:**
> - **Static files:** Google Cloud or what the DAO prefers.
> - **Web3:** Infura API or IPFS key may be necessary to access IPFS images (not 100% sure, I'll try use without a key, we need to be careful about rate limit)
> - **Metrics:** If the DAO wants to have google analytics to have data about the website usage and/or NewRelic to have data about crashes, bugs and application performance

### **Timeline:**
> - 2-4 Weeks

### **Budget:**
> - Stacks - 10E for coding, front end and deployment.

### **Who**
> - Arod - An experience web developer from Brazil, Arod has spent the last decade plus working in advertising, fin tech and product marketing. Now fully focused to Web3, Arod independently developed a wonderful tool that was embraced by the community for use in the Arihz Panels competition. https://arodundef.github.io/panels-contest/
>
> - Joshua Fisher - Day 1 Doodler, SharkDAO member, and creative manager, Josh spends his time helping bring creative ideas to life.

### **Stretch Goals:**
***These features are not included in the package and can be built on according to Arod availability. They are bonus features that Joshua and Arod discussed in brainstorm ideas, but it's out of the principal scope as they can add more complexity and spend more time than can be estimated before starting the project.***

> - *A way for the website administrator to include more background images or to the users choose one from their computers (can be used for bad things too, as negative images)*
> - *Choose the media after editing and add the crop with the proper aspect ratio to select which part of the banner will be cut.*
> - *Doodles are being loaded from the user wallet.*
> - *Filter on the Doodles from the wallet according to properties.*

### **Additional Notes:**
> - Arod will deliver all the code and access to the DAO responsibility after being approved by them.
> - DAO needs to provide hosting infrastructure and tools used to facilitate the migration of ownership, or the DAO needs to give Arod access to use their infastructure from the start of this project.
> - Arod can charge any new feature out of the scope due to its complexity.
> - Arod has the right to market this tool as built by Arod (included some signature on the website, place chosen by DAO).
> - Arod has the right to make deals with other DAOs to sell/offer or make a public tool for the community with the same or new features.