// sections.jsx — Page sections for Blind Vision website // ─── NAV ──────────────────────────────────────────────────────────────────── function Nav({ onCTAClick }) { const [scrolled, setScrolled] = React.useState(false); React.useEffect(() => { const onScroll = () => setScrolled(window.scrollY > 20); window.addEventListener('scroll', onScroll, { passive: true }); onScroll(); return () => window.removeEventListener('scroll', onScroll); }, []); return ( ); } // ─── HERO ─────────────────────────────────────────────────────────────────── function Hero({ heroVariant, headline, subhead, onCTAClick }) { const orbsRef = React.useRef(null); React.useEffect(() => { const onMove = (e) => { if (!orbsRef.current) return; const x = (e.clientX / window.innerWidth - 0.5) * 24; const y = (e.clientY / window.innerHeight - 0.5) * 24; orbsRef.current.style.setProperty('--mx', `${x}px`); orbsRef.current.style.setProperty('--my', `${y}px`); }; window.addEventListener('mousemove', onMove); return () => window.removeEventListener('mousemove', onMove); }, []); return (
); } // ─── MISSION ──────────────────────────────────────────────────────────────── function Mission() { return (
Mission

Independence,
at your fingertips.

Blind Vision is a mobile app for blind and low-vision users. Point your phone at the world — a sign, a face, a barcode, a doorway — and the app describes, reads, recognizes, and guides. Soon, the same intelligence will run hands-free on Meta Glasses.

); } // ─── FEATURES ─────────────────────────────────────────────────────────────── function Features() { const features = [ { title: 'Ask about anything', body: 'Take a photo or short video and ask the app a question about what it sees. "What\'s on this shelf?" "Is this can dented?" Answers in plain language.', tag: 'Photo & video', }, { title: 'Document & screen reading', body: 'OCR for mail, menus, prescriptions, and printed pages — including multi-column layouts and handwriting where legible.', tag: 'OCR', }, { title: 'Barcode scanning', body: 'Identify groceries, medications, and packaged goods. Hold your phone near the label and the app finds the barcode for you.', tag: 'Identify', }, { title: 'Faces of friends & family', body: 'Train the app on the people you choose so it can let you know when they\'re nearby. Stays on your device, never shared.', tag: 'Recognize', }, { title: 'Indoor navigation at home', body: 'Map familiar spaces — your apartment, your office — and get spoken cues to find a room, a chair, the front door.', tag: 'Navigate', }, { title: 'Read any website aloud', body: 'Paste a link and Blind Vision strips the clutter, restructures the page, and reads it in a voice tuned for long-form listening.', tag: 'Web reader', }, { title: 'Path navigation outside', body: 'Walking directions described as a route, not as a list of street names — landmarks, turns, and what to expect ahead.', tag: 'Outdoors', }, { title: 'Built for screen readers', body: 'Every screen, every control works with VoiceOver and TalkBack. Tested with the people who actually rely on them.', tag: 'A11y', }, ]; return (
Features

Everything you needed,
in one app.

{features.map((f, i) => (
{f.tag}

{f.title}

{f.body}

))}
); } // ─── HOW IT WORKS ─────────────────────────────────────────────────────────── function HowItWorks() { const steps = [ { n: '01', title: 'Install on your phone', body: 'Download Blind Vision on iOS or Android. The whole app is built to be navigated by VoiceOver and TalkBack from the first launch.', }, { n: '02', title: 'Point, scan, or ask', body: 'Capture a photo, scan a barcode, paste a link, or open a saved space. Use your voice or any control you prefer — your screen reader is welcome here.', }, { n: '03', title: 'Hear back what matters', body: 'Descriptions, OCR, recognized faces, navigation cues — spoken at the pace and verbosity you set. Replay, dig deeper, or move on.', }, ]; return (
How it works

