让阅读变成观察
昆虫不是装饰光标，而是会改变危险距离、壁虎警觉度、攻击结果与实验数据的可控对象。
PROJECT FILE / 2026
从一个互动镜头，到一座数字自然博物馆。
Gecko Atlas 将实时 3D 昆虫、视频切帧、行为状态机、开放授权影像和科普内容组织在同一个可探索的网站里。这里记录它为什么被设计，以及它如何工作。
01 / PROJECT BACKGROUND
项目目标
项目最初用于验证“鼠标移动能否成为生物行为叙事的一部分”。随着捕食、探索、反馈与科普模块加入，它被重构为一个兼顾公众学习、交互设计实验和求职作品集表达的数字自然博物馆。
把机制变成变量
脚趾吸附、伪装与体温管理被转换为可重复操作的教学模型，并明确标注模型边界。
展示完整决策链
不仅呈现最终画面，也公开信息架构、素材许可、状态机、本地数据与性能取舍。
02 / INFORMATION ARCHITECTURE
内容结构
六个章节形成从吸引注意、建立知识，到动手实验和理解保护责任的完整路径；访客也可以通过全站搜索直接进入任意档案或实验。
互动首页
壁虎追踪昆虫、危险距离、攻击与探索入口。
物种图鉴
壁虎科、石龙子科、鬣蜥科、避役科与巨蜥科。
身体奥秘
吸附、断尾、夜视、变色、捕食和体温调节。
行为实验室
四个可重复实验与本地实验记录。
栖息地地图
雨林、沙漠、岩壁、城市与岛屿生态。
保护与共处
生态价值、误解、居家共处、保护与贸易责任。
03 / TECHNICAL SYSTEM
技术实现
网站保持无框架、可静态部署的结构。媒体、交互、实验和数据各自解耦；失去 WebGL 时仍会显示可跟随指针的降级光标。
Pointer Events
水平位移驱动视频目标时间，同时向昆虫跟随、冲刺和危险距离系统提供坐标。
Video + Three.js
排队 seek 保持视频响应；FBX 昆虫独立渲染，组件以局部枢轴执行振翅与腿部步态。
Finite State Machine
稳定追踪、警觉、蓄力、攻击、命中、逃脱与冷却由状态和阈值控制。
Local Analytics
探索结局、反馈和实验结果只写入当前浏览器 localStorage，可查看、导出或清除。
04 / MODEL & MEDIA
模型与素材
FBX 模型没有依赖预制动画。组件经几何位置复核后，由代码建立局部旋转轴；网站照片仅使用可确认的开放许可证，并保留作者与原始页面。
独立翅膀组件
part_13 与 part_14 分别建立翅根枢轴，镜像振动并加入轻微相位差。
代码驱动步态
part_0、part_1、part_3、part_4、part_5、part_8 随移动速度显示交替步态。
开放授权登记
使用 Public Domain、CC0、CC BY 或 CC BY-SA 素材。查看完整图片署名页 ↗
05 / PRIVACY & ACCESSIBILITY
数据与边界
这个项目不需要账户，也没有远程行为分析服务。教学模型用于解释变量关系，不替代真实动物实验、饲养建议或物种级生理结论。
数据留在浏览器
实验记录、互动统计和反馈使用本地存储；清除浏览器站点数据即可移除。
渐进增强
视频有首帧等待与 seek 队列，3D 模型加载失败时显示轻量降级光标，内容页面仍可阅读。
桌面与移动端
图片提供 800 与 1600 像素 WebP 版本，非首屏延迟加载；信息布局在窄屏降为单列。
06 / PHASE 5D DELIVERY
作品集交付
核心网站、四个实验和首批素材之外，Phase 5D 已补齐重点物种长篇档案、分布地图、案例研究、README 与设备测试矩阵。下一阶段只处理公开部署与线上验证。
设计过程
问题定义、关键迭代、状态机、技术架构与内容责任已整理为完整案例研究。
档案深度
蛤蚧、海鬣蜥和科莫多巨蜥拥有独立长篇页面、示意分布地图与逐条来源。
公开部署
正式域名、HTTPS、缓存策略、线上性能测试与可分享 Demo 链接留到下一阶段。