// ============================================ // PIXELPULSE — Section components // ============================================ const { useState: useStateS, useEffect: useEffectS, useRef: useRefS } = React; // ===== HERO ===== function Hero() { const targetRef = useRefS(null); useEffectS(() => { const onScroll = () => { if (!targetRef.current) return; const y = window.scrollY; targetRef.current.style.transform = `translateY(calc(-50% + ${y * 0.15}px))`; }; window.addEventListener('scroll', onScroll); return () => window.removeEventListener('scroll', onScroll); }, []); return (
{/* Concentric circles */} {/* Crosshair */} {/* Pixel cluster */} {/* Tick marks around outer ring */} {Array.from({ length: 24 }).map((_, i) => { const angle = (i / 24) * Math.PI * 2; const x1 = 350 + Math.cos(angle) * 320; const y1 = 350 + Math.sin(angle) * 320; const x2 = 350 + Math.cos(angle) * 330; const y2 = 350 + Math.sin(angle) * 330; return ; })}
[ EST. 2023 / SURAT, GUJARAT — INDIA ]

Mobile
apps that
actually  pulse.

Explore services → Start a project ↗
[ What we build ]
Native iOS & Android apps. Cross-platform builds in Flutter, React Native, Swift & Kotlin — engineered to ship fast and scale further.
[ Available for ]
Startups, SMBs and enterprise teams · Full-cycle product development
Scroll
02 ↓
); } // ===== Marquee ===== function Marquee() { const stack = ['iOS', 'Android', 'Flutter', 'React Native', 'Swift', 'Kotlin', 'Firebase', 'Node.js', 'AWS', 'GraphQL', 'TypeScript', 'Figma']; return (
{[...stack, ...stack].map((s, i) => ( {s} ))}
); } // ===== Services ===== const SERVICES = [ { num: '01', title: 'Native iOS Development', desc: 'Swift & SwiftUI apps engineered for iPhone and iPad. App Store-ready, performance-tuned, beautifully native.', tags: ['Swift', 'SwiftUI', 'Combine', 'Core Data'], icon: ( ), }, { num: '02', title: 'Android Development', desc: 'Kotlin and Jetpack Compose builds for the entire Android ecosystem — phones, tablets, foldables, wear.', tags: ['Kotlin', 'Compose', 'Coroutines', 'Material 3'], icon: ( ), }, { num: '03', title: 'Cross-Platform', desc: 'One codebase, two stores. Flutter & React Native apps with native-grade UX and shared business logic.', tags: ['Flutter', 'React Native', 'Dart', 'Expo'], icon: ( ), }, { num: '04', title: 'UI / UX Design', desc: 'Research-backed flows, polished interfaces, and design systems that make your product feel inevitable.', tags: ['Figma', 'Prototyping', 'Design System', 'Research'], icon: ( ), }, { num: '05', title: 'Backend & API', desc: 'Scalable Node, Firebase and cloud back-ends. Auth, payments, push, real-time — wired to ship.', tags: ['Node.js', 'Firebase', 'AWS', 'GraphQL'], icon: ( ), }, { num: '06', title: 'MVP & Product Strategy', desc: 'From idea to launch in weeks, not months. We help startups validate, scope, build, and ship the right thing.', tags: ['Discovery', 'Roadmap', 'Sprint 0', 'Launch'], icon: ( ), }, ]; function Services() { return (
[ 02 / SERVICES ]

Engineered
for the App Store.

We build mobile-first products end to end — from the first wireframe to the day-one launch. Every platform, every framework, every milestone owned in-house.

{SERVICES.map((s, i) => (
[ {s.num} ]
{s.icon}

{s.title}

{s.desc}

{s.tags.map((t) => {t})}
↗
 ))}
); } // ===== Pulse Waveform ===== function PulseWaveform() { const canvasRef = useRefS(null); const [active, setActive] = useStateS(0); const items = [ { num: '01', name: 'Native iOS', amp: 1.0 }, { num: '02', name: 'Android', amp: 1.4 }, { num: '03', name: 'Cross-Platform', amp: 0.7 }, { num: '04', name: 'UI / UX', amp: 1.2 }, { num: '05', name: 'Backend', amp: 0.9 }, { num: '06', name: 'MVP Strategy', amp: 1.6 }, { num: '07', name: 'QA & Testing', amp: 0.6 }, { num: '08', name: 'Launch & Maintain', amp: 1.1 }, ]; useEffectS(() => { const canvas = canvasRef.current; if (!canvas) return; const ctx = canvas.getContext('2d'); let raf; const resize = () => { const dpr = window.devicePixelRatio || 1; canvas.width = canvas.offsetWidth * dpr; canvas.height = canvas.offsetHeight * dpr; ctx.scale(dpr, dpr); }; resize(); let t = 0; const draw = () => { const w = canvas.offsetWidth; const h = canvas.offsetHeight; ctx.clearRect(0, 0, w, h); const amp = items[active].amp; // Multiple wave layers for (let layer = 0; layer < 3; layer++) { ctx.beginPath(); const layerAmp = amp * (1 - layer * 0.25); const offset = layer * 8; ctx.strokeStyle = layer === 0 ? '#F78F1E' : `rgba(247, 143, 30, ${0.3 - layer * 0.1})`; ctx.lineWidth = layer === 0 ? 2 : 1; for (let x = 0; x <= w; x += 2) { const px = x / w; // Bell-curve envelope so the pulse is centered const envelope = Math.sin(px * Math.PI); const y = h / 2 + Math.sin(px * 8 + t * 0.04) * 30 * layerAmp * envelope + Math.sin(px * 16 + t * 0.07) * 18 * layerAmp * envelope + Math.sin(px * 32 + t * 0.05) * 8 * layerAmp * envelope + offset; if (x === 0) ctx.moveTo(x, y); else ctx.lineTo(x, y); } ctx.stroke(); } // Tick marks underneath ctx.strokeStyle = 'rgba(255,255,255,0.1)'; ctx.lineWidth = 1; for (let i = 0; i < 40; i++) { const x = (i / 40) * w; const len = i % 5 === 0 ? 12 : 6; ctx.beginPath(); ctx.moveTo(x, h - 4); ctx.lineTo(x, h - 4 - len); ctx.stroke(); } t++; raf = requestAnimationFrame(draw); }; draw(); window.addEventListener('resize', resize); return () => { cancelAnimationFrame(raf); window.removeEventListener('resize', resize); }; }, [active]); // Auto-cycle useEffectS(() => { const i = setInterval(() => setActive((a) => (a + 1) % items.length), 3500); return () => clearInterval(i); }, []); return (
[ 03 / SIGNAL ]

Every service —
one pulse.

Hover any capability below to feel its signature. The waveform shifts to mirror the depth, complexity, and ambition we bring to that craft.

{items.map((it, i) => (
setActive(i)} >
[ {it.num} ]
{it.name}
))}
); } Object.assign(window, { Hero, Marquee, Services, PulseWaveform });