Skip to main content
ExodeUI

EXODEUI DESKTOP

A little space for good ideas.

Choose your platform to get the official ExodeUI installer.

Looking for Intel Mac or other builds? Explore the web studio or check all download options.

Prefer the browser? Try for free in your browser →

类别:互动动作

用于 UI 和产品体验的交互式动画工具

传统的动画工具会回放预先录制的时间线。 ExodeUI 为您提供了一个交互式画布,其中动画对光标速度、触摸手势和应用程序状态做出动态反应。

What is 用于 UI in ExodeUI?

交互式动画工具使设计人员和工程师能够创建实时响应用户输入、手势和系统状态的动态 UI 元素。 ExodeUI 将视觉动画设计与可执行交互逻辑联系起来,提供了一个可输出可用于生产的交互组件的视觉画布。

核心架构

为什么工程师和设计师选择 ExodeUI

Design, logic and motion in one file that runs inside your app.

手势优先架构

通过自动动量延续将组件状态直接绑定到指针速度、触摸拖动和拖动手势。

Core Architecture

中断运动

永远不用担心动画重新启动时出现断断续续的情况。当用户输入中断活动转换时,弹簧物理特性会自动平滑地重定向速度。

Core Architecture

Reactive 参数输入

使用外部变量(如滚动偏移、网络进度、光标距离或布尔属性)驱动动画。

Core Architecture

多框架支持

从单个交互式项目中导出适用于 React、Vue、Svelte、React Native 和 SwiftUI 的组件。

Core Architecture

客观评价

ExodeUI 相比如何 Linear Timeline Software

Where ExodeUI is stronger, and what to weigh before you switch.

The ExodeUI Architecture

ExodeUI

优势
  • 完全可中断性——动画在中断时平滑地重定向
  • 原生触摸和指针手势与动量集成
  • 直接反应式状态绑定,无需编写定制的 JS 监听器
  • 保留 Core Web Vitals 的小型代码包
Compared with

Linear Timeline Software

Trade-offs
  • 严格的关键帧时间线必须在重置之前完成播放
  • 没有用户速度或弹簧动力学的概念
  • 需要复杂的自定义粘合代码来连接真实的应用程序数据
  • 在低端移动设备上造成高输入延迟

开发者交接

在您的代码中使用它

Your app loads the compiled file through the ExodeUI runtime and talks to it through inputs and events.

从 'exodeui' 导入 { ExodeUICanvas };

// 弹簧、状态和计时位于 .exode 文件中(设计于
// 编辑器)。您的代码传递输入并听取事件返回。
导出函数 InteractiveToggle() {
  返回(
    <ExodeUI画布
      src="/interactive_toggle.bexode"
      输入={{活动}}
      onTrigger={(name) => console.log('ExodeUI 事件:', name)}
    />
  );
}

有疑问吗?

常见问题解答

通过真实的运动构建生命组件。

Start free in the browser or download the desktop app. Compile spring physics and state machines directly to React and SwiftUI.

免费试用