Framist's Little House

◇ 自顶而下 - 面向未来 ◇

0%

SSVEP-Next

SSVEP Next:现代化的 SSVEP 可视化 Web 快速实现

在线使用 | Github

image

SSVEP-Next 是一个基于 React、TypeScript 和 Vite 构建的单页面应用(SPA),用于快速设计和运行稳态视觉诱发电位(SSVEP)实验的视觉刺激界面。该项目继承自 quick-ssvep 的核心科学算法,并在架构和交互体验上进行了全面升级。

主要特性包括:

  • 拖拽式可视化设计:用户可通过拖拽和属性面板,直观地在画布上布局和配置刺激方块。
  • 实时属性调整:支持对刺激频率、文本、颜色、位置和尺寸等参数的实时修改。
  • 高精度刺激渲染:采用 requestAnimationFrame 实现精确的时序控制,支持直接测量瞬时频率和滑动窗口平均频率,动态监控帧率。
  • 状态管理与持久化:使用 Zustand 进行集中式状态管理,支持本地存储、文件导入导出和一键分享链接。
  • 全屏运行与自动计时:支持全屏刺激模式和实验自动停止。
  • 现代前端架构:采用模块化组件结构,便于扩展和维护,并集成自动化部署流程。

与 quick-ssvep 相比,SSVEP-Next 提供了更友好的可视化交互、更完善的频率测量与反馈机制,以及更高效的项目管理和分享能力,适合科研人员和开发者快速搭建和测试 SSVEP 实验范式。

特性 quick-ssvep SSVEP-Next (本项目)
核心范式 参数化配置,代码驱动 可视化、拖拽式设计
技术架构 原生 JavaScript, HTML, CSS React, TypeScript, Vite (现代 Web 架构)
状态管理 全局变量,DOM 查询 Zustand (集中式、可预测的状态管理)
频率测量 直接测量瞬时/平均频率 继承并优化:实现相同的直接测量法,并增加滑动窗口平滑
帧率监控 启动前预估 实时动态监控,运行时反馈更准确
分享与协作 生成静态 URL 继承并优化 一键分享链接,轻松复现实验设计
部署 手动上传文件 CI/CD 自动化部署 (GitHub Actions)

image

注意:刺激器的性能(刺激的确切频率)在很大程度上取决于机器和运行它的 Web 浏览器。它不是为严格的学术用途而设计的,而是测试简单 SSVEP 设置的快速解决方案。