Palmora CPO — Palm Oil Supply Chain 3D Landing Page preview 1

Palmora CPO — Palm Oil Supply Chain 3D Landing Page

Bilingual cinematic landing page for a palm-oil supply-chain brand, built on a fully procedural Three.js 3D scene with scroll-linked camera choreography.

Website DraftLanding PageAvailableRp 14.000BeginnerUpdated 2026-07-14Next.js 16, React 19, TypeScript, React Three Fiber / Three.js, Zod, JSON-file store
Demo

Description

A bilingual (EN/ID) Next.js 16 cinematic landing page for a palm-oil supply-chain brand. The 3D scene is fully procedural Three.js/React Three Fiber — no imported .glb/.gltf model files — with scroll-linked camera, field-of-view, and target choreography plus depth-of-field, bloom, vignette, and fog postprocessing. Automatically falls back to a bundled MP4 for browsers without WebGL. Includes a working inquiry form with Zod validation and a spam honeypot, an HMAC-signed HttpOnly admin session for reviewing submissions, and JSONL-file persistence — no external database or third-party API required.

What Already Works

Fully procedural Three.js 3D scene — no imported .glb/.gltf model files
Scroll-linked camera choreography with depth-of-field, bloom, vignette, and fog postprocessing
Automatic MP4 video fallback for browsers without WebGL
Zod-validated inquiry form with a spam honeypot field
HMAC-signed HttpOnly admin session for reviewing inquiries
Bilingual (EN/ID) content

What's Included

  • Full source code
  • README and setup guide
  • InMyDraft Commercial License
  • AI-ready docs (PRD, technical spec, architecture, Three.js motion spec)

How to Run

  1. Unzip the source and run npm ci (or npm install).
  2. Copy .env.example to .env.
  3. Run npm run dev and open http://localhost:3000.
  4. See FIX_INSTALL_WINDOWS.md if npm ci fails on Windows.

Continuation Notes

  • docs/fidelity-ledger.md documents an intentional deviation: the shipped geometry is stylized rather than photorealistic like the original concept art — worth knowing before customizing.

Known Limitations

  • No certification, traceability, or quality claims are made about the palm-oil supply chain itself — explicitly disclaimed in the docs
  • JSONL file persistence, not a production database
  • No CMS — copy changes require editing source
  • Admin default credentials must be changed before any public deployment
Preview of Bricket Export Website
Website DraftLanding PageAvailable

Bricket Export Website

Multi-language coconut charcoal export website draft for B2B quote requests, product specs, OEM/private-label positioning, and trust-heavy buyer flows.

Next.js 14React 18TypeScriptSanity CMS (client)next-intl (7 locales, RTL)+4

Rp 14.000

Preview of Affiliate Website
Website DraftLanding PageAvailable

Affiliate Website

Affiliate catalog draft for curated products, multi-link comparison, disclosure-ready content, and admin-managed landing pages.

Next.js 16 (App Router)React 19TypeScriptTailwind CSS 4 (Material Design 3 tokens)flat-file JSON storage+1

Rp 14.000

Preview of GoodWearpack Supplier Website
Website DraftLanding PageAvailable

GoodWearpack Supplier Website

Global B2B supplier website draft for industrial wearpack, safety workwear, and RFQ-first procurement flows.

Next.js 16 (App Router)React 19TypeScriptnext-intl (7 locales, RTL)Tailwind CSS 4+1

Rp 14.000