跳到主要内容

RiveCN - Rive 中文站

RiveCN 是 Rive 爱好者为了推广 Rive 而建立的中文网站,内含 Rive 相关中文教程和资源,欢迎学习与探索(持续更新中...)

Rive 编辑器 - 创建可直接用于生产的图形的设计工具

使用 Rive 的让你很熟悉的设计和动画工具,结合我们突破性的状态机,为您的产品、应用、网站和游戏创建互动内容。

Rive Runtimes Rive 动画引擎 - Rive 可以通过我们的开源动画引擎在任何地方运行

无代码或全代码,你来选择。轻松嵌入互动动画或用代码操控一切 —— Rive 让你以你想要的方式工作。

实时矢量图形的重大突破

Rive Renderer Rive 渲染器可以在屏幕上绘制前所未有的大量矢量图。屏幕上的一切都以 120 fps 的完美质量动态显示。

Rive 学习资源

我们为您精心整理了丰富的 Rive 学习资源,从入门教程到高级技巧,帮助您掌握这一强大的动效工具。

YouTube 教程与频道

来自全球的 Rive 视频教程

Rive (官方频道)

Rive (官方频道)

官方发布的 Rive 教程和更新,包含 "Rive 101" 系列短视频教程,涵盖各项基础功能和操作。

DesignCourse

DesignCourse

提供 Rive 快速入门课程,例如 "Create the Most AMAZING Animations with Rive" 速成课程,以及关于滚动功能等特定功能的教程。

Rubber Duck Engineering

Rubber Duck Engineering

提供关于 Rive 动画制作的教程。

Gamefromscratch

Gamefromscratch

从游戏开发的角度探索 Rive 在 Defold 引擎中的应用。

School of Motion

School of Motion

提供 Rive 的入门级教程,例如 "Intro to Interactive Animation in Rive"。

平台集成教程

学习如何在不同平台和框架中使用 Rive

Build an animated app (SwiftUI)

Build an animated app (SwiftUI)

免费课程,教你如何使用 Rive 动画资源设计和编码 iOS/SwiftUI 应用程序,包括图标动画、自定义布局和交互。

Flutter Web and Rive Animation Tutorial

Flutter Web and Rive Animation Tutorial

适合初学者到中级水平的教程,介绍如何设置带有 Rive 动画的 Flutter Web 应用程序。

Build iOS app with Rive Animations (SwiftUI)

Build iOS app with Rive Animations (SwiftUI)

完整的 3 小时课程,关于使用 Rive 动画构建 SwiftUI 应用程序。

SwiftUI Animated Login Screen using Rive

SwiftUI Animated Login Screen using Rive

关于创建动画和交互式登录界面的教程。

Plant Growing Animation with Rive and Flutter

Plant Growing Animation with Rive and Flutter

关于在 Flutter 中实现植物生长动画的教程。

Add Rive to your Flutter Flame game

Add Rive to your Flutter Flame game

关于向 Flutter Flame 游戏添加交互式 Rive 动画的教程。

特效与交互教程

学习创建特定的动画效果和交互

Hamburger Menu (Rive Editor)

Hamburger Menu (Rive Editor)

关于创建图标动画的教程。

Wait, Loading (Rive Editor)

Wait, Loading (Rive Editor)

关于在 Rive 中创建加载栏的教程。

Syncing Scroll Position with Rive (React)

Syncing Scroll Position with Rive (React)

关于使用滚动位置影响 Rive 动画/状态机的教程。

Create an animated spider cursor

Create an animated spider cursor

关于用爬行的蜘蛛替换鼠标光标的教程。

Pointer Tracking Animation Implemented in Webflow

Pointer Tracking Animation Implemented in Webflow

关于在 Rive 中为 Webflow 设置指针跟踪的教程。

Rive 官方学习资源

来自 Rive 官方的学习材料

Rive 官方文档

Rive 官方文档

包含应用程序和游戏运行时的快速入门指南、示例和代码片段。

Rive 博客

Rive 博客

分享实战经验和技巧,包含矢量羽化、N-切片、动画前的插画准备、布局功能、音频事件、动画登录界面设计与实现、动画头像、交互式加载器、监听器功能、网格变形、状态机原理以及从其他设计工具导入文件的方法等文章。