# NFT Tap Requirements - Version 1.4 ## Overview NFTap is a decentralized application for peer-to-peer NFT swaps. It offers a user-friendly interface for listing, exploring, and swapping NFTs. It uses smart contracts for secure and trustless transactions and is presented in the form of an interactive dashboard. The idea [sketch](https://excalidraw.com/#json=F9_NTsbwHzYq4h2E4OWdK,RgUxN3t6Ba0JGSQGC7Lquw). ## Pages ### Landing Page ### Main Page * Ideally, all tables/views fit on one page ### Navbar: * Top left corner: * Logo * Top right corner: * Connect button * Network dropdown button * Profile icon * Notification for offers * Notification for accepted NFTs * Light/dark theme toggle ## Views/Tables ### Explore - **Purpose**: To explore NFTs listed by other users and select one or more NFTs to swap with. This is the central view of this App. - **Actions**: - Select desired NFTs, filter in ascending/descending order (age, queue, limit-to). - Selected NFTs (up to 9-10) should be clearly listed in the My Stash view or elsewhere. - **Data Displayed**: - Select checkbox - Image thumbnail - Current owner (address or name) - Queue (number of offered items for this NFT) - Age (how long the item has been listed) - Collection name or address - Limit to (or something smarter)... user can limit which NFT he/she is willing to swap - **View Options**: - Grid - List - (Table. Same as List but with slightly larger thumbnails) ### MyStash - **Purpose**: To view a user's own NFTs which are not listed for trade, and view selected NFTs from the Explore section. - **Actions**: - Scroll through my NFTs - Publicly list my NFT - Offer my NFT for other NFT(s) - **Data Displayed**: - Image of my NFT - Buttons to scroll through my NFTs. It should be clear which one of my NFTs is selected, but it can hint at which image is before and after - Button to publicly list my NFT - Button to offer my NFT for selected NFTs ### Filter - **Purpose**: To filter data on the Explore table. - **Actions**: - Reset filter - **Data Displayed**: - Age range: - Set range metric in hours, days, months - Two-end slider - Queue length: - Two-end slider - Collection: - Select from dropdown (or paste the address) - Checkbox to select only verified collections - Select owner (paste the address) - Button to reset the filter ### My Queue - **Purpose**: To view a user's NFTs that are listed for swap and to see all the offers for those NFTs. - **Actions**: - Unlist: Remove NFT from the list - Accept offered NFT - Reject all offers for one NFT - Reject all offers for all NFTs - **Data Displayed**: - Thumbnail - Offered NFT name - Owner name - Collection name or address - Queue length - My NFT thumbnail - Button Accept - Button Reject (individual) - Button Reject Queue for this NFT - Button Reject all offers - Button to unlist my NFT - **Interaction**: - Modals for all button clicks ### Pending - **Purpose**: To view NFTs the user has offered to others. - **Actions**: - Revoke: Withdraw an offer - **Data Displayed**: - My NFT Thumbnail - Age since offered - Collection address or name - Thumbnail of desired NFT - Button to Revoke my offer - Button to revoke all of my offers ### Leaderboard - **Purpose**: To rank users based on various metrics. - **Ranking Metrics**: - Point = Listed + Offered + Rejected + Accepted*10 - Accepting an action actually executes the swap and is extra rewarded - **Data Displayed**: - App statistics: - Listed - Swapped - Offered - Total users - Monthly active users - Table with columns: - Rank - Username - Points - Listed - Offered - Accepted 10x - Rejected - Row with my stats ## Landing Page - **Purpose**: To start the app and provide information on how it works. - **Actions**: - Start the app - **Data Displayed**: - Logo - App statistics (see Inspiration section) - Title - Subtitle - Illustration - Button to start the app - Infographic - Detailed description of how it works - Contact (Twitter, Telegram) ## Profile Modal - **Purpose**: User needs to set up a name and profile NFT. - **Actions**: - Set up name and profile NFT - **Data Displayed**: - Name (randomize if not entered) - Display the first found NFT, or a default image - Enable scroll through user's NFTs - ## Appearance - Main Theme: Dark Purple or blue - Light Theme - Font [Londrina Solid](https://fonts.google.com/specimen/Londrina+Solid) ## Inspiration * [Dew.gg](https://dew.gg/sell), but with a warmer feel and larger fonts. * [Nouns.wtf](https://nouns.wtf/), for the aesthetic and fonts.