TL;DR
Every NFT trader and degen has a long history of aping in, being too late and selling just at the correct time. What if you can see the history of your NFT wallet, in a simple and beautiful way? Non-Fungible Timeline does exactly that. See the lifetime of your wallet in NFT mints, buys and sales. The tool gives users the chance to trace their steps through their NFT journey.
Introduction
Anyone can search through Etherscan and see the history and transactions of a wallet or token. But it's clunky, not user-friendly, and to really see it, involves a-lot of extra tabs open. We want to simplify and create an all-in-one experience, that is fun and engaging to use.
By designing the simplest interface with a strong and fast backend we can deliver a new web3 experience. There are many extra features that could be incorporated into NFTimeline and ways to expand it, of which we will look over in this paper.
Design
The design is going to be the biggest hurdle. It needs to be fast, intuitive and fun. At first thoughts, a traditional vertical timeline is the simplest to create. On each side of the line, left being incoming and right being outgoing, would be small cards with a thumbnail of the NFT (if multiple it’ll show just the first). On interacting it would open a modal showing all of the transactions within that day/hash (more on that later). There will be other quiet items added here like links to Etherscan and Opensean.
With a very active wallet, there will be lots and lots of transactions to visualise. This will need two things to need to be decided.
1) A decision on how the data is grouped. This can be done in a few ways. It can utilise a couple of onChain metadata points - block number or transaction hash. Grouping by block number will have fewer outputs than by hash, as a user couple has 2 transactions in the same block. But grouping by block number can also create to many entries. This could be resolved by grouping by day, a little more work and might be a bit slower than the other two, but should create a less cluttered UI.
2) Can you only see the timeline of the connected wallet, is it fully open or is there a space in the middle with wallets able to publicise their timeline if they wish?
Heres a VERY basic figma of how this could look.
Technology
To build this we will initially utilise 3rd party APIs to accelerate development and increase reliability. The Alchemy API and also Block Daemon API will work perfect for this project. Once a wallet address has been provided the backend will search for ERC721 & ERC1155 transaction from block 0 (this can be moved forward to represent ~jan 2017, importing them in batches, batch size will have to depend on UI/UX design & screen size.
Once we have the wallets transactions we can sort buy from sells (by comparing the from & to address with the known NFT exchange routers), get the mints and burns (to and from the zero address) and then the rest are transfers or OTC.
There is a lot of sorting and data fetching involved in this process, working out the middle ground batch size so that it loads fast but also doesn’t have to load every 2 seconds is going to be key.
Once we are established we can look into creating our own purpose built and more efficient system for getting the onChain data and sorting it.
Future Features
The basic MVP of NFTimeline is the simple visualisation of your NFT life. No thrills, just beautifully designed and flowing tool. But what else could be implemented to make it enhance the users life even more?
- Price Tracking of sale
- Rarity tracking
- Project data & links
- NFTimeline for a single Token or Contract
- Social Element (commenting/rating)
- If it is locked to wallet only with a ‘make public’ function. There can then be social game of voting for your favorite/the worst/the best timeline. Users can use their wallet to sign a message and place their ‘like’.
Check List
Write Lite Paper
Draw Basic Figma
Detailed Feature Map
Setup Repo
Write API fetchers
Write Design & Branding doc
Write Sorting Code
Figma Design V2
Working Prototype/Alpha
External Feedback
MVP Finished
Add extra features
Spy List
Voting
Voting Sujestions
Public Launch
Lite Paper
you’re reading it
Basic Figma
- Very first thoughts of what an MPV might look like
Setup Repo
- inital repo has been made