UnboundOcean Website / 未界寻洋官网

Commercial bilingual website rebuild for UnboundOcean / 未界寻洋, a cross-border sales and local deployment partner helping enterprise intelligent service solutions enter Southeast Asia.

面向 UnboundOcean / 未界寻洋 的商业级双语官网重建项目。网站定位为企业智能服务方案进入东南亚市场的销售拓展与本地落地伙伴，强调可信、简洁、商务化的品牌表达。

Live Demo / 在线访问

• Production: https://unboundocean.vercel.app
• Chinese homepage: https://unboundocean.vercel.app/zh
• AI assistant page: https://unboundocean.vercel.app/zh/chat
• GitHub repository: https://github.com/MakerFlyFly/UnboundOcean

Project Highlights / 项目亮点

• 以黑白极简商务风格重建企业官网，结合柔光浅色背景、灰色像素地球动效和克制的版式节奏。
• 完成英文与中文的信息架构和内容本地化，中文官网使用品牌名 未界寻洋。
• 为 /、/chat、/zh、/zh/chat 生成独立静态 HTML 与 SEO 元信息，提升公开分享与搜索展示质量。
• 实现轻量 AI 助手页面，用于介绍市场覆盖、服务方式、方案能力和联系方式。
• 使用 Vercel 完成生产部署，并配置安全响应头。

Tech Stack / 技术栈

• React 19
• TypeScript
• Vite
• Canvas animation
• Responsive CSS
• Vercel static deployment
• GitHub public repository workflow

Architecture / 工程实现

• src/content/siteContent.ts manages bilingual website copy and navigation.
• src/components/PixelGlobe.tsx renders the gray pixel-globe canvas animation.
• scripts/write-route-html.mjs generates route-specific static HTML metadata after the Vite build.
• vercel.json defines production security headers without stale rewrites, allowing each generated route HTML file to be served directly.

Production Routes / 生产路由

The production build generates static HTML for each public route:

• /
• /chat
• /zh
• /zh/chat

npm run build runs Vite and then scripts/write-route-html.mjs to write route-specific metadata for canonical URLs, hreflang alternates, Open Graph, and Twitter cards.

Local Development / 本地开发

npm install
npm run dev

Quality Checks / 质量检查

npm run lint
npm run build
npm audit --audit-level=low

Security / Privacy / 安全与隐私

This repository does not include API keys, access tokens, private keys, .env files, or private deployment credentials. The website is built as a static frontend and does not depend on private frontend environment variables.

本仓库不包含 API key、access token、私钥、.env 文件或私密部署凭据。项目是静态前端网站，不依赖前端私密环境变量。

Resume Bullets / 简历描述

English

• Rebuilt and deployed a bilingual commercial website for UnboundOcean using React, TypeScript, Vite, and Vercel.
• Designed route-specific static SEO for English and Chinese pages, including canonical URLs, hreflang, Open Graph, and Twitter metadata.
• Implemented a responsive black-and-white business visual system with a canvas-based gray pixel-globe animation and localized Chinese brand messaging.

中文

• 使用 React、TypeScript、Vite 和 Vercel 重建并部署 UnboundOcean / 未界寻洋双语商业官网。
• 为英文与中文路由实现独立静态 SEO，包括 canonical、hreflang、Open Graph 和 Twitter 元信息。
• 设计黑白极简商务视觉体系，实现灰色像素地球 Canvas 动效，并完成中文品牌文案本地化。