Designing a DePIN Management Platform

Full application design for ZenthorHub — a comprehensive hub for decentralised physical infrastructure

ZenthorHub is a management platform for Decentralised Physical Infrastructure Networks (DePIN) — the emerging layer of blockchain-powered services covering compute, storage, energy, and connectivity. Users need to discover networks, compare options, deploy infrastructure, stake tokens, and learn — all from a single interface.

The design challenge was scope: this isn't one product, it's an ecosystem. Each DePIN network has different configuration requirements (IoT devices vs. GPU compute vs. energy vs. storage), and the platform needed to handle all of them without creating a separate flow for each. The interface had to feel unified while adapting intelligently to context.

10 screens designed Dashboard, network discovery, adaptive deploy flows, staking, and education — all in a cohesive dark-theme system

The visual system

ZenthorHub operates in the Web3 space, where dark interfaces are the norm. But rather than defaulting to the usual dark-mode patterns, the design introduces subtle depth through glass-morphism effects, gradient borders, and floating particle elements that give the interface a sense of dimensionality.

Dark with depth. The background isn't flat black — it uses deep navy-to-dark gradients with subtle atmospheric lighting effects. Cards and panels float above the surface with translucent borders and soft glows, creating visual hierarchy without relying on heavy shadows.

Green as the accent. A vibrant green-to-teal gradient serves as the primary accent — used for active navigation states, CTAs, wallet connection indicators, and data highlights. It ties the interface to ideas of growth and sustainability that underpin the DePIN ecosystem.

ZenthorHub dashboard — welcome screen with DePIN network aggregation carousel, wallet connection panel, popular networks with interactive icons, and recent activity feed

Dashboard

The dashboard is the entry point after wallet connection. It surfaces three things: an introduction to the platform's aggregation capabilities, a quick-access panel for popular DePIN networks (Arweave, Akash, Render, Filecoin), and a sidebar showing recent activity and notifications. The popular networks section uses interactive icon buttons — hovering reveals the network's description and a direct action link.


Network discovery

The Discover page is where users evaluate and compare DePIN networks. A search bar with category filters (network type, consensus mechanism, pricing model) sits at the top. Below, a featured networks table presents key metrics — TPS, latency, uptime, node distribution — with inline deploy buttons and comparison checkboxes.

The right sidebar provides filter-by-criteria tags (popularity, scalability, security, cost-effectiveness) and user reviews with star ratings. A custom comparison section at the bottom lets users build their own side-by-side evaluations. The browse-by-category panel offers curated lists like "High Performance" for users who want guided discovery.

ZenthorHub Discover page — search and filter bar, featured networks comparison table with TPS/latency/uptime metrics, user reviews sidebar, custom comparison builder, and browse-by-category panel

Adaptive deploy flows

This was the most complex UX challenge. Deploying to an IoT network requires completely different inputs than deploying compute or storage infrastructure. Rather than building five separate flows, the design uses a single deploy page structure that adapts its configuration sections based on the selected network.

The layout stays consistent: network selector at top, personal details, then configuration sections, then budget and payment. But the configuration sections themselves change entirely — IoT asks about device type and data frequency; compute asks about GPU model, RAM, and scaling; storage asks about replication factors and encryption; energy asks about energy type and kWh requirements.

A persistent cost estimator sits in the right sidebar throughout, updating as users make selections. This gives immediate feedback on how each configuration choice affects pricing — preventing surprises at checkout.

Deploy flow for IOTA — IoT device configuration with data type, frequency, network usage, and budget sections alongside cost estimator Deploy flow for Internet Computer — compute configuration with GPU model, storage, RAM, duration, network requirements, and scaling options

Staking and rewards

The staking page lets users lock ZHUB tokens to earn rewards. The interface is split into an action panel (stake amount, lock-up period, terms acceptance) and informational panels (staking history, "Why Staking?" explainer). Below, reward tiers are presented with clear APY rates and a calculator that lets users model returns before committing.

ZenthorHub staking page — stake ZHUB panel with amount input and lock-up period, staking history, rewards tiers with APY rates, and interactive rewards calculator

Learn and earn

The final section combines education with support. A knowledge centre surfaces curated blog content from DePIN network partners (Filecoin, Akash), while the support section provides direct contact channels and an FAQ addressing common questions about staking, node operation, and token management.

ZenthorHub Learn and Earn page — knowledge centre with partner blog cards, customer support contact details, and FAQ accordion

What was delivered

  • 10 screens covering dashboard, network discovery, deploy, staking, and education
  • Adaptive deploy flow system — one structure, five network-specific configurations
  • Dark-theme design system with glass-morphism, gradient accents, and atmospheric depth
  • Real-time cost estimation pattern for deploy flows
  • Network comparison and discovery tools with filtering, reviews, and category browsing

Complex platforms need
clear design.

If you're building a platform that needs to feel simple despite being anything but — let's talk.

Get in touch