GitHub - drferdi/Sentraverse: Sentraverse is the home of Sentra Artificial Intelligence — an integrated ecosystem where clinical intelligence, AI orchestration, operational automation, and digital transformation converge into one coherent environment.

Sentraverse mark used by the source README

SENTRAVERSE
_{Public product + knowledge surface}

SENTRA / CLINICAL INTELLIGENCE FOR INDONESIA

Guided by Human Insight, Powered by Artificial Intelligence.

Operational signal: public trust layer · clinical-AI narrative · governed decision support

Sentra Healthcare AI
Sentraverse is the official website, product narrative layer, and public knowledge surface for Sentra Healthcare AI, translating clinical intelligence, founder vision, medical governance, product architecture, and Indonesian primary-care workflow into one coherent digital universe.

Website System Map Clinical Boundary Governance Contact

_{CLINICAL CONTEXT → CDSS → GOVERNANCE → LICENSED CLINICIAN → DECISION}

01 / EXECUTIVE SUMMARY

Sentraverse is the official marketing, product, and knowledge hub for Sentra Healthcare AI.

It is not a generic corporate website. It is the public trust layer for a clinical-AI ecosystem designed for Indonesian primary care: Puskesmas, klinik pratama, referral hospitals, clinicians, healthcare operators, public-sector stakeholders, and technical partners.

Sentraverse connects six strategic surfaces inside one coherent website:

_Surface	_Route	_Function
_{Clinical-AI Landing}	_/	_{Main product narrative and scroll-driven introduction}
_{Founder Story}	_/story	_{Founder journey, product milestones, and roadmap}
_{Clinical-AI Editorial}	_/insights	_{Thought leadership and article index}
_Sentrapedia	_/sentrapedia	_{144-disease primary-care clinical reference}
_{Sentra Ecosystem}	_/ekosistem	_{Product ecosystem and application catalog}
_SentraWiki	_/sentrawiki	_{Architecture, governance, compliance, and knowledge base}

The center of gravity is simple:

Sentraverse explains why Sentra exists, how it supports clinical work, where its boundaries are, and why it matters for Indonesia’s frontline healthcare system.

02 / PRODUCT THESIS

A clinical-AI product does not earn trust through animation alone. It earns trust by making its purpose, workflow, safety posture, and governance legible.

Sentraverse is built to answer four strategic questions:

_{Strategic Question}	_{Sentraverse Answer}
_{What is Sentra Healthcare AI?}	_{A workflow-native clinical intelligence layer for Indonesian healthcare}
_{Why does it matter?}	_{It reduces fragmented information, slow escalation, and administrative burden}
_{How does the product think?}	_{Through triage intelligence, clinical trajectory, reference knowledge, and governed AI assistance}
_{How is safety protected?}	_{By positioning Sentra as clinical decision support, not a replacement for licensed clinicians}

03 / SENTRA DESIGN LANGUAGE

Sentraverse follows the Sentra Healthcare AI design language: clinical, editorial, architectural, precise, and memorable.

_Element	_Direction
_{Visual tone}	_{Dark editorial clinical command center}
_Background	_{Charcoal, warm ink, cream plates, and intentional high-contrast sections}
_Accent	_{Red-orange, Oxford blue, violet, amber, emerald, and sky}
_Typography	_{Strong display headings, readable body copy, mono labels for system signals}
_{Component shape}	_{Thin-border cards, clinical panels, tactical badges, product command surfaces}
_Motion	_{Used for sequence, explanation, and orientation — never empty decoration}
_{AI posture}	_{Supports clinical reasoning; does not replace professional judgment}
_{Safety posture}	_{Clinical claims must remain bounded, transparent, and governed}

04 / README INDEX

OPEN README NAVIGATION

Executive Summary
Product Thesis
Design Language
System Map
Experience Loop
Product Surfaces
Homepage Topology
Clinical Boundary
Medical Safety
Route Map
Architecture
Technology Stack
Design Tokens
Motion System
Build Protocol
Environment
Testing & Governance
SEO
Documentation
Important Files
Product Truth
Medical Disclaimer
License
Contact
Let's Connect
Active Stack
Instrumentation

05 / SYSTEM MAP

