Web Architecture

Zantrra: Escrow-Protected Commerce

Zantrra: Interactive Landing Page & Escrow Platform Simulation

Client

Moe

Duration

15 Days

Services

Lead Frontend Engineer

New project visualization mockup
Gallery 0
Gallery 1
Gallery 2
Gallery 3
Gallery 4
Gallery 5
Gallery 6
Gallery 7
Gallery 8
Gallery 9
Gallery 0
Gallery 1
Gallery 2
Gallery 3
Gallery 4
Gallery 5
Gallery 6
Gallery 7
Gallery 8
Gallery 9
Gallery 0
Gallery 1
Gallery 2
Gallery 3
Gallery 4
Gallery 5
Gallery 6
Gallery 7
Gallery 8
Gallery 9
Gallery 0
Gallery 1
Gallery 2
Gallery 3
Gallery 4
Gallery 5
Gallery 6
Gallery 7
Gallery 8
Gallery 9
Gallery 0
Gallery 1
Gallery 2
Gallery 3
Gallery 4
Gallery 5
Gallery 6
Gallery 7
Gallery 8
Gallery 9
Gallery 0
Gallery 1
Gallery 2
Gallery 3
Gallery 4
Gallery 5
Gallery 6
Gallery 7
Gallery 8
Gallery 9
Gallery 0
Gallery 1
Gallery 2
Gallery 3
Gallery 4
Gallery 5
Gallery 6
Gallery 7
Gallery 8
Gallery 9
Gallery 0
Gallery 1
Gallery 2
Gallery 3
Gallery 4
Gallery 5
Gallery 6
Gallery 7
Gallery 8
Gallery 9
Gallery 0
Gallery 1
Gallery 2
Gallery 3
Gallery 4
Gallery 5
Gallery 6
Gallery 7
Gallery 0
Gallery 1
Gallery 2
Gallery 3
Gallery 4
Gallery 5
Gallery 6
Gallery 7
Gallery 0
Gallery 1
Gallery 2
Gallery 3
Gallery 4
Gallery 5
Gallery 6
Gallery 7
Gallery 0
Gallery 1
Gallery 2
Gallery 3
Gallery 4
Gallery 5
Gallery 6
Gallery 7

Project Milestone Metric

Key outcome delivered by the end of project lifecycle.

Result Metrics

Delivered 10x ROI

The Challenge

Africa's rapidly growing e-commerce market faces a massive barrier: a lack of trust. Buyers are afraid to pay upfront due to fraud, while vendors risk providing services without guaranteed payment. The client needed a compelling, high-fidelity platform to visually and interactively demonstrate their complex escrow trust infrastructure to investors and early adopters—without relying on a live, heavy backend infrastructure.

Our Solution

I engineered a premium, interactive Next.js landing page and simulated application environment. By leveraging Zustand for complex client-side state management and Framer Motion for immersive 2.5D animations, I created a seamless "Demo" experience. Users can actively switch between Buyer and Seller roles, post service bids, lock funds in escrow, and complete transactions using a 6-digit cryptographic code—experiencing the platform's value proposition in real-time.

Deliverables

Key Features Built.

01

Real-time Synchronization

Instant data transmission layer communicating with edge nodes seamlessly.

02

Interactive Escrow State Machine

Developed a robust client-side state engine simulating the entire transaction lifecycle (Idle -> Bidding -> Locked -> Delivered -> Released -> Withdrawn) without backend latency.

03

Dual-Role Marketplace Simulator

Built seamless role-switching components (DemoBuyerTab and DemoSellerTab) allowing users to test both ends of the marketplace interactively.

04

Advanced Motion UI

Implemented premium 2.5D interface elements, glassmorphism effects, staggered list animations, and floating architectural elements using Framer Motion.

05

Dynamic Financial Formatting

Integrated logic to handle and display dual-currency pricing (e.g., GNF and USD equivalents) with automatic 2% platform fee calculations.

Measurable Impact

Every system we engineer is measured against production performance, efficiency gains, and user metrics that matter to businesses.

Delivered project 2 weeks ahead of scheduled deadline.

Increased search impressions by 150% in first month.

Sub-200ms API response latency across global edge nodes.

Technology Stack

Next.jsFrontend DevelopmentTailwind CSSFramer Motion (Animation)State Management (Zustand)

Up Next

Pro Mart System

Click below to explore our next production case study.