Welcome · Domain landings

Purpose#

Detailed marketing content for each of the six domains (Tara, Veritas, Nyx, Arete, Nisaba, Metis) with feature showcases, capability lists, stats, use-case lists, and per-domain CTAs into the sign-up flow.

Entry points#

• Footer "Domains" or "Tara/Veritas/Nyx/Arete/Nisaba/Metis" anchor links
• Marketing campaign links targeting a specific domain anchor (/welcome/domains#tara)
• Outbound product pages on the marketing site
• Direct URL / bookmark — yes (anon)

Layout regions#

page.tsx is a server component built on welcomePage CSS classes (shared with /welcome and /welcome/download). Renders <SmartAppBanner /> then iterates DOMAIN_CONTENT (a hard-coded array of six domain landing definitions, one per WebNavigableDomainId).

• SmartAppBanner: mobile install nudge
• welcomeHero: eyebrow "OSHUN domains", h1 "Six domains, one practice", subtitle paragraph
• Six .domainLandingSection stacked vertically, each with:
  • .domainLandingBadge: accent dot (from getDomainMetadata(id).accentColor), domain label, and a Beta pill when meta.availability === 'beta'
  • .domainLandingHeadline (h2)
  • .domainLandingDescription
  • .domainLandingStats: four <article> stat cards with value + label
  • .domainLandingFeatures: four feature cards with <h3> + body
  • .domainLandingUseCases: bullet list of 4 use cases
  • .domainLandingCta (data-attr data-welcome-domains-actions={id}): primary "Create an account and open " + secondary "I already have access"
• welcomeFooterCta ("Better together"): cross-domain CTA with two buttons (signup / signin)
• welcomeFooter: brand mark, nav links, anchor links to each #<domain>, copyright with new Date().getFullYear()

States#

• Loading — N/A; static server component
• Default — all six sections render in DOMAIN_CONTENT order (tara, veritas, nyx, arete, nisaba, metis)
• Beta badge visible — for any domain where getDomainMetadata(id).availability === 'beta'; current walked state: Nyx and Nisaba render Beta.
• Anchor scroll — landing on /welcome/domains#tara and clicking the footer #metis link both bring the target section into view (id={domain.id} set on each <section>)
• Standalone PWA / mobile — iPhone standalone launch shows the SmartAppBanner, preserves every CTA as a 44px+ touch target, and avoids horizontal overflow
• Reduced motion — Playwright verifies the runtime media preference is prefers-reduced-motion: reduce while the static page remains readable
• Offline — real sw.js warms and replays /welcome/domains while the browser context is offline; no generic offline fallback header is used

Interactions#

SmartAppBanner#

• Banner row — mobile iOS install nudge is visible with Open and Dismiss controls

Per-domain CTAs#

For each of the six sections:

• "Create an account and open " (link, primary, data-welcome-domains-cta={id})
  • Function: navigates to buildPublicAuthEntryPath({ mode: 'signup', redirectPath: buildWebDomainRoutePath(id, { origin: 'home' }), entrySource: 'welcome-domains' })
  • Telemetry: public_auth_funnel_cta_clicked fires for every domain with surface: 'welcome_domains', step: 'domains_signup', the matching targetDomain, targetPath, and href.
• "I already have access" (link, secondary)
  • Function: navigates to buildPublicAuthEntryPath({ mode: 'signin', redirectPath: ... })
  • Telemetry: public_auth_funnel_cta_clicked fires for every domain with step: 'domains_signin' and the same domain target contract.

"Better together" footer CTA#

• "Create your account" (link, primary)
  • Function: buildPublicAuthEntryPath({ mode: 'signup', entrySource: 'welcome-domains' })
• "Sign in to the shell" (link, secondary)
  • Function: signin with redirectPath: '/'

Footer nav#

• "Home" link — /welcome
• "Dashboard" link — buildPublicAuthEntryPath(... signin, redirect '/' ...)
• Six anchor links (#tara etc.) — in-page scroll; #metis is verified after footer click and every footer anchor href matches a rendered section id

Data & contracts#

• Reads:
  • getDomainMetadata(id) from @oshun/domain-registry (accent colour, label, availability)
  • Domain content hard-coded in DOMAIN_CONTENT array inside page.tsx
• Writes: none directly; CTAs hand off to the auth flow
• Caching: SSR static; SW cache
• Auth: anon (in middleware PUBLIC_PREFIXES)
• Telemetry: CTAs carry data-welcome-domains-cta / data-welcome-domains-actions attributes; PublicAuthFunnelLink fires public_auth_funnel_cta_clicked on click

Cross-references#

• Sibling public surfaces: welcome.md, welcome-download.md, landing.md
• Per-domain routes (post-sign-in):
  • ../03-tara/tara.md
  • ../04-arete/, ../05-veritas/, ../06-nyx/, ../07-nisaba/, ../08-metis/
• Cross-route navigation: d-domain-path.md, domains-domainId.md
• Component sources:
  • apps/oshun/web/src/components/SmartAppBanner.tsx
  • apps/oshun/web/src/navigation/routes (buildWebDomainRoutePath)
  • apps/oshun/web/src/lib/public-entry (buildPublicAuthEntryPath)
  • libs/shared/domain-registry (getDomainMetadata)
• E2E: apps/oshun/web/e2e/welcome-marketing.spec.ts covers the route-level catalogue, anchor, auth handoff, telemetry, mobile standalone, offline replay, metadata, and axe-gated accessibility contracts

Open questions / known gaps#

• Confirm telemetry firing on data-welcome-domains-cta links — PublicAuthFunnelLink dispatches trackPublicAuthFunnelCtaClicked, and welcome-marketing.spec.ts verifies every domain signup/signin CTA plus footer auth CTAs.
• Hard-coded DOMAIN_CONTENT array — verify whether marketing copy is expected to be data-driven (CMS) or stays in the page source
• Metis description references "the fuller learner experience unlocking behind launch-readiness gates" — confirm against current Metis launch state in V1/features.md#metis
• Six anchor links in footer; each href matches a rendered section id and footer #metis scrolls the matching section into view.