%%{init: {"flowchart": {"padding": 18}, "themeVariables": {"fontFamily": "monospace", "fontSize": "11px"}}}%%
flowchart LR
    Public["Public Visitor<br/>clinicians, patients, institutions, partners"]
    Home["Sentraverse Landing<br/>/"]
    Story["Founder Story<br/>/story"]
    Insights["Clinical-AI Editorial<br/>/insights"]
    Pedia["Sentrapedia<br/>144-disease reference"]
    Ecosystem["Sentra Ecosystem<br/>/ekosistem"]
    Wiki["SentraWiki<br/>architecture + governance"]
    APIs["App Router APIs<br/>/app/api/**"]
    Clinical["Clinical Intelligence<br/>triage, trajectory, prognosis"]
    Governance["Medical Governance<br/>boundaries, disclaimer, safety"]
    Sentra["Sentra Healthcare AI<br/>product universe"]

    Public --> Home
    Home --> Story
    Home --> Insights
    Home --> Pedia
    Home --> Ecosystem
    Home --> Wiki
    Home --> APIs

    Pedia --> Clinical
    Wiki --> Clinical
    Wiki --> Governance
    Ecosystem --> Sentra
    Story --> Sentra
    Clinical --> Sentra
    Governance --> Sentra

    classDef visitor fill:#0D1117,stroke:#64748B,color:#FFFFFF,stroke-width:2px;
    classDef home fill:#0D1117,stroke:#5B8CFF,color:#FFFFFF,stroke-width:3px;
    classDef content fill:#0D1117,stroke:#22D3EE,color:#FFFFFF,stroke-width:2px;
    classDef clinical fill:#0D1117,stroke:#8B5CF6,color:#FFFFFF,stroke-width:2px;
    classDef governance fill:#0D1117,stroke:#14B8A6,color:#FFFFFF,stroke-width:2px;
    classDef sentra fill:#0D1117,stroke:#5B8CFF,color:#FFFFFF,stroke-width:4px;

    class Public visitor;
    class Home home;
    class Story,Insights,Pedia,Ecosystem,Wiki content;
    class APIs,Clinical clinical;
    class Governance governance;
    class Sentra sentra;

06 / EXPERIENCE LOOP

Sentraverse is not a static homepage. It is a guided trust-building loop.

%%{init: {"flowchart": {"padding": 18}, "themeVariables": {"fontFamily": "monospace", "fontSize": "11px"}}}%%
flowchart TD
    A["Visitor Arrives<br/>clinical, institutional, public, technical"] --> B["Hero Thesis<br/>Guided by Human Insight"]
    B --> C["Problem Framing<br/>fragmented data, slow decisions, admin burden"]
    C --> D["Product Ecosystem<br/>Sentra engine suite"]
    D --> E["Clinical Simulation<br/>Audrey consultation flow"]
    E --> F["Blueprint Story<br/>AADI, console, trajectory"]
    F --> G["Clinical Suite<br/>triage, trajectory, prognosis"]
    G --> H["Sentrapedia<br/>primary-care reference"]
    H --> I["SentraWiki<br/>architecture + governance"]
    I --> J["Medical Disclaimer<br/>CDSS boundary"]
    J --> K["Contact / Pilot / Waiting List"]

    classDef entry fill:#0D1117,stroke:#64748B,color:#FFFFFF,stroke-width:2px;
    classDef story fill:#0D1117,stroke:#22D3EE,color:#FFFFFF,stroke-width:2px;
    classDef product fill:#0D1117,stroke:#5B8CFF,color:#FFFFFF,stroke-width:2px;
    classDef clinical fill:#0D1117,stroke:#8B5CF6,color:#FFFFFF,stroke-width:2px;
    classDef governance fill:#0D1117,stroke:#14B8A6,color:#FFFFFF,stroke-width:2px;
    classDef action fill:#0D1117,stroke:#F59E0B,color:#FFFFFF,stroke-width:3px;

    class A entry;
    class B,C,F story;
    class D,K product;
    class E,G,H clinical;
    class I,J governance;

07 / PRODUCT SURFACES

Sentraverse exposes the public product universe through five content surfaces plus its application/API layer.

