Kalhara JA← All Works
KJA·2024 · Case study
Spreadit Global Platform
Main Business Website & Multi-Portal System
The brief
Frontend build of Spreadit Global's main business website and multi-portal system — authentication flows, dashboards, and account management for both affiliate and main-platform users.
Approach
Built the full frontend — authentication flows, dashboards, and service-category selection — with React Hook Form and Zod for type-safe validation across affiliate and main-platform portals.
Outcome
Delivered a complete, responsive frontend for both platform portals within a one-month freelance engagement (frontend-only scope).
Key features
User Dashboards
User dashboard interfaces for both affiliate and main platform users with navigation to business services and account management
Authentication System
Complete authentication flow including login, signup, forgot password, password reset, and account activation with modern card-based layouts and background imagery
Service Category Selection
Interactive category selection interface with 4 business service categories (Special Sourcing, General Procurement, Pay Supplier, Shipping) featuring card-based selection UI with hover effects for user onboarding
Account Management
Account management pages including account creation success, account activation status, password management, and user status handling with clear messaging and navigation
Type-Safe Form Validation
Client-side form validation using React Hook Form and Zod schemas with real-time error feedback, password visibility toggles, and input field icons
Custom UI Component Library
Built comprehensive reusable UI components using Radix UI primitives including forms, cards, buttons, checkboxes, inputs, labels, separators, and toast notifications
Multi-Portal Support
Support for multiple portals (affiliate and main platform) with shared component library and consistent design system across both portals
Social Authentication UI
Google OAuth button integration in login and signup pages with proper styling and loading states for seamless social login experience
Responsive Design
Fully responsive platform optimized for mobile, tablet, and desktop with adaptive layouts and touch-friendly interactions across all pages
Gallery