Faraan Shoaib
I turn your vision into an interface people enjoy.
New to Contra
Faraan is building their profile!
Engineering the intersection of industrial heritage and digital precision, this platform for FARAAN Enterprises redefines the 'heavy-duty' experience. Built on a high-performance React architecture and driven by the kinetic power of GSAP and Locomotive Scroll, the interface transforms static data into a fluid, tactile journey.
While this screen capture struggles to keep pace with the raw frame rates—apologies for the slight lag; the site’s physics engine is running faster than the recording software can handle—the live experience is a masterclass in flow efficiency. Every transition, from the architectural staircase reveals to the smooth-scroll inertia, mirrors the precision of our filtration systems. This isn’t just a website; it’s a high-fidelity digital ecosystem built for 25 years of expertise.
0
54
I recently had the pleasure of developing a custom portfolio for video editor Talha Nisar, focusing on a sleek, dark-themed aesthetic that prioritizes visual storytelling. As the Frontend Developer on this project, I translated the brand's identity into a responsive, high-performance web experience, featuring custom animations and a clean, 'audience-focused' layout. Please note that this screen recording may appear a bit laggy or stutter during playback; this is a result of the recording software and not a reflection of the actual site performance. To experience the fluid transitions and full responsiveness of the live site, please visit the link here: https://talha-nisar-q475.vercel.app/ . This project highlights my ability to blend complex design requirements with efficient code to create a professional digital presence for creative professionals.
1
1
37
Built this animated landing page using React, GSAP, Framer Motion, and Locomotive Scroll. The scroll is buttery smooth thanks to Locomotive handling the entire page movement, while GSAP drives the hero text animations with staggered timelines on load. Framer Motion handles all the micro-interactions — hover states, card reveals, and the entrance animations on scroll.
⚠️ Heads up — the preview video is a little laggy from screen recording compression. The live version is completely smooth. Check it out yourself here 👉 https://exo-ape-six.vercel.app/
0
79
Built this dark themed animated landing page using React, GSAP, and Framer Motion. GSAP drives the hero animations with staggered timelines on load, while Framer Motion handles all the scroll-triggered reveals and micro-interactions throughout the page.
⚠️ Heads up — the preview video is a little laggy from screen recording compression. The live version is completely smooth. Check it out yourself here 👉 https://refokus-2.vercel.app/
0
78
Built this animated landing page using React, GSAP, and Framer Motion. GSAP handles the heavy lifting on the hero animations with smooth staggered timelines, while Framer Motion takes care of all the scroll-triggered reveals and micro-interactions throughout the page.
🔗 https://ochi-kappa-navy.vercel.app/
1
89
Built this animated landing page using React, GSAP, and Framer Motion. GSAP handles the hero animations with staggered timelines on load, while Framer Motion takes care of all the scroll-triggered reveals and micro-interactions throughout the page.
⚠️ Preview video is a little laggy from screen recording. The live version runs completely smooth. See it yourself here 👉 https://arock-2.vercel.app/
0
65
A stunning, full-screen website for a global digital design studio featuring cinematic photography, elegant typography, and a clean layout. Built for brands and businesses that create exceptional experiences.
0
85
A bold, dark-themed agency website for a presentation and storytelling studio. Features oversized typography, strong orange accent colors, and a powerful visual hierarchy designed for innovation teams and global brands.
0
88
A sleek, dark-themed creative agency website featuring bold oversized typography, smooth navigation, and a minimal black aesthetic. Designed to showcase work and culture with a modern, high-end feel.
0
81
A bold, dark-themed personal branding website featuring full-screen layout, large typography, and cinematic design. Built with React and styled with a minimal black aesthetic for a high-end creative feel.
0
87