%%{init: {"flowchart": {"padding": 18}, "themeVariables": {"fontFamily": "monospace", "fontSize": "11px"}}}%%
flowchart TB
    Root["SENTRAVERSE"]

    Landing["LANDING PAGE"]
    Story["STORY"]
    Insights["INSIGHTS"]
    Pedia["SENTRAPEDIA"]
    Ecosystem["EKOSISTEM"]
    Wiki["SENTRAWIKI"]
    API["API"]

    Root --> Landing
    Root --> Story
    Root --> Insights
    Root --> Pedia
    Root --> Ecosystem
    Root --> Wiki
    Root --> API

    Landing --> L1["Hero · Project Slider · About Sentra"]
    Landing --> L2["Ecosystem · SentraSim · Clinical Suite · FAQ"]
    Story --> S1["Founder Journey · Product Timeline · Milestones · Roadmap"]
    Insights --> I1["Clinical AI Editorial · Article Index · Medium · Substack"]
    Pedia --> P1["144 Diseases · Search · Category Filter · Detail Panel"]
    Ecosystem --> E1["Sentra Products · Product Status · Application Catalog · Domain Map"]
    Wiki --> W1["Abyss Architecture · Crown Jewel Engines · Governance · Compliance"]
    API --> A1["Medical Knowledge · Assistant Integrations · Dashboard Rewrite"]

    classDef core fill:#0D1117,stroke:#5B8CFF,color:#FFFFFF,stroke-width:2.5px;
    classDef surface fill:#0D1117,stroke:#22D3EE,color:#FFFFFF,stroke-width:1.8px;
    classDef clinical fill:#0D1117,stroke:#8B5CF6,color:#FFFFFF,stroke-width:1.8px;
    classDef control fill:#0D1117,stroke:#14B8A6,color:#FFFFFF,stroke-width:1.8px;
    classDef shared fill:#0D1117,stroke:#64748B,color:#FFFFFF,stroke-width:1.5px;

    class Root core;
    class Landing,Story,Insights,Ecosystem surface;
    class Pedia,API clinical;
    class Wiki control;
    class L1,L2,S1,I1,P1,E1,W1,A1 shared;

08 / HOMEPAGE TOPOLOGY

The landing page is rendered from app/page.tsx as a 15-section scroll-driven editorial experience.

%%{init: {"flowchart": {"padding": 18}, "themeVariables": {"fontFamily": "monospace", "fontSize": "11px"}}}%%
flowchart TB
    Page["Landing Page<br/>app/page.tsx"]

    Hero["Hero<br/>rotating keyword + Audrey card"]
    Slider["ProjectSlider<br/>clinical footage"]
    AboutSentra["AboutSentra<br/>platform introduction"]
    About["About<br/>manifesto + Asclepius clock"]
    Ecosystem["Ecosystem<br/>pinned product cards"]
    Clients["Clients<br/>technology + institution marks"]
    SentraSim["SentraSim<br/>clinical screen + terminal"]
    Interlude["Interlude<br/>visual breather"]
    Blueprint["BlueprintStory<br/>AADI + console + trajectory"]
    Showcase["Showcase<br/>agents + thinking stack"]
    Services["Services<br/>accordion"]
    ClinicalSuite["ClinicalSuite<br/>triage + trajectory + prognosis"]
    Gallery["ScrollGallery<br/>scroll-driven imagery"]
    FAQ["FAQ<br/>JSON-LD FAQPage"]
    Footer["Footer<br/>brand plate + disclaimer"]

    Page --> Hero
    Page --> Slider
    Page --> AboutSentra
    Page --> About
    Page --> Ecosystem
    Page --> Clients
    Page --> SentraSim
    Page --> Interlude
    Page --> Blueprint
    Page --> Showcase
    Page --> Services
    Page --> ClinicalSuite
    Page --> Gallery
    Page --> FAQ
    Page --> Footer

    classDef page fill:#0D1117,stroke:#5B8CFF,color:#FFFFFF,stroke-width:4px;
    classDef hero fill:#0D1117,stroke:#22D3EE,color:#FFFFFF,stroke-width:3px;
    classDef product fill:#0D1117,stroke:#5B8CFF,color:#FFFFFF,stroke-width:2px;
    classDef clinical fill:#0D1117,stroke:#8B5CF6,color:#FFFFFF,stroke-width:2px;
    classDef content fill:#0D1117,stroke:#22D3EE,color:#FFFFFF,stroke-width:2px;
    classDef governance fill:#0D1117,stroke:#14B8A6,color:#FFFFFF,stroke-width:2px;

    class Page page;
    class Hero,About,Footer hero;
    class Ecosystem,Showcase,Services product;
    class SentraSim,Blueprint,ClinicalSuite clinical;
    class Slider,AboutSentra,Clients,Interlude,Gallery content;
    class FAQ governance;

09 / HOMEPAGE SECTIONS

