soconnor/medscribe-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: refresh product captures and mobile motion

Browse Source
This commit is contained in:
soconnor
2026-08-20 22:42:03 -04:00
parent 0a353afeb7
commit 0d371313f9
41 changed files with 146 additions and 86 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/(marketing)/executive-summary/page.tsx
+29 -28
View File
@@ -49,7 +49,7 @@ const differentiators = [
},
{
title: "Private by architecture",
body: "AI runs on-device: no cloud processing, no health-data upload, no tracking, no account. Others say \"encrypted\" while their store disclosures admit cloud collection.",
body: 'AI runs on-device: no cloud processing, no health-data upload, no tracking, no account. Others say "encrypted" while their store disclosures admit cloud collection.',
},
{
title: "Facts-first, not a guess",
@@ -147,21 +147,22 @@ export default function ExecutiveSummaryPage() {
<div className="space-y-5">
<SectionLabel>Executive Summary · June 2026</SectionLabel>
<div className="space-y-3">
<h1 className="font-serif text-5xl font-semibold tracking-tight text-foreground sm:text-6xl">
<h1 className="text-foreground font-serif text-5xl font-semibold tracking-tight sm:text-6xl">
Medscribe
</h1>
<p className="font-serif text-xl font-semibold tracking-tight text-foreground sm:text-2xl">
<p className="text-foreground font-serif text-xl font-semibold tracking-tight sm:text-2xl">
{TAGLINE}
</p>
</div>
<p className="text-base leading-relaxed text-muted-foreground sm:text-lg">
<p className="text-muted-foreground text-base leading-relaxed sm:text-lg">
{SNAPSHOT}
</p>
</div>
<div className="justify-self-center lg:justify-self-end">
<PhoneMockup
src="/screenshots/home.png"
src="/screenshots/product-glass-2026-08-20/home-light.png"
darkSrc="/screenshots/product-glass-2026-08-20/home-dark.png"
alt="Medscribe home screen"
width={200}
priority
@@ -175,9 +176,9 @@ export default function ExecutiveSummaryPage() {
<h2 className="font-serif text-3xl font-semibold tracking-tight sm:text-4xl">
The patient&apos;s context does not travel with them.
</h2>
<div className="grid gap-6 leading-relaxed text-muted-foreground lg:grid-cols-2 lg:gap-10">
<div className="text-muted-foreground grid gap-6 leading-relaxed lg:grid-cols-2 lg:gap-10">
<p>{PROBLEM}</p>
<p className="font-medium text-foreground">{PROBLEM_BROADER}</p>
<p className="text-foreground font-medium">{PROBLEM_BROADER}</p>
</div>
</section>
@@ -205,7 +206,7 @@ export default function ExecutiveSummaryPage() {
<h2 className="font-serif text-3xl font-semibold tracking-tight sm:text-4xl">
Everyone owns a slice. We own the whole job.
</h2>
<p className="max-w-4xl leading-relaxed text-muted-foreground">
<p className="text-muted-foreground max-w-4xl leading-relaxed">
{DIFFERENTIATION}
</p>
<div className="grid gap-4 md:grid-cols-3">
@@ -222,8 +223,8 @@ export default function ExecutiveSummaryPage() {
<CardContent className="pt-5">
<p className="leading-relaxed">
Medscribe connects the daily loop to the emergency handoff: one
private record that stays current through normal use and is ready
when the system does not know the patient.
private record that stays current through normal use and is
ready when the system does not know the patient.
</p>
</CardContent>
</Card>
@@ -235,7 +236,7 @@ export default function ExecutiveSummaryPage() {
<h2 className="font-serif text-3xl font-semibold tracking-tight sm:text-4xl">
Easy to claim. Hard to copy.
</h2>
<p className="max-w-4xl leading-relaxed text-muted-foreground">
<p className="text-muted-foreground max-w-4xl leading-relaxed">
{MOAT}
</p>
<div className="grid gap-4 md:grid-cols-3">
@@ -279,7 +280,7 @@ export default function ExecutiveSummaryPage() {
<h2 className="font-serif text-3xl font-semibold tracking-tight sm:text-4xl">
An ongoing touchstone, not another portal.
</h2>
<p className="max-w-4xl leading-relaxed text-muted-foreground">
<p className="text-muted-foreground max-w-4xl leading-relaxed">
{FOR_HEALTH_SYSTEMS}
</p>
<div className="grid gap-4 md:grid-cols-3">
@@ -295,14 +296,14 @@ export default function ExecutiveSummaryPage() {
</section>
{/* Beta */}
<section className="flex flex-col gap-5 rounded-xl border border-border-soft bg-surface p-6 sm:flex-row sm:items-center sm:justify-between sm:p-8">
<p className="max-w-xl text-sm leading-relaxed text-muted-foreground">
<section className="border-border-soft bg-surface flex flex-col gap-5 rounded-xl border p-6 sm:flex-row sm:items-center sm:justify-between sm:p-8">
<p className="text-muted-foreground max-w-xl text-sm leading-relaxed">
{BETA_SUMMARY} If you&apos;d like to try it, reach out.
</p>
<PrintButton size="lg" className="shrink-0" />
</section>
<p className="border-t border-border-soft pt-6 text-sm text-muted-foreground">
<p className="border-border-soft text-muted-foreground border-t pt-6 text-sm">
Sean O&apos;Connor
</p>
</div>
@@ -315,16 +316,16 @@ export default function ExecutiveSummaryPage() {
{/* Header */}
<header className="grid grid-cols-[minmax(0,1fr)_0.94in] items-stretch gap-4 border-b border-teal-900/10 pb-1.5">
<div className="flex flex-col justify-between py-0.5">
<p className="text-[10pt] font-semibold tracking-[0.18em] text-primary uppercase">
<p className="text-primary text-[10pt] font-semibold tracking-[0.18em] uppercase">
Executive Summary · June 2026
</p>
<div className="mt-1.5 flex items-center gap-2.5">
<MedscribeLogo className="h-[20pt] w-auto text-foreground" />
<h1 className="font-serif text-[22pt] leading-none font-semibold tracking-tight text-foreground">
<MedscribeLogo className="text-foreground h-[20pt] w-auto" />
<h1 className="text-foreground font-serif text-[22pt] leading-none font-semibold tracking-tight">
Medscribe
</h1>
</div>
<p className="mt-1.5 font-serif text-[12pt] leading-snug font-medium tracking-tight text-foreground italic">
<p className="text-foreground mt-1.5 font-serif text-[12pt] leading-snug font-medium tracking-tight italic">
{TAGLINE}
</p>
<p className="mt-2 text-[11pt] leading-[1.2] text-slate-700">
@@ -334,7 +335,7 @@ export default function ExecutiveSummaryPage() {
<div className="flex justify-end">
<div className="h-[1.78in] w-[0.88in] overflow-hidden rounded-[11px] border-[3px] border-slate-950 bg-white shadow-[0_8px_18px_rgba(15,23,42,0.14)]">
<Image
src="/screenshots/home.png"
src="/screenshots/product-glass-2026-08-20/home-light.png"
alt="Medscribe home screen"
width={1206}
height={2622}
@@ -348,7 +349,7 @@ export default function ExecutiveSummaryPage() {
{/* The Problem */}
<section className="border-b border-teal-900/10 pt-1 pb-1">
<h2 className="font-serif text-[12.5pt] font-semibold tracking-tight text-foreground">
<h2 className="text-foreground font-serif text-[12.5pt] font-semibold tracking-tight">
The Problem
</h2>
<p className="mt-1 text-[11pt] leading-[1.2] text-slate-700">
@@ -358,7 +359,7 @@ export default function ExecutiveSummaryPage() {
{/* Who It's For */}
<section className="border-b border-teal-900/10 pt-1 pb-1">
<h2 className="font-serif text-[12.5pt] font-semibold tracking-tight text-foreground">
<h2 className="text-foreground font-serif text-[12.5pt] font-semibold tracking-tight">
Who It&apos;s For
</h2>
<p className="mt-1 text-[11pt] leading-[1.2] text-slate-700">
@@ -368,7 +369,7 @@ export default function ExecutiveSummaryPage() {
{/* Why This Is Different */}
<section className="border-b border-teal-900/10 pt-1 pb-1">
<h2 className="font-serif text-[12.5pt] font-semibold tracking-tight text-foreground">
<h2 className="text-foreground font-serif text-[12.5pt] font-semibold tracking-tight">
Why This Is Different
</h2>
<div className="mt-1.5 grid grid-cols-3 gap-x-6">
@@ -377,7 +378,7 @@ export default function ExecutiveSummaryPage() {
key={item.title}
className="text-[11pt] leading-[1.2] text-slate-700"
>
<span className="font-semibold text-foreground">
<span className="text-foreground font-semibold">
{item.title}.
</span>{" "}
{item.body}
@@ -388,7 +389,7 @@ export default function ExecutiveSummaryPage() {
{/* Under The Hood */}
<section className="border-b border-teal-900/10 pt-1 pb-1">
<h2 className="font-serif text-[12.5pt] font-semibold tracking-tight text-foreground">
<h2 className="text-foreground font-serif text-[12.5pt] font-semibold tracking-tight">
Under The Hood
</h2>
<div className="mt-1 grid grid-cols-3 gap-x-6">
@@ -397,7 +398,7 @@ export default function ExecutiveSummaryPage() {
key={item.title}
className="text-[11pt] leading-[1.2] text-slate-700"
>
<span className="font-semibold text-foreground">
<span className="text-foreground font-semibold">
{item.title}.
</span>{" "}
{item.body}
@@ -408,7 +409,7 @@ export default function ExecutiveSummaryPage() {
{/* For Health Systems */}
<section className="pt-1">
<h2 className="font-serif text-[12.5pt] font-semibold tracking-tight text-foreground">
<h2 className="text-foreground font-serif text-[12.5pt] font-semibold tracking-tight">
For Health Systems
</h2>
<div className="mt-1 grid grid-cols-3 gap-x-6">
@@ -417,7 +418,7 @@ export default function ExecutiveSummaryPage() {
key={item.title}
className="text-[11pt] leading-[1.2] text-slate-700"
>
<span className="font-semibold text-foreground">
<span className="text-foreground font-semibold">
{item.title}.
</span>{" "}
{item.body}
src/app/(marketing)/how-it-works/page.tsx
+6 -3
View File
@@ -137,7 +137,8 @@ export default function HowItWorksPage() {
</div>
<div className="bg-primary-light/45 justify-self-center rounded-[2.5rem] p-7">
<PhoneMockup
src="/screenshots/appointment-summary.png"
src="/screenshots/product-glass-2026-08-20/summary-light.png"
darkSrc="/screenshots/product-glass-2026-08-20/summary-dark.png"
alt="Synthetic Medscribe beta visit summary"
width={235}
/>
@@ -150,7 +151,8 @@ export default function HowItWorksPage() {
<div className="grid gap-12 lg:grid-cols-2 lg:items-center">
<div className="justify-self-center rounded-[2.5rem] bg-[#f4f0e8] p-7 lg:order-1 dark:bg-[#151b25]">
<PhoneMockup
src="/screenshots/medication-detail.png"
src="/screenshots/product-glass-2026-08-20/medication-detail-light.png"
darkSrc="/screenshots/product-glass-2026-08-20/medication-detail-dark.png"
alt="Synthetic Medscribe beta medication detail"
width={235}
/>
@@ -197,7 +199,8 @@ export default function HowItWorksPage() {
</div>
<div className="bg-primary-light/45 justify-self-center rounded-[2.5rem] p-7">
<PhoneMockup
src="/screenshots/emergency-record.png"
src="/screenshots/product-glass-2026-08-20/know-me-light.png"
darkSrc="/screenshots/product-glass-2026-08-20/know-me-dark.png"
alt="Synthetic Medscribe beta Know Me handoff"
width={235}
/>
src/app/(marketing)/page.tsx
+18 -18
View File
@@ -28,8 +28,8 @@ const visitMoments = [
eyebrow: "Visits stay findable",
title: "The visit has a place to land.",
body: "Keep the recording, transcript, and reviewed summary together instead of reconstructing the appointment from memory.",
image: "/screenshots/pitch/visits-natural.webp",
darkImage: "/screenshots/pitch/visits-natural-dark.webp",
image: "/screenshots/pitch-glass-2026-08-20/visits-natural.webp",
darkImage: "/screenshots/pitch-glass-2026-08-20/visits-natural-dark.webp",
alt: "Medscribe Visits screen in a natural titanium iPhone product bezel",
},
{
@@ -37,8 +37,8 @@ const visitMoments = [
eyebrow: "Words stay checkable",
title: "Go back to what was actually said.",
body: "Search the local transcript and compare it with the generated summary before anything becomes part of the record you rely on.",
image: "/screenshots/pitch/transcript-black.webp",
darkImage: "/screenshots/pitch/transcript-black-dark.webp",
image: "/screenshots/pitch-glass-2026-08-20/transcript-black.webp",
darkImage: "/screenshots/pitch-glass-2026-08-20/transcript-black-dark.webp",
alt: "Medscribe visit transcript in a black titanium iPhone product bezel",
},
{
@@ -46,8 +46,8 @@ const visitMoments = [
eyebrow: "The next step stays visible",
title: "Review the useful part. Keep the uncertainty.",
body: "Medications, follow-ups, diagnoses, and instructions are prepared on-device. Suggestions remain suggestions until a person checks them.",
image: "/screenshots/pitch/summary-natural.webp",
darkImage: "/screenshots/pitch/summary-natural-dark.webp",
image: "/screenshots/pitch-glass-2026-08-20/summary-natural.webp",
darkImage: "/screenshots/pitch-glass-2026-08-20/summary-natural-dark.webp",
alt: "Medscribe appointment summary in a natural titanium iPhone product bezel",
},
] as const;
@@ -128,8 +128,8 @@ export default function HomePage() {
<div className="relative mx-auto mt-12 h-[36rem] max-w-5xl sm:h-[46rem] lg:mt-8 lg:h-[54rem]">
<div className="absolute top-24 left-1/2 w-[17rem] -translate-x-[86%] -rotate-6 sm:top-28 sm:w-[22rem] lg:top-32 lg:w-[26rem]">
<ProductDevice
src="/screenshots/pitch/summary-natural.webp"
darkSrc="/screenshots/pitch/summary-natural-dark.webp"
src="/screenshots/pitch-glass-2026-08-20/summary-natural.webp"
darkSrc="/screenshots/pitch-glass-2026-08-20/summary-natural-dark.webp"
alt="Medscribe visit summary in a natural titanium iPhone product bezel"
className="pitch-device-motion pitch-device-drift-left"
sizes="(min-width: 1024px) 416px, (min-width: 640px) 352px, 272px"
@@ -138,8 +138,8 @@ export default function HomePage() {
</div>
<div className="absolute top-0 left-1/2 z-10 w-[18rem] -translate-x-[14%] rotate-5 sm:w-[23rem] lg:w-[28rem]">
<ProductDevice
src="/screenshots/pitch/home-black.webp"
darkSrc="/screenshots/pitch/home-black-dark.webp"
src="/screenshots/pitch-glass-2026-08-20/home-black.webp"
darkSrc="/screenshots/pitch-glass-2026-08-20/home-black-dark.webp"
alt="Medscribe home screen in a black titanium iPhone product bezel"
className="pitch-device-motion pitch-device-drift-right"
sizes="(min-width: 1024px) 448px, (min-width: 640px) 368px, 288px"
@@ -249,8 +249,8 @@ export default function HomePage() {
<div className="relative mx-auto h-[42rem] w-full max-w-2xl sm:h-[50rem] lg:h-[56rem]">
<div className="absolute top-20 left-[4%] w-[17rem] -rotate-6 sm:w-[21rem] lg:w-[23rem]">
<ProductDevice
src="/screenshots/pitch/medication-detail-natural.webp"
darkSrc="/screenshots/pitch/medication-detail-natural-dark.webp"
src="/screenshots/pitch-glass-2026-08-20/medication-detail-natural.webp"
darkSrc="/screenshots/pitch-glass-2026-08-20/medication-detail-natural-dark.webp"
alt="Medscribe medication detail in a natural titanium iPhone product bezel"
className="pitch-device-motion pitch-device-drift-left"
sizes="(min-width: 1024px) 368px, (min-width: 640px) 336px, 272px"
@@ -258,8 +258,8 @@ export default function HomePage() {
</div>
<div className="absolute top-0 right-[2%] z-10 w-[18rem] rotate-5 sm:w-[22rem] lg:w-[24rem]">
<ProductDevice
src="/screenshots/pitch/medications-black.webp"
darkSrc="/screenshots/pitch/medications-black-dark.webp"
src="/screenshots/pitch-glass-2026-08-20/medications-black.webp"
darkSrc="/screenshots/pitch-glass-2026-08-20/medications-black-dark.webp"
alt="Medscribe medication list in a black titanium iPhone product bezel"
className="pitch-device-motion pitch-device-drift-right"
sizes="(min-width: 1024px) 384px, (min-width: 640px) 352px, 288px"
@@ -321,8 +321,8 @@ export default function HomePage() {
</div>
<div className="order-1 mx-auto w-[min(78vw,27rem)] lg:order-2">
<ProductDevice
src="/screenshots/pitch/ask-black.webp"
darkSrc="/screenshots/pitch/ask-black-dark.webp"
src="/screenshots/pitch-glass-2026-08-20/ask-black.webp"
darkSrc="/screenshots/pitch-glass-2026-08-20/ask-black-dark.webp"
alt="Medscribe Ask response grounded in local health context, shown in a black titanium iPhone product bezel"
className="pitch-device-motion pitch-device-drift-right"
sizes="(min-width: 1024px) 432px, (min-width: 640px) 384px, 78vw"
@@ -337,8 +337,8 @@ export default function HomePage() {
<div className="relative mx-auto w-[min(80vw,28rem)]">
<div className="bg-primary-light/70 absolute inset-[12%_-12%_8%] -z-10 rounded-[4rem] blur-2xl" />
<ProductDevice
src="/screenshots/pitch/know-me-natural.webp"
darkSrc="/screenshots/pitch/know-me-natural-dark.webp"
src="/screenshots/pitch-glass-2026-08-20/know-me-natural.webp"
darkSrc="/screenshots/pitch-glass-2026-08-20/know-me-natural-dark.webp"
alt="Medscribe Know Me handoff record in a natural titanium iPhone product bezel"
className="pitch-device-motion pitch-device-drift-left"
sizes="(min-width: 1024px) 448px, (min-width: 640px) 400px, 80vw"