Blockhead: The HackMoney DeFi Update

Blockhead is now on Gitcoin Grants! Help Blockhead become the single best user experience for viewing and interacting with crypto assets. https://gitcoin.co/grants/2966/blockhead

I'm a front-end developer on a mission to build the best interface for viewing and interacting with crypto assets of all forms! For ETHGlobal Hack Money 2021, I've chosen to update Blockhead (my crypto portfolio/explorer interface) with some new features focused around DeFi apps.

(Catch up on Blockhead's existing features by watching my demo from ETHGlobal Scaling Ethereum: https://showcase.ethglobal.co/scaling/blockhead-crypto-portfolio-and-explorer)

Blockhead is a user-friendly interface for tracking, visualizing and exploring your blockchain assets.

• Track all your crypto holdings. Connect your wallets and see your tokens, DeFi balances and NFTs in one place.
• Visualize your crypto activity. See your transactions in new ways through interactive charts and visualizations.
• Explore the Ethereum Multiverse. Browse blockchain transactions and statistics for any EVM compatible chain!

Blockhead: The HackMoney DeFi Update

New features:

• Added a new "DeFi Apps" view with a dedicated dashboard for several DeFi/smart contract apps showing token balances, metadata, price information, and more.

  • Each dashboard is generated from a declaratively defined configuration file. A single DeFi app dashboard can contain multiple "views". A view is defined as an EVM-compatible chain associated with ERC-20 token metadata, NFT/smart contract addresses, and mappings to several data providers including the Zapper API, Zerion DeFi SDK, and subgraphs from The Graph. (Also, lots of aesthetically-pleasing but tediously-sourced color samples 😛)

  • For ultimate transparency, data providers, chains and other metadata are clearly labeled throughout the interface.

• In the "Portfolio" view, clicking the title of any of the DeFi balances in your accounts takes you to the appropriate "DeFi Apps" view.

• In the Preferences at the bottom of the interface, you can now toggle between the Zapper API and the Zerion DeFi SDK for fetching DeFi balances on the "Portfolio" and "DeFi Apps" views. Both solutions cover different DeFi protocols and present different tradeoffs in accuracy, detail, speed, privacy and decentralization, so it's important that users have a choice!

• Also in the Preferences at the bottom, you can now choose your preferred Ethereum JSON-RPC provider for fetching on-chain data, including Infura. You can also pick the "default" ethers.js provider which compares responses from multiple providers for maximum accuracy. Each solution presents different tradeoffs in accuracy, detail, speed, privacy and decentralization; I'm letting you the user stay in control, which is uncommon for most dApps!

Some details about specific integrations:

• For the Liquity protocol, I started porting the reference React frontend to Svelte to be integrated in the Liquity "DeFi Apps" dashboard (thus making Blockhead a Liquity Frontend Operator). The integration is taking a lot longer than anticipated, so for the demo I've simply embedded some existing Liquity frontends I like.

• For Connext, I also started porting the reference React widget to Svelte to enable cross-chain transfers powered by the Connext browser node/Vector SDK. Since users already have their wallets connected in the "Portfolio" view, I hope to make a seamless user experience when it comes to picking wallets/networks to participate in a state channel.

• Depending on the situation, the current price of an ERC-20 token can be taken from either an off-chain source (such as Zapper or Covalent) or an on-chain oracle (such as Chainlink, Tellor, or Umbrella), in which case the appropriate API call is routed through the user's preferred Ethereum JSON-RPC provider (such as Infura).

• For any DeFi dashboard which has a mapping to a subgraph on The Graph, I've embedded a GraphiQL explorer. The possibilities for visualizations are infinite here - you can expect to see dedicated visualizations based on subgraph data in the future!

• The Explorer view relies on the Covalent API which provides decoded event logs for all transactions. As such, interactions with tokens or contracts from known DeFi apps are accordingly color-coded and link to the dedicated dashboard view in "DeFi Apps". This works even if it's one step in a big transaction with many steps, like a flash loan or a 1inch trade! Expect the "Explorer" and "DeFi Apps" views to be even more tightly integrated in the future.

What's next?

Blockhead is my ambitious attempt to make the most flexible, transparent, educational, user-friendly, privacy-friendly and data-agnostic user interface for the decentralized digital world. Here are a few features I'm planning to add:

• Rich visualizations for common DeFi interactions like staking, liquidity mining, minting, burning, continuous transfers, and transfers between wallets/chains

• Fully decentralized web hosting

• Web 3.0 identity/DID integrations

• Support for other EVM-based blockchains/sidechains/layer-2s

• Native mobile/desktop versions

• Suggestions are welcome!

Check out the future roadmap, suggest features, and support Blockhead on Gitcoin Grants!

https://gitcoin.co/grants/2966/blockhead

You can contribute any amount to support development of new features and help Blockhead become the single best user experience for viewing and interacting with crypto assets, no matter what chain they're on or what form they take. With Gitcoin's Quadratic funding mechanism, even the smallest amount counts! (Perhaps I'll do a special NFT drop for early supporters!) Thanks for your support!

Finally, if you know of grant programs or other opportunities that can help take Blockhead further, please feel free to reach out!

• Email: [email protected]

• Twitter: https://twitter.com/0xblockhead