| _# | _Section | _Function | | _--: | _{----------------} | _{-----------------------------------------------------------------------------------------------------} | | ₁ | _Hero | _{Rotating GSAP headline keyword, count-up metrics, 4-phase Audrey consultation card, ambient scan-line} | | ₂ | _{ProjectSlider} | _{Full-bleed clinical footage and product atmosphere} | | ₃ | _AboutSentra | _{Platform introduction and positioning} | | ₄ | _About | _{Manifesto section with light plate, GSAP draw-in rules, and Asclepius clock mark} | | ₅ | _Ecosystem | _{Horizontally pinned product cards with GSAP scrub and typing subtitle} | | ₆ | _Clients | _{Technology and institution marks} | | ₇ | _SentraSim | _{Embedded clinical screen simulation with live code terminal} | | ₈ | _Interlude | _{Static visual breather between pinned sequences} | | ₉ | _{BlueprintStory} | _{Pinned multi-scene blueprint narrative covering AADI, console, and trajectory} | | ₁₀ | _Showcase | _{Orchestration agents and thinking-stack terminal} | | ₁₁ | _Services | _{Service accordion} | | ₁₂ | _{ClinicalSuite} | _{Tabbed clinical workspace for triage, trajectory, and prognosis} | | ₁₃ | _{ScrollGallery} | _{Scroll-driven product and clinical imagery} | | ₁₄ | _FAQ | _{12-question FAQ section with two-column cream plate and JSON-LD FAQPage} | | ₁₅ | _Footer | _{Acid-yellow brand plate with contact, waiting list, stewardship, and medical disclaimer} |

10 / CLINICAL-AI BOUNDARY

Sentraverse must explain Sentra clearly without overstating clinical capability.

%%{init: {"flowchart": {"padding": 18}, "themeVariables": {"fontFamily": "monospace", "fontSize": "11px"}}}%%
flowchart LR
    Data["Clinical Context<br/>symptoms, signals, workflow, references"] --> CDSS["Clinical Decision Support"]
    CDSS --> Triage["Triage Awareness"]
    CDSS --> Trajectory["Clinical Trajectory"]
    CDSS --> Reference["Clinical Reference"]
    CDSS --> Escalation["Escalation Support"]

    Clinician["Licensed Clinician"] --> Judgment["Professional Medical Judgment"]
    CDSS --> Judgment
    Judgment --> Decision["Diagnosis, Therapy, Referral, Follow-up"]

    AI["Generative AI Layer"] --> Explain["Explanation + Summarization"]
    AI --> Education["Editorial + Knowledge Support"]
    AI -. must not replace .-> Judgment

    classDef source fill:#0D1117,stroke:#64748B,color:#FFFFFF,stroke-width:2px;
    classDef cdss fill:#0D1117,stroke:#8B5CF6,color:#FFFFFF,stroke-width:3px;
    classDef clinical fill:#0D1117,stroke:#8B5CF6,color:#FFFFFF,stroke-width:2px;
    classDef human fill:#0D1117,stroke:#F59E0B,color:#FFFFFF,stroke-width:3px;
    classDef ai fill:#0D1117,stroke:#8B5CF6,color:#FFFFFF,stroke-width:2px;
    classDef decision fill:#0D1117,stroke:#F59E0B,color:#FFFFFF,stroke-width:4px;

    class Data source;
    class CDSS cdss;
    class Triage,Trajectory,Reference,Escalation clinical;
    class Clinician,Judgment human;
    class AI,Explain,Education ai;
    class Decision decision;

Boundary Rules

_Layer	_Allowed	_{Not Allowed}
_Website	_{Explain mission, workflow, product surfaces, and governance}	_{Claim autonomous diagnosis or treatment}
_Sentrapedia	_{Provide structured clinical reference}	_{Replace clinical examination}
_{Clinical simulation}	_{Demonstrate workflow and escalation logic}	_{Pretend to be real patient management}
_{AI explanation}	_{Clarify, summarize, and support comprehension}	_{Override licensed clinician judgment}
_{Product claim}	_{State CDSS support role}	_{State medical-device equivalence without registration}

11 / MEDICAL SAFETY MODEL

%%{init: {"flowchart": {"padding": 18}, "themeVariables": {"fontFamily": "monospace", "fontSize": "11px"}}}%%
flowchart TD
    Claim["Clinical or Product Claim"] --> Check{"Is it bounded?"}
    Check -->|Yes| Source{"Has source/context?"}
    Check -->|No| Block["Block or Rewrite Claim"]

    Source -->|Yes| Label{"Correctly labeled?"}
    Source -->|No| Caution["Mark as reference / educational only"]

    Label -->|Yes| Display["Display Safely"]
    Label -->|No| Revise["Revise with CDSS boundary"]

    Display --> Disclaimer["Medical Disclaimer"]
    Caution --> Disclaimer
    Revise --> Disclaimer
    Block --> SafeCopy["Use safer product language"]

    classDef claim fill:#0D1117,stroke:#64748B,color:#FFFFFF,stroke-width:2px;
    classDef check fill:#0D1117,stroke:#14B8A6,color:#FFFFFF,stroke-width:2px;
    classDef safe fill:#0D1117,stroke:#22D3EE,color:#FFFFFF,stroke-width:3px;
    classDef warn fill:#0D1117,stroke:#F59E0B,color:#FFFFFF,stroke-width:2px;
    classDef block fill:#0D1117,stroke:#F43F5E,color:#FFFFFF,stroke-width:3px;
    classDef disclaimer fill:#0D1117,stroke:#14B8A6,color:#FFFFFF,stroke-width:3px;

    class Claim claim;
    class Check,Source,Label check;
    class Display safe;
    class Caution,Revise warn;
    class Block,SafeCopy block;
    class Disclaimer disclaimer;

