Overview
We are seeking proposals from qualified developers or development teams to create a web-based social asset builder that allows OG Doodles NFT holders to connect their wallets and use their Doodles IP, along with generic Doodles assets, to create various social media assets. This tool should be intuitive, leveraging common web technologies and frameworks, and facilitate easy addition of new assets by non-technical resources.
Project Scope
The project involves developing a web-based React tool that integrates with the public provider for Wallet Connect / Wagmi provider to verify NFT ownership, uses a standard wallet connectivity tool, and utilizes a provided Doodles S3 to fetch images with transparent backgrounds. The tool should support drag-and-drop functionality with layers, resizing, cropping, and text editing capabilities.
Technical Requirements
Wallet Connectivity and NFT Verification
- Use Alchemy to check OG Doodles NFT ownership.
- Integrate RainbowKit or comparable seamless wallet connection.
Asset Fetching
- Utilize Doodles' provided S3 Bucket to fetch respective images with transparent backgrounds.
Frontend Development
- React Frontend
- Implement a drag-and-drop interface for asset placement
- Include functionality for resizing, cropping, and text editing with predefined fonts
- Allow users to adjust layer order (background, stickers, Doodles image, text)
Canvas Sizes to Support
- Twitter: Profile Picture (400x400), Cover Photo (1500x500).
- TikTok: Profile Picture (200x200).
- LinkedIn: Profile Picture (400x400), Cover Photo (1584x396).
- Instagram: Profile Picture (110x110).
- YouTube: Profile Picture (800x800), Cover Photo (2560x1440, safe area 1546x423)
- iPhone Screen Resolutions:
- iPhone 14 Pro Max / 13 Pro Max / 12 Pro Max
- Resolution: 2778 x 1284 pixels
- Aspect Ratio: 19.5:9
- iPhone 14 / 13 / 12
- Resolution: 2532 x 1170 pixels
- Aspect Ratio: 19.5:9
- iPhone 14 Plus / 13 Mini / 12 Mini
- Resolution: 2340 x 1080 pixels
- Aspect Ratio: 19.5:9
- iPhone SE (3rd generation)
- Resolution: 1334 x 750 pixels
- Aspect Ratio: 16:9
- iPhone 11 / XR
- Resolution: 1792 x 828 pixels
- Aspect Ratio: 19.5:9
- Android Screen Resolutions:
- Samsung Galaxy S23 Ultra
- Resolution: 3200 x 1440 pixels
- Aspect Ratio: 20:9
- Google Pixel 7 Pro
- Resolution: 3120 x 1440 pixels
- Aspect Ratio: 19.5:9
- OnePlus 11
- Resolution: 3216 x 1440 pixels
- Aspect Ratio: 20.1:9
- Samsung Galaxy S23 / S22
- Resolution: 2340 x 1080 pixels
- Aspect Ratio: 20:9
- Google Pixel 6 / 6a
- Resolution: 2400 x 1080 pixels
- Aspect Ratio: 20:9
Asset Management
- Enable easy addition of new assets (backgrounds, stickers, etc) via a JSON config file.
- Assets to be stored in an S3 bucket, with the config file linking to these assets.
- Ensure new assets appear in the app as usable elements.
Output and Sharing
- Allow users to download and save their created images.
- Share the application code via GitHub with comprehensive documentation.
Non-Functional Requirements
- The application should be responsive and performant.
- Meant for desktop, ok to block mobile for first iteration
- Ensure cross-browser compatibility.
- Prioritize security, especially for wallet connections and API interactions.
Project Timeline
- The project should be completed within 6 weeks.
User Stories
- Wallet Connection and NFT Verification
- As a user, I should be able to connect my wallet to verify my OG Doodles NFT ownership via Alchemy.
- As a user, I should be able to connect my hot wallet to verify my OG Doodles NFT from my cold storage wallet via Delegate.xyz
- Asset Selection
- As a user, I should be able to select from specified canvas sizes for different social media platforms.
- As a user, I should be able to select my owned Doodle and place it on the canvas.
- As a user, I should be able to choose from a repository of background and sticker assets.
- Asset Manipulation
- As a user, I should be able to resize, crop, and rotate assets on the canvas.
- As a user, I should be able to adjust the layer order of each asset except for the background.
- As a user, I should be able to add and edit text with a set of predefined fonts.
- As a user, I should be able to upload up to 10 custom images and use them in the asset builder like any other asset
- Asset Management
- As an admin, I should be able to add new assets to the app by uploading them to an S3 bucket and updating a JSON config file.
- As a user, any asset I upload should be stored in local storage and will only be usable during that session
- As a user, I should see the new assets appear in the app automatically after they are added.
- Output
- As a user, I should be able to download and save the images I create.
Preferred Tech Stack
- Frontend: Typescript, Next.js (app router), Typescript, Tailwind, Chakra, dndkit or dropzone, Konba
- Backend: Typescript, Node.js, Express.js
- Deployment: Vercel
- SDKs: AWS, Wallet connection SDK
- Wallet Connectivity: Any standard wallet connectivity tool
- NFT Verification: Public Provider / Alchemy
- Asset Management: Amazon S3, JSON config files
- Backend (if necessary): Node.js, Express.js
- S3 Bucket: Integrate with S3 bucket for fetching Doodles images
Proposal Requirements
Please include the following in your proposal:
- Detailed development approach and timeline.
- Examples of similar projects or relevant work.
- Team structure and key personnel.
- Cost breakdown and total budget.
- Post-development support and maintenance plan.
- Any additional features or recommendations.
Submission Deadline
Please submit your proposals by @September 13, 2024. We aim to review proposals and select a development partner by @September 18, 2024
Contact Information
Proposals must be submitted by @September 13, 2024 detailing fulfillment of the RFP criteria. Send submissions to [email protected] and [email protected]
Conclusion
We invite innovative developers and development agencies to partner in creating a platform that empowers Doodles NFT holders to express their individuality on social media. We eagerly await proposals that showcase a blend of creativity and technical prowess to bring this project to life.