全部项目

Cimatica

已上线 · 2026
时间段
2026
技术
PWA · Next.js · React · Web Audio · WebGL · Supabase · Vercel

Cimatica 覆盖 33 个国家

西班牙;巴西;意大利;墨西哥;美国;德国;阿根廷;印度;哥伦比亚;日本;玻利维亚;加拿大;伊朗;以色列;葡萄牙;罗马尼亚;韩国;土耳其;阿拉伯联合酋长国;英国;阿尔巴尼亚;比利时;保加利亚;智利;多米尼加共和国;埃及;法国;匈牙利;巴拉圭;波兰;斯洛伐克;南非;越南

地图数据:Natural Earth

项目起点

我发起 Cimatica,是为了探索声音与形状之间的关系。我想先从分析麦克风采集的频率入手,让它们在浏览器中呈现出来。

问题与决策

分离信号

麦克风信号可能包含噪声、房间共振和回声。我围绕噪声底、持续性和置信度进行处理,以选择要跟踪的信号分量,并减少不确定检测结果引起的变化。

稳步前行,不停滞

图案如果随每一次波动而变化,就很难看清;如果变化太慢,又跟不上声音的变化。我在稳定处理与过渡效果之间寻找平衡,让使用者自行选择要组合多少种声音分量。

运作方式

  1. Next.js、React 和 TypeScript 运行于 Vercel。四种语言的公开页面均经过预渲染,便于阅读和分享。
  2. Web Audio 在设备本地分析麦克风信号。WebGL 直接在浏览器中绘制由频率驱动的数学图形。
  3. Supabase 负责身份验证,并存储已登录账户保存的报告。访客报告仅保存在标签页内存中。麦克风采集的原始音频不会上传。
  4. 我为可视化引擎配套了四种语言的指南、元数据和用户路径,将搜索发现与 PWA 体验衔接起来。

我的收获

声音相关的工作让我学会同时评估响应速度与可读性。流畅的过渡,只有在帮助用户理解变化时才有意义。我也将这一标准用于其他类型数据驱动的界面。

当前状态

已上线的产品。其图案是由声音频率驱动的数学可视化。

打开 Cimatica

面向公开内容的 SEO、GEO 与 AEO

在 Cimatica 面向公众的部分,我融入了 SEO(搜索引擎优化)、GEO(生成式引擎优化)和 AEO(答案引擎优化)。内容、上下文和结构都是让产品更容易被找到和理解的一部分。

我围绕人们的问题组织页面,并将解答与实例、来源及可验证的结果关联起来。了解我如何开展 SEO、GEO 和 AEO 工作。

有个有趣的问题?

告诉我你想构建或改进什么、谁会使用,以及有哪些约束条件。我会回复你,一起确定从哪里开始。