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.
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
- Unzip the source and run npm ci (or npm install).
- Copy .env.example to .env.
- Run npm run dev and open http://localhost:3000.
- 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
Related Drafts
Travel Umroh Website
Travel landing draft for Umroh packages, inquiry flow, itinerary content, and trust sections.
GoodWearpack Supplier Website
Global B2B supplier website draft for industrial wearpack, safety workwear, and RFQ-first procurement flows.
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.