Luminopia

The problem

Luminopia had FDA-cleared a breakthrough amblyopia treatment: VR-based binocular therapy that lets children ages 4–7 watch curated TV instead of wearing a patch. Ahead of a major conference launch, they needed a full rebrand and website overhaul serving two very different audiences: healthcare professionals who prescribe and enroll patients, and parents searching for treatment options. The site had to align with new marketing materials and brand style guides, communicate complex clinical trial data clearly, meet regulatory requirements for safety disclosures, and convert visitors into prescribers or enrolled patients, all on a hard deadline with an international team of designers and project managers.

Approach

I joined as the Webflow developer on an international team of designers and project managers, translating high-fidelity Figma designs and brand style guides into a production site. I coordinated across time zones on layout feedback, CTA iterations, and consistency with approved marketing materials. The architecture centers on dual entry points (Healthcare Professionals and Parents & Patients), each with tailored navigation, messaging, and CTAs while sharing modular compliance components (Indications & Safety, Directions for Use, citations). I built the main marketing site in Webflow, stood up resources.luminopia.com for downloadable patient PDFs, and integrated prescriber workflows with PhilRx e-prescription paths and CoAssist patient access enrollment. When testing revealed that mailto links were dropping leads on desktop, I proposed and implemented form-based capture (Name, Email, Zip Code) across prescriber CTAs. A rigorous MarkUp.io visual QA process caught cross-browser rendering issues (nav collisions, padding drift, font weights) before launch.

Process

1. 1

   Design handoff & site architecture

   Coordinated with international designers and project managers to translate Figma layouts into Webflow page structures for HCP and parent audiences. Referenced marketing materials and brand style guides to keep typography, color, and component styling consistent across pages. Established shared components for safety blocks, citation footnotes, and CTA patterns while allowing audience-specific hero messaging and navigation.

2. 2

   HCP pathway & prescribing flows

   Built the Healthcare Professionals section with clinical efficacy data, prescribing reference guides, and Contact a Rep CTAs. Integrated PhilRx e-prescription workflows including EHR integration paths and fax enrollment form options.

3. 3

   Parent pathway & prescriber discovery

   Developed the parent-facing experience explaining the treatment (1 hour/day, 6 days/week, 3,100+ curated episodes) and the Find a Prescriber flow. Replaced unreliable mailto links with a centralized form that captures lead data consistently across iPhone, desktop, and Safari.

4. 4

   Patient support & resource hub

   Streamlined the Patient Support page for FAQs and CoAssist access program enrollment. Configured resources.luminopia.com as a custom subdomain (DNS CNAME/TXT) to host downloadable PDFs: prescribing guides, enrollment forms, and appeal templates.

5. 5

   Clinical content & compliance

   Synthesized Phase 3 trial findings into accessible UI: 1.8 lines of vision improvement at 12 weeks vs. 0.8 in controls, strong adherence vs. traditional patching, and a clean safety profile (no serious AEs; mild transient headache most common). Modular safety components ensure regulatory copy stays consistent and auditable site-wide.

6. 6

   Visual QA & launch polish

   Ran iterative MarkUp.io reviews to close the design-to-build gap: nav bar collisions, carousel markers, padding discrepancies between desktop/mobile/Safari, and font weight corrections. Budgeted dedicated go-live time for cross-browser testing rather than assuming Figma parity.

7. 7

   SEO & analytics

   Conducted a technical SEO audit (headline hierarchy, mobile/tablet optimization, content readability) and integrated analytics to track engagement and conversion on prescriber and patient support flows.

8. 8

   Lessons: reliability over aesthetics

   A clean design means nothing if the interaction path fails. The mailto-to-form pivot taught me to default to form-based capture for lead generation. It standardized UX across devices and created a reliable data loop the team could act on.

9. 9

   Lessons: modular compliance at scale

   Serving HCPs and parents from one site while meeting FDA disclosure requirements required reusable Indications & Safety components. Standardizing these blocks let us tailor audience messaging without risking regulatory inconsistency.

10. 10

    Lessons: QA in the wild

    Done is not done until it is tested in production browsers. MarkUp.io moved QA beyond static design files and caught real rendering issues, especially Safari vs. mobile, that would have shipped without a dedicated visual feedback loop.

Outcome

Launched a cohesive rebrand site on deadline for conference rollout, aligned with marketing materials and style guides, with separate HCP and parent pathways, reliable prescriber lead capture, downloadable patient resources on resources.luminopia.com, and modular safety disclosures kept consistent across the site.

Stack & services

• • Webflow development
• • Design-to-build translation
• • International team coordination
• • Dual-audience information architecture
• • Lead capture & form UX
• • Resource hub & subdomain setup
• • Visual QA & cross-browser polish
• • SEO & analytics integration