Three steps. No learning curve.

    {steps.map((s, i) => (
  1. {s.n}

    {s.title}

    {s.body}

    2. ))}
); } function StepArt({ index }) { if (index === 0) { return ( ); } if (index === 1) { return ( {[0, 1, 2, 3, 4, 5, 6].map((i) => ( ))} "What's on this shelf?" ); } return ( ); } // ─── GLASSES (Coming Soon) ───────────────────────────────────────────────── function Glasses() { const capabilities = [ { icon: 'obstacle', label: 'Real-time obstacle detection', body: 'Curbs, posts, doorframes, low branches — heard the moment they appear in front of you.' }, { icon: 'nav', label: 'Turn-by-turn navigation', body: 'Spoken route guidance through the glasses\' speakers, so your hands and your phone stay free.' }, { icon: 'safety', label: 'Safety alerts', body: 'Heads-up cues for oncoming traffic, sudden movement, and drop-offs in your path.' }, { icon: 'read', label: 'Read & describe', body: 'Look at a sign, a menu, or the room — ask for a description or have it read aloud, no phone in hand.' }, ]; return (
Coming soon

Hands-free, on
Meta Glasses.

We're bringing Blind Vision to Meta Glasses so you don't have to hold a phone to see the world. The same features you use today — obstacle detection, navigation, reading, scene description, face recognition — running on the smart glasses you already wear.

{capabilities.map((c) => (

{c.label}

{c.body}

))}
Get notified when it launches → Snap Spectacles and other platforms under exploration.
); } function GlassesArt() { // Frameless smart glasses — just the lens shapes and tiny temple stubs. // Lenses are subtle rounded rectangles with a faint stroke so they read // as glass rather than empty boxes; bridge is a single thin curve. return ( ); } function CapIcon({ kind }) { const common = { width: 28, height: 28, viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: 1.5, strokeLinecap: 'round', strokeLinejoin: 'round' }; if (kind === 'obstacle') return ( ); if (kind === 'nav') return ( ); if (kind === 'safety') return ( ); return ( ); } // ─── FAQ ──────────────────────────────────────────────────────────────────── function FAQ() { const items = [ { q: 'What is Blind Vision, exactly?', a: 'A mobile app for iOS and Android, designed for blind and low-vision users. It uses your phone\'s camera and AI to describe scenes, read text, scan barcodes, recognize friends and family, navigate familiar spaces, and read websites aloud.', }, { q: 'Is it available right now?', a: 'Blind Vision is in private beta. Join the waitlist and we\'ll reach out as we open more spots. There\'s no cost to test the beta.', }, { q: 'How does the Meta Glasses version work?', a: 'It\'s in development. Once released, the same capabilities you use on your phone — obstacle detection, navigation, reading, scene description — will work hands-free through Meta Glasses.', }, { q: 'Is Blind Vision a replacement for a cane or guide dog?', a: 'No. It\'s a companion that fills in context — what a sign says, who\'s in the room, what\'s on the shelf. Your primary mobility tools stay your primary mobility tools.', }, { q: 'How does it work with VoiceOver and TalkBack?', a: 'Every screen and control is built to be operated by your screen reader of choice. We test the app with the assistive tech our users rely on.', }, { q: 'What does it cost?', a: 'Pricing is still being finalized. Beta access is free, and we\'re committed to keeping core features accessible.', }, ]; const [open, setOpen] = React.useState(0); return (
FAQ

Honest answers,
before you ask.

Don't see your question? Email hello@blindvision.app and we'll get back to you.

); } // ─── CTA + FOOTER ─────────────────────────────────────────────────────────── function CTA() { const [email, setEmail] = React.useState(''); const [status, setStatus] = React.useState('idle'); // 'idle' | 'sending' | 'ok' | 'error' const [message, setMessage] = React.useState(''); async function onSubmit(e) { e.preventDefault(); if (status === 'sending') return; setStatus('sending'); setMessage(''); try { const r = await fetch('/api/waitlist', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ email }), }); const data = await r.json().catch(() => ({})); if (!r.ok) { setStatus('error'); setMessage(data.error || 'Something went wrong. Please try again.'); return; } setStatus('ok'); setMessage("You're on the list. We'll be in touch."); setEmail(''); } catch (err) { setStatus('error'); setMessage('Network error. Please try again.'); } } return (
Join the waitlist

Be one of the first
on the beta.

setEmail(e.target.value)} disabled={status === 'sending' || status === 'ok'} />

{message || "We'll only email when there's beta news to share."}

); } function Footer() { return ( ); } Object.assign(window, { Nav, Hero, Mission, HowItWorks, Features, FAQ, CTA, Footer, Glasses });