Web Design Projects in SialkotWeb Design Projects in SialkotARC — Clothing Ecommerce with Live AR Try-On
Ecommerce clothing site with a real, browser-based AR fit preview — no app required.
ARC is a premium ecommerce concept designed to redefine online fashion shopping through an interactive, browser-based AR experience. Instead of relying on a mobile application or simulated mockups, shoppers can preview garments on themselves directly from their web browser using their device's camera.
The Live AR Fit Preview allows users to grant camera access, place garments over their live video feed, and adjust the fit by dragging, resizing, and rotating the clothing in real time. Once satisfied, they can capture and download a preview image directly from the browser. All image processing happens locally on the user's device, ensuring privacy and fast performance.
Beyond the AR functionality, ARC delivers a complete modern ecommerce experience with beautifully designed product pages, detailed fabric and care information, persistent shopping cart functionality, smooth page transitions, and responsive layouts across desktop, tablet, and mobile devices. The homepage also features a 3D rotating product carousel built with React Three Fiber to showcase products in an engaging way.
Highlights
• Live browser-based AR clothing preview using WebRTC
• Real-time drag, resize, and rotate garment controls
• Canvas-based image capture and download
• Privacy-first client-side image processing
• Interactive 3D product carousel
• Dynamic product pages with size and color selection
• Persistent shopping cart using React Context & localStorage
• Slide-out shopping bag drawer
• Demo checkout experience
• 17 fully responsive statically generated pages
• Modern animations and premium user experience
Tech Stack
Next.js 14 (App Router)
TypeScript
Tailwind CSS
Framer Motion:
React Three Fiber
drei
WebRTC (getUserMedia)
Canvas API
ARC demonstrates how modern web technologies can deliver immersive shopping experiences directly in the browser—combining performance, interactivity, and elegant UI into a seamless fashion ecommerce platform. AI-Powered Lead Automation Website for a Real Estate AI Startup
Built a full marketing site for a startup selling AI voice + chat automation to real estate agencies — the kind of project where the design had to sell "AI that never sleeps" before a single line of copy did.
The challenge:
The client's pitch was simple but the proof had to be visual: leads get missed after hours, after open homes, and in cold databases — and their AI catches all three. The site needed to feel alive — like the AI was actually running in the background — not just describe automation with a static hero image.
What I built:
A dark, glass-morphic hero with a live animated 3D AI avatar (Three.js) that reacts and pulses, paired with a custom cursor and magnetic buttons for a premium, "always-on" feel
Animated counters and a scrolling proof ticker (GSAP + ScrollTrigger) that reveal results and capabilities as you scroll, instead of dumping everything above the fold
A "Problem" section built around four real numbered failure points agencies actually experience (late-night enquiries, open-home follow-up, vendor nurture, database reactivation) — each paired with how the AI solves it
A live embedded chat bot demo panel plus a placeholder for a voice bot demo, so prospects could try the product instead of reading about it
A 4-step "how it works" process timeline and a results section translating automation into business outcomes (more appraisals, faster response time, always-on coverage)
Full mobile responsiveness and a booking-call CTA wired straight into their CRM funnel
Stack: Semantic HTML5 with a token-based CSS architecture (custom properties, fluid typography, CSS Grid) for a maintainable design system; GSAP + ScrollTrigger driving the scroll-based motion; Three.js/WebGL powering the real-time 3D avatar; vanilla ES6+ for interaction logic (no framework overhead); integrated with a CRM booking API for lead capture and routing.
The result: A site that doesn't just claim "AI that never misses a lead" — it demonstrates it, from the first scroll to the live chat demo, giving the client a genuinely differentiated landing page in a market full of templated agency sites. I designed and developed a fully responsive 3D vertical-scroll website experience for a local business, focused on creating a more cinematic and premium way to present the brand online.
The project included the complete website build, responsive layout for desktop and mobile, immersive scroll-based visual sections, deployment, hosting setup, and domain connection.
My goal was to go beyond a standard business website and create an interactive experience that feels modern, high-end, and memorable while still keeping the site practical and easy to navigate.
This project demonstrates my work in 3D web experiences, responsive website development, deployment, hosting, and domain setup. 
