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 设计工具

绘制静态矩形并将其称为界面设计的时代已经结束。设计能够响应手势、尊重物理原理并清晰沟通的生活软件。

What is 生活软件交互 UI in ExodeUI?

交互式 UI 设计是创建用户界面的学科,其行为类似于触觉、物理系统,而不是静态图片。 ExodeUI 是一个交互式 UI 设计引擎,它用响应式、有状态和物理驱动的 UI 元素取代静态画布框架,这些元素直接发送到生产软件。

核心架构

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

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

生活画布建筑

在构建按钮、模式和滑块时,直接在画布上与它们进行交互。无需触发单独的原型模式。

Core Architecture

视觉逻辑节点

将事件(单击、拖动、悬停)连接到条件和状态转换,而无需处理复杂的命令式代码。

Core Architecture

多状态组件

使用无缝弹簧插值设计全面的组件状态(默认、悬停、焦点、活动、加载、错误、成功)。

Core Architecture

直接开发人员协调

设计师在视觉状态下思考;开发人员在状态机中思考。 ExodeUI 两种语言都很流利。

Core Architecture

客观评价

ExodeUI 相比如何 Static Wireframing Tools

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

The ExodeUI Architecture

ExodeUI

优势
  • 组件在绘图画布上实时且可交互
  • 模拟真实操作系统弹簧、触摸和手势
  • 保证状态同步错误导致的 UI bug 为零
  • 导出与视觉设计 100% 匹配的生产代码
Compared with

Static Wireframing Tools

Trade-offs
  • 绘制没有时间或逻辑概念的惰性二维矢量形状
  • 原型感觉迟缓并且缺乏真实的身体反应
  • 无法处理现实的动态数据或复杂的状态分支
  • 让开发人员猜测过渡速度和物理感觉

开发者交接

在您的代码中使用它

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

从 'exodeui' 导入 { ExodeUICanvas };

// 弹簧、状态和计时位于 .exode 文件中(设计于
// 编辑器)。您的代码传递输入并听取事件返回。
导出函数 LivingAuthButton() {
  返回(
    <ExodeUI画布
      src =“/living_auth_button.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.

免费试用