SkillMaarg: Next-Generation EdTech & AI Training Ecosystem
SkillMaarg is an enterprise-grade digital ecosystem currently under intensive development, designed to disrupt the traditional marketing education space. The platform's core mission is to bridge the gap between legacy workflows and AI-driven reality, empowering professionals to achieve 10x productivity and deliver the output of five people.
As the core developer for this project, I am architecting a high-performance, scalable web application using a premium stack consisting of Next.js, React, TypeScript, and custom CSS Modules, deployed via Vercel. I am responsible for migrating the brand from a generic template-based infrastructure to a fully custom, programmatic environment. Currently, I have successfully engineered the highly optimized, high-conversion Home and About pages, establishing a striking neo-brutalist design system with dynamic micro-animations and "Thumb-First" mobile architecture designed specifically for high-intent social traffic.
This is a massive, multi-phase project with a highly sophisticated backend and third-party integration roadmap. The comprehensive architecture that I am responsible for implementing includes:
Custom LMS & Authentication: Building a secure student portal (training.skillmaarg.com (http://training.skillmaarg.com)) featuring frictionless, OTP-based passwordless login for accessing premium course materials and recordings.
E-Commerce & Payment Architecture: Integrating the PayU payment gateway for a seamless checkout experience. This includes engineering a custom cart system for modular "Bite-Sized Skills" that utilizes intelligent UI triggers for dynamic, bundled upselling.
Enterprise CRM Integration: Developing direct API connections with CRMs like Meritto and LeadSquared for automated lead routing, pipeline management, and dynamic source attribution based on entry points.
AIO (Agentic AI Optimization) & Technical SEO: Engineering the site architecture to be readable by both humans and LLMs. This involves implementing extensive Schema.org (http://Schema.org) and JSON-LD markup to optimize the platform for Generative Engine Optimization (GEO) and AI crawlers like ChatGPT and Perplexity.
Advanced Tracking & Analytics: Integrating a robust data layer using Google Analytics 4 (GA4) and Meta Pixel with custom event tracking for precise user journey mapping.
SkillMaarg represents a major architectural undertaking. It showcases my ability to build complex, scalable educational platforms from scratch—combining premium, conversion-focused UI/UX with deep third-party integrations, automated business logic, and forward-thinking technical strategies.
0
11
Project Overview
I engineered a premium, high-conversion landing page for NickArt Productions' "iPhone Reel Masterclass". The objective was to build a digital experience that matched the high-end, cinematic quality of the filmmaking course itself, ultimately driving sign-ups and waitlist captures.
What I Built & Key Highlights:
• Cinematic UI/UX: Designed and developed a custom dark-mode aesthetic featuring WebGL-powered dynamic backgrounds, subtle grain overlays, and glassmorphism components to create a truly immersive, premium feel.
• Fluid Interactivity: Implemented buttery-smooth scrolling (via Lenis) and complex, scroll-triggered micro-animations (via Framer Motion) to keep users engaged as they navigate the curriculum and student testimonials.
• Conversion-Optimized Architecture: Structured the page to guide users through a compelling narrative—from a high-impact hero section to interactive "Bento Grid" feature showcases, before-and-after sliders, and dynamic student success galleries.
• Agile Lifecycle Management: Successfully adapted the platform's state from an active "Buy Now" checkout flow to a highly optimized "Coming Soon" waitlist capture, ensuring continuous lead generation between course cohorts.
The Tech Stack:
Built from the ground up for blazing-fast performance using bleeding-edge web technologies: React 19, TypeScript, Vite, Tailwind CSS v4, Framer Motion and OGL (WebGL).
1
18
OranGenz is a premium, bespoke full-stack e-commerce platform I engineered from the ground up for a brand specializing in 3D-printed lighting and décor. Moving away from generic SaaS builders like Shopify, I architected a custom digital storefront designed to drive serious revenue through a jaw-dropping UI and enterprise-grade performance.
The Tech Stack:
Next.js 16 (App Router), React 19, TypeScript, Supabase (PostgreSQL), Tailwind CSS v4, Framer Motion, Three.js, Razorpay, Upstash Redis, Zod, and PostHog.
The Visual Experience:
I engineered an immersive "Gen-Z" aesthetic heavily focused on high conversion. The frontend features custom WebGL shaders (Three.js), complex scroll-linked parallax animations (Framer Motion), physics-based smooth scrolling (Lenis), and a sleek dark-mode glassmorphism design hand-crafted with Tailwind.
The Powerhouse Backend:
Built to handle high traffic and secure transactions without breaking a sweat. I architected the database schema using Supabase, utilizing strict Row Level Security (RLS) and custom PostgreSQL RPCs (Stored Procedures) for atomic, real-time inventory tracking to completely eliminate the risk of overselling during product drops.
Enterprise Security & Payments:
I integrated a frictionless custom checkout flow via Razorpay. The server backend is secured with Upstash Redis rate-limiting to protect against DDoS/abuse and strict runtime payload validation using Zod.
Status: Active Development:
Note: This project is currently a Work-In-Progress (WIP). While the core architecture and premium aesthetics are established, I am continuously polishing features, optimizing edge-case performance, and squashing bugs as we iterate toward the final production launch.
0
34
Skillmaarg: A Next-Generation EdTech Platform & Lead Automation System
Skillmaarg is a premium, high-conversion landing page designed to elevate the educational platform experience. My goal for this project was to move away from static templates and engineer a system that is visually stunning on the frontend, while fully automated on the backend.
What I Built: • Premium UI/UX: Developed a sleek, fully responsive frontend using Next.js 16 and React 19, with a highly scalable component architecture using Tailwind CSS v4 and customized Shadcn UI. • Advanced Animations: Engineered complex, buttery-smooth micro-interactions and scroll animations using Framer Motion and Lenis (for seamless smooth scrolling). • Robust Backend: Integrated Supabase for secure database management and Upstash Redis for API rate-limiting to prevent spam. • End-to-End Business Automation: Designed and implemented a seamless lead-capture pipeline. When a user submits a form, the data is securely stored in Supabase and instantly routed via Make.com (http://Make.com) Webhooks directly into a Google Sheets CRM for the sales team—zero manual data entry required.
The result is a lightning-fast, visually dynamic landing page that not only grabs user attention but operates as a fully automated lead-generation engine.