12 / ROUTE MAP

_Route	_Rendering	_Purpose
_/	_Static	_{Landing page with 15-section scroll-driven product experience}
_/story	_Static	_{Founder story, product milestones, timeline, and roadmap}
_/insights	_Static	_{Clinical-AI editorial index}
_/sentrapedia	_Static	_{144-disease clinical reference for primary care}
_/ekosistem	_Static	_{Sentra product ecosystem and application catalog}
_/sentrawiki	_Static	_{Knowledge base, architecture, governance, and compliance}
_/privacy	_Static	_{Privacy policy}
_/terms	_Static	_{Terms of use}
_/api/*	_{Edge / Node}	_{Supporting API routes for medical knowledge and assistant integrations}

%%{init: {"flowchart": {"padding": 18}, "themeVariables": {"fontFamily": "monospace", "fontSize": "11px"}}}%%
flowchart TB
    Root["sentraverse"] --> Home["/"]
    Root --> Story["/story"]
    Root --> Insights["/insights"]
    Root --> Pedia["/sentrapedia"]
    Root --> Ecosystem["/ekosistem"]
    Root --> Wiki["/sentrawiki"]
    Root --> Legal["/privacy + /terms"]
    Root --> API["/api"]

    API --> Knowledge["medical knowledge"]
    API --> Assistant["assistant integrations"]
    API --> Dashboard["dashboard rewrites"]

    classDef root fill:#0D1117,stroke:#5B8CFF,color:#FFFFFF,stroke-width:4px;
    classDef public fill:#0D1117,stroke:#22D3EE,color:#FFFFFF,stroke-width:2px;
    classDef content fill:#0D1117,stroke:#22D3EE,color:#FFFFFF,stroke-width:2px;
    classDef clinical fill:#0D1117,stroke:#8B5CF6,color:#FFFFFF,stroke-width:2px;
    classDef legal fill:#0D1117,stroke:#14B8A6,color:#FFFFFF,stroke-width:2px;

    class Root root;
    class Home,Story public;
    class Insights,Ecosystem,Wiki content;
    class Pedia,API,Knowledge,Assistant,Dashboard clinical;
    class Legal legal;

13 / ARCHITECTURE FOLDER MAP

sentraverse/
├── app/
│   ├── page.tsx               # Landing page — 15 sections
│   ├── layout.tsx             # Root layout, fonts, JSON-LD, SmoothScrollProvider
│   ├── globals.css            # Design tokens, scoped themes, keyframes
│   ├── story/                 # Founder and product story
│   ├── insights/              # Editorial index and article data
│   ├── sentrapedia/           # 144-disease clinical reference
│   ├── ekosistem/             # Product ecosystem catalog
│   ├── sentrawiki/            # Knowledge base with paper theme
│   ├── privacy/               # Privacy policy
│   ├── terms/                 # Terms of use
│   ├── api/                   # Supporting API routes
│   ├── sitemap.ts             # Dynamic sitemap
│   ├── robots.ts              # Robots convention
│   └── opengraph-image.tsx    # Generated OpenGraph image
│
├── components/
│   ├── *.tsx                  # Section components
│   ├── blueprint-story/       # Pinned blueprint scenes
│   ├── sentrasim/             # Simulation columns, code terminal, sequence
│   ├── sentrapedia/           # Disease dataset and helpers
│   ├── sentrawiki/            # Engine cards, engine graph, document library
│   ├── ekosistem/             # Product and application data
│   └── ui/                    # UI primitives
│
├── lib/
│   ├── design-governance.ts   # Layout and typography governance
│   ├── use-smooth-scroll.ts   # Custom lerp wheel-smoothing hook
│   ├── site-links.ts          # Internal link single source of truth
│   └── utils.ts               # cn() helper
│
├── docs/                      # Project documentation
├── e2e/                       # Playwright smoke tests
└── public/                    # Static assets

14 / TECHNOLOGY STACK

_Layer	_Technology
_Framework	_{Next.js 16.2, App Router, webpack}
_{Runtime UI}	_{React 19}
_Language	_{TypeScript 5.9, strict mode}
_Styling	_{Tailwind CSS v4 with @theme}
_Animation	_{GSAP 3.14, ScrollTrigger, Framer Motion 12}
_Testing	_{Playwright E2E smoke}
_Runtime	_{Node.js 22+}
_{Package manager}	_pnpm

%%{init: {"flowchart": {"padding": 18}, "themeVariables": {"fontFamily": "monospace", "fontSize": "11px"}}}%%
flowchart LR
    Next["Next.js 16.2<br/>App Router + webpack"] --> App["Sentraverse App"]
    React["React 19"] --> App
    TS["TypeScript 5.9<br/>strict"] --> App
    Tailwind["Tailwind CSS v4"] --> UI["Design System"]
    GSAP["GSAP 3.14<br/>ScrollTrigger"] --> Motion["Motion Layer"]
    Framer["Framer Motion 12"] --> Motion
    Motion --> UI
    Playwright["Playwright"] --> Tests["E2E Smoke Suite"]
    Node["Node.js 22+"] --> Runtime["Runtime"]
    Pnpm["pnpm"] --> Runtime

    App --> UI
    App --> Runtime
    App --> Tests

    classDef framework fill:#0D1117,stroke:#5B8CFF,color:#FFFFFF,stroke-width:4px;
    classDef ui fill:#0D1117,stroke:#22D3EE,color:#FFFFFF,stroke-width:2px;
    classDef motion fill:#0D1117,stroke:#8B5CF6,color:#FFFFFF,stroke-width:2px;
    classDef test fill:#0D1117,stroke:#14B8A6,color:#FFFFFF,stroke-width:2px;
    classDef runtime fill:#0D1117,stroke:#64748B,color:#FFFFFF,stroke-width:2px;

    class Next,React,TS,App framework;
    class Tailwind,UI ui;
    class GSAP,Framer,Motion motion;
    class Playwright,Tests test;
    class Node,Pnpm,Runtime runtime;

15 / DESIGN TOKENS

Core design tokens are governed through:

app/globals.css
Tailwind CSS @theme
lib/design-governance.ts

_Token	_Value	_Role
_--sentra-bg	_#1e1e1e	_{Permanent dark site background}
_--sentra-fg	_#b7ab98	_{Primary foreground ink}
_{--sentra-accent}	_#eb5939	_{Sentra red-orange accent}
_{--sentra-primary}	_#4a7bb5	_{Oxford blue lifted for dark readability}
_{Paper scope}	_{#f2ebe0 / #002147}	_{SentraWiki cream plate and navy ink}
_{Footer plate}	_{#e9fb5b / #111111}	_{Acid-yellow brand anomaly}

16 / MOTION SYSTEM

Sentraverse uses motion as a product explanation layer.

_{Motion Pattern}	_Purpose
_{GSAP pinned sections}	_{Explain long-form product narrative}
_{ScrollTrigger scrub}	_{Tie animation to user intent}
_{Rotating hero keyword}	_{Communicate product scope quickly}
_{Count-up metrics}	_{Create executive-level energy}
_{Clinical simulation sequence}	_{Show workflow without claiming real patient management}
_{Framer Motion entrances}	_{Improve orientation and section rhythm}
_{Reduced-motion support}	_{Respect accessibility preferences}

Implementation discipline:

use anticipatePin for stable pinned transitions
use invalidateOnRefresh for responsive recalculation
avoid motion that hides information
avoid autoplay clinical claims
keep animation subordinate to product meaning

17 / BUILD PROTOCOL

Prerequisites

_Requirement	_Version
_Node.js	_{>= 22}
_pnpm	_{>= 9}

Install

pnpm install

Development

pnpm dev

Local server:

http://localhost:3000

Production

pnpm build
pnpm start

Validation

pnpm lint
pnpm build
pnpm test:e2e

Execution notes:

Use pnpm, not npm/yarn/bun.
The site runs with zero required environment configuration.
Production-facing changes should pass build, lint, and Playwright smoke validation.
Scroll-driven sections require visual sanity checks after layout or animation changes.

18 / ENVIRONMENT VARIABLES

All environment variables are optional.

_Variable	_Scope	_Purpose
_{NEXT_PUBLIC_PILOT_LOGIN_URL}	_Client	_{Target URL for the “Tes Pilot Login” CTA. Validated against an allow-list of sentrahai.com hosts and falls back to /dashboard.}
_{SENTRA_DASHBOARD_URL}	_Server	_{When set, next.config.mjs rewrites /dashboard/:path* to that origin, allowing the marketing host to front the clinical dashboard.}

19 / TESTING & GOVERNANCE

%%{init: {"flowchart": {"padding": 18}, "themeVariables": {"fontFamily": "monospace", "fontSize": "11px"}}}%%
flowchart TD
    Change["Code Change"] --> Typecheck["TypeScript Strict Build"]
    Change --> Lint["ESLint"]
    Change --> E2E["Playwright Smoke Test"]
    Change --> Visual["Visual Scroll Review"]
    Change --> Safety["Clinical Claim Review"]
    Change --> SEO["SEO / Metadata Check"]

    Typecheck --> Pass["Can Merge"]
    Lint --> Pass
    E2E --> Pass
    Visual --> Pass
    Safety --> Pass
    SEO --> Pass

    Typecheck -. fail .-> Block["Block Merge"]
    Lint -. fail .-> Block
    E2E -. fail .-> Block
    Visual -. fail .-> Block
    Safety -. fail .-> Block
    SEO -. fail .-> Block

    classDef change fill:#0D1117,stroke:#64748B,color:#FFFFFF,stroke-width:2px;
    classDef check fill:#0D1117,stroke:#14B8A6,color:#FFFFFF,stroke-width:2px;
    classDef pass fill:#0D1117,stroke:#22D3EE,color:#FFFFFF,stroke-width:3px;
    classDef block fill:#0D1117,stroke:#F43F5E,color:#FFFFFF,stroke-width:3px;

    class Change change;
    class Typecheck,Lint,E2E,Visual,Safety,SEO check;
    class Pass pass;
    class Block block;

Required Validation

_Area	_{Minimum Check}
_{Type safety}	_{TypeScript strict build must pass}
_Lint	_{ESLint must pass}
_E2E	_{Playwright smoke suite must pass}
_{Scroll experience}	_{GSAP pinned sections must remain stable}
_{Accessibility}	_{Motion should respect reduced-motion preferences}
_{Clinical language}	_{Claims must remain within CDSS boundary}
_{Medical disclaimer}	_{Disclaimer must remain visible and accurate}
_SEO	_{Sitemap, robots, metadata, OpenGraph, and JSON-LD must remain valid}

20 / SEO & DISCOVERABILITY

Sentraverse includes structured SEO and AI-discoverability support.

_Asset	_Purpose
_{app/sitemap.ts}	_{Dynamic sitemap}
_{app/robots.ts}	_{Robots convention and /dashboard exclusion}
_{app/opengraph-image.tsx}	_{Generated OpenGraph image}
_{JSON-LD Organization}	_{Identifies Sentra Healthcare AI}
_{JSON-LD Person}	_{Identifies founder profile}
_{JSON-LD FAQPage}	_{Supports FAQ discoverability}
_{public/llms.txt}	_{Context surface for AI crawlers}
_{Google Search Console file}	_{Search verification}

21 / DOCUMENTATION

_Document	_Content
_{docs/README.md}	_{Documentation index}
_{ARCHITECTURE.md}	_{Architecture deep-dive}
_{docs/design-governance.md}	_{Spacing, typography, density, and layout rules}
_{docs/ai-governance.md}	_{Clinical-AI governance principles}
_CHANGELOG.md	_{Release history}
_{CONTRIBUTING.md}	_{Contribution workflow}
_SECURITY.md	_{Security policy}

22 / MOST IMPORTANT FILES

_File	_{Why It Matters}
_app/page.tsx	_{Main landing page and 15-section composition}
_{app/layout.tsx}	_{Root layout, fonts, JSON-LD, and SmoothScrollProvider}
_{app/globals.css}	_{Design tokens, scoped themes, keyframes}
_{lib/design-governance.ts}	_{Layout and typography governance}
_{lib/use-smooth-scroll.ts}	_{Custom lerp wheel-smoothing hook}
_{lib/site-links.ts}	_{Internal link single source of truth}
_{components/Hero.tsx}	_{Main product thesis and first impression}
_{components/Ecosystem.tsx}	_{Horizontally pinned product ecosystem}
_{components/SentraSim.tsx}	_{Embedded clinical screen simulation}
_{components/ClinicalSuite.tsx}	_{Triage, trajectory, and prognosis workspace}
_{components/blueprint-story/*}	_{Pinned blueprint scenes}
_{components/sentrapedia/*}	_{144-disease clinical reference}
_{components/sentrawiki/*}	_{Knowledge base, engine cards, and document library}
_{components/ekosistem/*}	_{Product and application catalog}

23 / PRODUCT TRUTH PRINCIPLES

Sentraverse is intentionally governed by these rules:

Clinical-AI must be explained without exaggeration.
Sentra is clinical decision support, not a doctor replacement.
The website must communicate workflow, not just aesthetics.
Every clinical claim must remain bounded and responsible.
Motion must clarify the product story, not distract from it.
Sentrapedia is reference support, not diagnosis automation.
SentraWiki is the architecture and governance anchor.
The ecosystem must feel integrated, not like disconnected products.
Trust is built through clarity, boundaries, and disciplined language.
The public surface must protect the seriousness of the clinical mission.

24 / MEDICAL DISCLAIMER

Sentra AI functions as a clinical decision support system.

It is designed to support clinical reasoning, triage awareness, workflow acceleration, and timely escalation. It does not replace professional medical judgment, licensed clinical responsibility, clinical examination, diagnosis, therapy, referral decisions, or formal follow-up planning by healthcare professionals.

Sentra AI is not registered as a medical device.

All diagnostic, therapeutic, referral, and follow-up decisions remain the full responsibility of licensed medical professionals.

25 / LICENSE

26 / CONTACT

dr. Ferdi Iskandar — Founder & CEO, Sentra Healthcare AI

_{Lab: Melinda Advanced Technology Laboratory · Location: Kediri, East Java}

27 / LET'S CONNECT

28 / ACTIVE STACK

_{PROJECT-DECLARED TECHNOLOGY SURFACE · PRESERVED FROM SOURCE README}

`NEXT.JS 16.2` App Router application framework with webpack.	`REACT 19` Runtime UI layer for the Sentraverse application.
`TYPESCRIPT 5.9` Strict-mode application language.	`TAILWIND CSS v4` Theme-driven styling surface using `@theme`.
`GSAP 3.14 + SCROLLTRIGGER` Scroll-bound narrative and pinned motion sequences.	`FRAMER MOTION 12` Entrance motion and interface orientation.
`PLAYWRIGHT` E2E smoke validation.	`NODE.JS 22+ · PNPM` Runtime and package-management baseline.

29 / INSTRUMENTATION

DECLARED TECHNOLOGY SURFACE · COMPACT / CATEGORY-BASED

`01 · LANGUAGES & RUNTIMES` TypeScript 5.9 · Node.js 22+ · PowerShell	`02 · FRONTEND & UI ENGINE` Next.js 16.2 · React 19 · Tailwind CSS v4 · webpack
`03 · MOTION & INTERACTION` GSAP 3.14 · ScrollTrigger · Framer Motion 12	`04 · TESTING & QA` Playwright E2E smoke · ESLint · TypeScript strict build · visual scroll review
`05 · PACKAGE & BUILD` pnpm · Next.js build pipeline · webpack	`06 · HOSTING / DELIVERY` Vercel is listed in the source instrumentation; static and Edge/Node route modes are declared elsewhere in this README.

Dedicated to Aldebaran, Aimee, Audrey, and Del — & the Indonesia Healthcare Ecosystem.
Sentra Artificial Intelligence · Indonesia
_{// GUIDED BY HUMAN INSIGHT · CLINICAL AUTHORITY REMAINS HUMAN}

Name		Name	Last commit message	Last commit date
.agents		.agents
.github		.github
app		app
components		components
docs		docs
e2e		e2e
lib		lib
public		public
scripts		scripts
src		src
tests		tests
.editorconfig		.editorconfig
.env.example		.env.example
.gitattributes		.gitattributes
.gitignore		.gitignore
AGENTS.md		AGENTS.md
ARCHITECTURE.md		ARCHITECTURE.md
CHANGELOG.md		CHANGELOG.md
CONTRIBUTING.md		CONTRIBUTING.md
LICENSE		LICENSE
README.md		README.md
ROADMAP.md		ROADMAP.md
SECURITY.md		SECURITY.md
eslint.config.mjs		eslint.config.mjs
next.config.mjs		next.config.mjs
package.json		package.json
playwright.config.ts		playwright.config.ts
pnpm-lock.yaml		pnpm-lock.yaml
pnpm-workspace.yaml		pnpm-workspace.yaml
postcss.config.mjs		postcss.config.mjs
project.contract.json		project.contract.json
tsconfig.json		tsconfig.json

Latest commit

History

Folders and files

Repository files navigation