Feat: Redesign Research Page into NGS-Based Research Services Experience

Mohana Sri Bhavitharequested to merge
research-page into dev

This MR transforms the existing ResearchDevelopment page into a modern, structured, and visually engaging experience for genomics research audiences.

What’s changed

  • Rebuilt the page into reusable React sections:

    • HeroSection
    • TwoColumnSection
    • WorkflowStepper
    • CardGrid
    • CTASection

  • Added a professional hero with genomic visual style, updated heading/subtext, and dual CTAs.

  • Replaced long text blocks with icon-based cards, chips, segmented benefit blocks, and feature highlights.

  • Implemented end-to-end NGS workflow as a horizontal step UI.

  • Added application-area grid and audience-specific “Who Can Benefit” cards.

  • Added final gradient CTA section with subtle animation and clear conversion actions.

  • Added responsive behavior for mobile/tablet (stacked layout, single-column grids on small screens).

Files updated

  • src/pages/ResearchDevelopment.jsx
  • src/pages/ResearchDevelopment.css

Validation

  • Verified with production build: npm run build passed successfully.

Outcome

  • The page now reflects a high-end genomics platform experience tailored to pharma, biotech, CRO, diagnostics, and academic research stakeholders.

Merge request reports