maheswara-4d.vercel.app
- 婚礼当天四幕
- 4
- 语言（印尼语/英语）
- 2
- 解答新人的困扰
- 9
- 静态文件，无需服务器
- 1
背景
挑战
新人往往在短时间内比较多家婚礼策划公司，而大多数婚礼网站都大同小异：照片集、套餐列表和一个 WhatsApp 按钮。成立于 2007 年的 Maheswara 需要一个一打开就与众不同的网站，同时不能淹没新人最关心的实用信息：套餐、场地、付款方式和联系方式。
我们的方案
我们在 Three.js 3D 世界之上打造了一个单页网站。访客穿过一道“门”进入，随后滚动会带他们从 2007 年走到今天，光线也从清晨变为夜晚。在“婚礼当天”板块，可以把一天从 05:30 拖动到 23:00，经历四幕，每一幕都有专属 3D 场景。所有内容都放在易读的卡片上，咨询表单会自动生成 WhatsApp 消息。
核心功能
我们打造的功能
入口之门
访客点击进入时播放穿越动画，也可选择静音进入。
可拖动的婚礼当天
从 05:30 到 23:00 的准备、仪式、婚宴与派对，每一幕都有专属 3D 场景。
Three.js 3D 世界
背景中有金色戒指、花瓣、光尘以及旋转的超立方体。
时间线与光影
滚动时年份从 2007 走到 2026，氛围从清晨变为夜晚。
生成式音效
可选的 Web Audio 背景音，音高随时间变化，一键即可静音。
随动镜头
3D 镜头在电脑上跟随鼠标，在手机上跟随陀螺仪。
表单直达 WhatsApp
姓名、婚礼类型、套餐、日期和场地会整理成一条 WhatsApp 消息，无需后端。
双语
ID/EN 切换，兼顾本地与国际新人，动画也会遵循“减少动态效果”设置。
图库
应用界面
maheswara-4d.vercel.app
maheswara-4d.vercel.app
maheswara-4d.vercel.app
maheswara-4d.vercel.app
maheswara-4d.vercel.app
maheswara-4d.vercel.app
手机端自适应
- 移动端首屏
- 移动端仪式环节
技术
技术栈
- Three.js
- WebGL
- HTML5
- CSS3
- JavaScript
- Web Audio API
- DeviceOrientation API
- Vercel
成效
为客户带来的成果
- 访客在浏览套餐之前，就能先感受到婚礼当天的氛围。
- 套餐、场地、评价、常见问题和联系方式在 3D 体验之上依然清晰易读。
- 每条咨询都以完整、整洁的 WhatsApp 消息送达。
- 单个静态文件，加载快、托管成本低，无需服务器或数据库。
