onflow / developer-grants

Grants for developers that contribute to the broader developer ecosystem
Apache License 2.0
50 stars 18 forks source link

My Flow NFTs #53

Open lovdeep7 opened 2 years ago

lovdeep7 commented 2 years ago

My Flow NFTs

Grant category

Developer tools / services

This project was started by @tyllenb as part of this wishlist grant: https://github.com/onflow/developer-grants/issues/15.

Description

Problem statement

Flow was launched in 2019 when the developers of CryptoKitties found that their viral game was too popular to live on Ethereum. With its own chain and programming language, Flow is designed with the future of blockchain in mind: upgradeable smart contracts, high traffic, and robust security. Today, Flow’s platform stands to be the home for mainstream app and game development in web3, supporting NBA TopShot, UFC Strike, and the NFT avatar Genies. Traders, collectors, gamers, and sports enthusiasts, currently, do not have an elegant way to view and display their Flow NFTs to share with others on the web.

With the Flow ecosystem growing, there will be an increasing demand for a central place where users can view their NFTs from all collections and marketplaces inside of Flow, with the end goal of buying and selling on this platform.

A working prototype has been built and is accessible on https://www.myflownfts.com/. Users land on this website, connect their Flow wallet using Blocto and are redirected to a page that hosts all their digital assets. Included below is a list of pain points.

Proposed solution

We will build for you a redesigned and improved My Flow NFTs Web App that will optimize the current front-end, enable URL routing to user wallets and NFTs for increased shareability, and display useful information about the user’s NFTs. This will provide the foundation for future features such as buying, selling, and transferring NFTs.

We will adopt the current tech stack used on the web app, including a React and Tailwind front-end, and Alchemy to pull the user’s NFTs. Figma designs will be provided prior to development. In prioritizing this work, we think that Flow will provide its community with a delightful home for its NFTs and eventually serve as a marketplace/trading platform for Flow users across all its brands.

The following design mockups serve as a starting point for our discussions and what the platform could look like at the end of the project: https://www.figma.com/file/GGZNGVoGMArj9TklEJSNNr/Flow-(DapperLabs)?node-id=5%3A7

image image

Impact

NFTs are being used by games and apps all across the Flow ecosystem and no central platform exists to share, transfer, or sell Flow NFTs on the web. With this in mind, we believe Flow will find success by redesigning and improving the web app to view, interact with, and share a wallet’s NFTs.

Milestones and funding

Milestone Deliverables Timeline Risks USD proposal
1 - Redesign We recommend conducting 3-5 user interviews to better understand how they envision using My Flow NFTs and what their current pain points are. Insights derived from these interviews will go towards designing the optimal UI/UX for users to view wallet NFTs as smoothly as possible. Design low-fi wireframes and collect feedback from Flow designers. Leveraging the Flow design system, the UI/UX designer will mock-up final hi-fi designs and Figma prototypes with all iterations of the optimal user flow, designed to be 100% responsive for all screen sizes. It will be passed onto our Illustrator for any final assets that need to be added. All CSS styling and button logic for the front-end engineer will be included to allow for faster execution. 2 weeks Multiple iterations $4,000
2 - Web-App Development Onboard onto Github repository and Flow tools. Set up development environment. Using the existing web application, rebuild the React and Tailwind frontend to match the designs created in Milestone 1. Set up React Router to provide endpoints for wallets connected with FCL and Alchemy. Use Alchemy NFTs to pull NFTs from Flow wallets. Provide shareable URLs for NFTs. 5 weeks - $15,000
3 - Testing and Optimization Optimize asset loading times by minimizing endpoint response times, caching when needed, and serving assets through a CDN. Refactor code and improve the existing codebase. Test across all web browsers, devices, and screen sizes. 2 weeks - $4,150
4 - Maintenance and QA Maintenance, updates, support, and training. Leftover budget will be allocated here. 2 months - $1,200

image image

Team

Name Role Bio Contact
Lovdeep Singh Technical Product Manager https://linkedin.com/in/lovdeep lovdeep@bld.ai
Christina Li UI/UX Designer https://www.linkedin.com/in/christina-ho-design christina@bld.ai
Francisco Sanz Illustrator - paco@bld.ai
Dandrei Riel Enriquez Frontend Engineer https://ph.linkedin.com/in/dandreienriquez drei@bld.ai
Siahn Pasion Web3 Engineer https://ph.linkedin.com/in/siahnamiel siahn@bld.ai

Bld.ai aspires to create meaningful jobs for millions of people by teaching them to build human-centered products. We believe the future of the blockchain will be home to these workers around the world.

We build, operate, maintain, and support software products for sophisticated enterprise customers and fast-growing tech startups. We employ global teams of Data Scientists, Front-End and Back-End Engineers, and UX/UI Designers in the US, Canada, Europe, Asia, and the Middle East to provide an affordable solution and quick resource availability.

Our team has been building AI software with great UX for 20 years. We have both the academic and practical experience required to manage expectations and focus on the important parts of building web3 products successfully. We deploy nimble teams of 3-7 people to quickly build tools, deploy features and improve functionality. Most importantly, our employees have worked together in the past and operate as full-stack end-to-end teams.

Milestone completion

alxflw commented 2 years ago

thanks for submitting, we'll review and get back to you soon!

lovdeep7 commented 2 years ago

Hi @alxflw and @tyllenb, just checking in if there's an update. Thank you!

alxflw commented 2 years ago

hey @lovdeep7! thanks for checking in. We reviewed the proposal in detail and it was accepted! 🙌

I'll follow up with you via email with next steps!

lovdeep7 commented 2 years ago

Hi all, wanted to share some links with the community.

Current test site: https://myflownfts.vercel.app/ You can also see any Flow wallet’s NFTs by appending the address to: https://myflownfts.vercel.app/owned/
Project Management: You can find our project tracking here: https://github.com/orgs/bld-ai-flow-dapper-labs/projects/1/views/1 GitHub Repo: https://github.com/bld-ai-flow-dapper-labs/myflownfts

Stay tuned for the official launch!