DeFi Cosmos

Problem Statement

DeFi Cosmos is a real-time DeFi analytics dashboard that transforms complex blockchain data into an intuitive 3D solar system visualization, where protocols orbit around Ethereum like planets around the sun. Unlike traditional dashboards that present isolated metrics in static tables, DeFi Cosmos reveals the invisible connections and capital flows between protocols in real-time. The platform tracks four major DeFi protocols - Uniswap V4, Aave V3, Lido, and Curve Finance. Each protocol is represented as a planet whose size reflects its Total Value Locked (TVL), orbital speed indicates transaction velocity (TPS), and color represents protocol health, creating an immediately understandable visual metaphor that makes DeFi accessible to both newcomers and experts.Beyond visualizations, DeFi Cosmos also delivers insights through eight core features: a live activity feed with whale detection (transactions >100 ETH), protocol health monitoring with multi-factor risk assessment, user activity analytics with 24-hour heatmaps, and comprehensive transaction tracking across all protocols. Users can track whale movements, analyze protocol adoption patterns, compare TVL and volume metrics, and monitor health scores that aggregate utilization rates, TVL changes, whale exits, and gas spikes into a single 0-100 score. The interactive 3D cosmos allows users to click planets for detailed statistics, watch animated particles representing capital flows, and explore the DeFi ecosystem through an engaging spatial interface.Key Features3D Solar System Visualization: Interactive cosmos with protocols as planetsReal-Time Data: 2-5 second updates via Envio HyperSync + HyperIndexLive Activity Feed: Transaction stream with whale detection (>100 ETH)Protocol Health Monitoring: Multi-factor risk assessment (0-100 scores)User Analytics: 24-hour activity heatmaps and retention trackingWhale Tracking: Pattern detection (accumulator, farmer, arbitrageur)Cross-Protocol Analysis: Compare TVL, volume, TPS across 4 protocolsProduction Deployment: Envio hosted backend + Vercel frontend

Solution

DeFi Cosmos is made possible entirely using data fetched with Envio. No external APIs have been used.BackendEnvio HyperSync: Real-time blockchain data retrievalEnvio HyperIndex: Event indexing with auto-generated GraphQL APIHasura GraphQL engineData layerGraphQL + SWR: SWR Polling Instead of WebSocket. Combined with React Query-style cache invalidation, this feels as real-time as WebSocket but with much simpler code and better error handling.FrontendNext.jsThree.js + React Three Fiber: 3D visualisationRecharts (2D charts)shadcn/ui (components)Tailwind CSS (styling)Framer Motion (animations)Infrastructure:Envio Hosted Service (indexer)Vercel (frontend)Protocols Tracked:Uniswap V3 (Trading)Aave V3 (Lending/Borrowing)Curve Finance (Stablecoin swaps)Lido (Liquid staking)