Загрузка видео...

Не удалось загрузить видео

На главную

GPU Canvas is now live for everyone. Rive's low-level GPU layer for 3D, shaders, and custom effects is out of Early Access and in the production editor today. Write your shaders once in WGSL. Rive compiles them for Metal, Vulkan, Direct3D, WebGPU, and WebGL. It adds 25KB to the runtime.

30,267 просмотров • 1 месяц назад •via X (Twitter)

Комментарии: 30

Фото профиля Rive
Rive1 месяц назад

New since Early Access: Deferred Rendering. Rive draws on its own thread, so heavy GPU scenes stay smooth while the rest of your app does its work. Live in the editor today, coming to the runtimes next. GPU Canvas runtime support today: Web, iOS, Android, React Native, Flutter, and C++. More on the way.

Фото профиля Rive
Rive1 месяц назад

Write shaders. WGSL, rendered straight into your Rive file.

Фото профиля Rive
Rive1 месяц назад

Import 3D models. Write a GLTF importer in a Script and animate it on the timeline like anything else.

Фото профиля Rive
Rive1 месяц назад

imported each icon as a GLB file, exposed properties on the GPU Canvas, and animated them with timelines and State Machines. The calendar's number is an artboard used as a texture on the mesh:

Фото профиля Rive
Rive1 месяц назад

Lighting and post effects on 2D artwork. Rim light, bloom, outlines, whatever you can write.

Фото профиля Rive
Rive1 месяц назад

Or bring in a texture. @jeffamcavoy used the Rive MCP to write a felt shader that takes one artboard's artwork and alpha and applies an image texture through a Script node in another:

Фото профиля Rive
Rive1 месяц назад

@jeffamcavoy Shaders as screen transitions.

Фото профиля Rive
Rive1 месяц назад

@jeffamcavoy Another example from @radbar_1

Фото профиля Rive
Rive1 месяц назад

@jeffamcavoy @radbar_1 A holo foil card from @drawsgood:

Фото профиля Rive
Rive1 месяц назад

@jeffamcavoy @radbar_1 @drawsgood Build your own rendering pipeline. This one is a vehicle cluster with a live 3D car, and it runs smoothly on the underpowered chips vehicles actually ship with.

Фото профиля Rive
Rive1 месяц назад

Embed 3D geometry inside a 2D artboard. Layouts, dynamic text, and Data Binding still apply, so the 3D piece resizes and updates with the rest of the UI. @rocklet_ pushed it into product visualization: material controls, depth of field, motion blur, HDRI lighting.

Фото профиля Rive
Rive1 месяц назад

@jeffamcavoy @radbar_1 @drawsgood @rocklet_ Or go the other way and map interactive 2D artboards onto 3D models. @jeffamcavoy's example:

Фото профиля Rive
Rive1 месяц назад

@jeffamcavoy @radbar_1 @drawsgood @rocklet_ @hansonerere2 did the same with a live artboard as the material texture, mapped to the model's UVs:

Фото профиля Rive
Rive1 месяц назад

@jeffamcavoy @radbar_1 @drawsgood @rocklet_ @hansonerere2 Put the two together and you get one cohesive interactive scene. Models, cameras, lights, custom shaders, projected animated textures, and 2D components placed in 3D space. All from @rocklet_:

Фото профиля Rive
Rive1 месяц назад

@jeffamcavoy @radbar_1 @drawsgood @rocklet_ @hansonerere2 Games. 3D worlds with 2D characters, built in the same editor as your UI. @HelloJcToon has been testing it with a controller in hand:

Фото профиля Rive
Rive1 месяц назад

@jeffamcavoy @radbar_1 @drawsgood @rocklet_ @hansonerere2 Cohesive lighting and effects for 2D character rigs in a 3D environment:

Фото профиля Rive
Rive1 месяц назад

@jeffamcavoy @radbar_1 @drawsgood @rocklet_ @hansonerere2 @luigirosso ported his Tetrisphere prototype to it:

Фото профиля Rive
Rive1 месяц назад

@jeffamcavoy @radbar_1 @drawsgood @rocklet_ @hansonerere2 @luigirosso Not a graphics programmer? Describe the shader. The Agent writes and optimizes it, and the Rive MCP now does the same from any MCP-compatible tool: write, diagnose, recompile, test.

Фото профиля Rive
Rive1 месяц назад

@jeffamcavoy @radbar_1 @drawsgood @rocklet_ @hansonerere2 @luigirosso Want to see the process? @LauKitton walked through building her 3D characters with the Agent, from first prompt to composed scene:

Фото профиля Rive
Rive1 месяц назад

@jeffamcavoy @radbar_1 @drawsgood @rocklet_ @hansonerere2 @luigirosso @LauKitton And @rocklet_ put together a tutorial on the 3D workflow, with free scripts for model importing, camera controls, lighting, materials, and UV projection:

Фото профиля Rive
Rive1 месяц назад

@jeffamcavoy @radbar_1 @drawsgood @rocklet_ @hansonerere2 @luigirosso @LauKitton All of it inside the design and animation tooling only Rive has: responsive Layouts, State Machines, dynamic text, Vector Feathering, 2D skeletal animation, Data Binding.

Фото профиля Rive
Rive1 месяц назад

@jeffamcavoy @radbar_1 @drawsgood @rocklet_ @hansonerere2 @luigirosso @LauKitton One more thing. This isn't a web-only 3D solution. The same file runs natively on desktop apps, games, mobile apps, consoles, TVs, and vehicles, with the same shaders compiled for whatever GPU is underneath. One runtime, everywhere Rive goes.

Фото профиля Rive
Rive1 месяц назад

@jeffamcavoy @radbar_1 @drawsgood @rocklet_ @hansonerere2 @luigirosso @LauKitton What's next? Public libraries for the common jobs (GLTF import, lighting, render styles), so nobody starts from a blank shader. Open the production editor, create a Script, pick Shader. Docs:

Фото профиля A.W.E.S.O.M.-O 4000
A.W.E.S.O.M.-O 40001 месяц назад

25KB is an impressively small footprint for this kind of capability

Фото профиля Jamie Kendall
Jamie Kendall1 месяц назад

@drawsgood YESSSS

Фото профиля Vikas Raj Yadav ˎˊ˗
Vikas Raj Yadav ˎˊ˗1 месяц назад

Yessss!!!

Фото профиля SVG Icons
SVG Icons1 месяц назад

Interesting to see low-level graphics become agent-callable while staying inside real design tooling. That human/code loop matters.

Фото профиля Sirojiddin Makhammatov
Sirojiddin Makhammatov1 месяц назад

I’ve been waiting for this update - definitely one of the best updates so far! And thanks for Premium too😄

Фото профиля DrejT
DrejT1 месяц назад

can i make animations using claude code on rive?

Фото профиля aibor
aibor1 месяц назад

This is so great! Tested out in flutter but are shaders not working in flutter web ? Can’t seem to get them working for web.

Похожие видео