verified Design & Implementation Showcase

The Yakin Zakat Solution

From initial concept drawings to high-fidelity Figma prototypes and the final implemented product. Explore the lifecycle of our university Zakat management platform.

Phase 1: Initial UI

Figma High-Fidelity Mockups

Translating conceptual wireframes into a modern digital interface. We established a cohesive design system with accessible type contrast, Islamic geometric cues, and clear transaction cards.

Figma Mockups: Gold and Agriculture Zakat Calculators

Gold & Agriculture Zakat Calculators

High-fidelity mobile designs for specialized zakat categories, showing step-by-step calculation steps for Zakat Emas (gold) and Zakat Tani (agriculture).

Figma Mockups: Payer Dashboard, Verification, and Distribution Tracker

Payer Dashboard & Distribution Tracker

Mobile screen layouts for the payer's landing dashboard, verification and pledging flow, profile, contribution history, and real-time distribution tracking map.

Phase 2: Prototype

Implemented Product Results

The final working build. Combining secure backend services with high-performance front-end templates to deliver absolute clarity, real-time auditability, and ease of use.

Result: Interface Screen 1

Zakat Payer Dashboard

Main dashboard for zakat payers to view their zakat information and manage their donations.

Result: Interface Screen 2

Zakat Category Calculator Tools

Payer interface featuring automated calculation tools for different categories of Zakat.

Result: Interface Screen 3

Granular Impact Tracker

Direct link illustrating proof of distribution down to individual Asnaf aid packages.