---
description: "一个完整开屏展示：手写 Banana TubeGeometry、Pointer 视差、玻璃折射与 GPU Fluid Push；后续独立特效按第二、第三篇追加"
---

# HAOQI 官网效果拆解

haoqi.design[^haoqi] 的 3D 字形、玻璃材质、Pointer 视差与液体 Hover 效果复刻。

- [01 · 3D 开场专题](01-opening.md) —— 完整开屏、独立果冻模型、Hover 涟漪三个可交互 Demo

站上另外两个效果（滚动阶段的材质切换、页脚的液体 Hover）还没拆，拆完再回来加。

自制资产：[Banana SVG 中心线](assets/banana-centerline.svg) · [Banana GLB](assets/banana-tube.glb) · [生成脚本](assets/generate-banana-glb.mjs)

[^haoqi]: [haoqi.design](https://haoqi.design/)，2026-07-28 读。