正在加载视频...
视频加载失败
Introducing Aval - a new open source format for interactive video on the web. It has a built-in state machine, frame accurate transitions, and packed alpha transparency. This is probably the craziest thing I’ve ever built with Codex. I’d been dreaming about this technology for years. Before AI, building... show more
278,120 次观看 • 3 个月前 •via X (Twitter)
62 条评论

Dude you’re single handed pushing web design forward. I salute you 🫡

Thank you, Ran! It’s truly mind blowing what you can do today with AI.

Very cool! naming it AVAL, reverse of LAVA 😎

You got it. 😎

this looks awesome. Did you see ?

Whaat. This is crazy. Kind of Rive + XState + APNG on fire

Kind of, yes, but it's definitely not a replacement for Rive. It's just a separate thing that has its own much-needed set of use cases.

@gunta85 3D Flash ?

@alex_barashkov Video flash

I'm throwing Fable at it - to port to flutter. This is a multi-month effort. Stand by.

Too early :) Let me first finish a todo list from the repo. There are some things that need to be done before porting it to different platforms. Soon support of H265/VP9/AV1 will come, quite important piece.

god speed. Anthropic reset all the usages - and my monthly resets in a few days any way. i was intrigued to pull apart the magic of grass rabbit scene - been wanting to get a game to play with mouse hover states with video - - could we do a mouse hover for characters? a bit of scope creep - one for the backlog

burn baby burn -

flutter port is done. i will expect some updates to sync to. great work Alex - Im really excited to gamify this.

@alex_barashkov Crazy set of events. I'll use the web one for now, but thanks for doing a flutter port

@alex_barashkov I have it deploying to my phone with rust - albeit a bit janky. I’m looking at how we can have a large AVAL canvas and a sub-region that carries moving pixels.

Seems cool. But the homepage should be a real demo instead of what seems like a video playing from start to finish. Showing that hover is a thing without letting me actually hove is odd

it’s a real demo if it does not work for you , there might be a bug. would love to explore. there around 5 states currently

@james2doyle I cannot interact with the state buttons! Tried on mobile and desktop!

@james2doyle you need interact by hovering on video, states are not buttons, they just indicate what state triggered in video.

@satishgoda @james2doyle I really love the idea of this - is there a feature flag that maybe I need to enable for my browser? (This is Chromium/Dia - same experience in Firefox)

@satishgoda @james2doyle Interesting which version of chromium do you use. Try to hover and keep it on it and see if rabbits appears. then when you remove from the whole surface it should get back to the grass.

what kind of sorcery is this??????

Codex 5.6 Sol Ultra ran for 27 hours before the first version.

🤯

Ideal for UI icons - are you thinking rasterized ones in that regard? Because with @nucleoicons I can do this: to web now though that's SVG.

@nucleoicons For UI icons, it's currently much better to animate SVGs directly with AI or use Rive/Lottie. AVAL is good if your icons are rendered in Blender or made with AI.

Holy moly... Alex, you are the goat!

Thank you, Henrique!

thanks can you add more exemple on the webpage and explain how to make the files?

will do, it’s just early version.

Web videos with transparency and state machines? You have my attention. So apps like CapCut would have to export to this format or does it automatically convert an mp4?

It can be used in theory with CapCut. Currently the process is that you give to compiler your video (ideally unoptimised), that video contains different segments already. Then you give compiler a data about what are those segments like 0-30 frames - intro, 30-60 - loop, 60-90 hover in. Then it compresses the video to h264(soon more options) with some extra magic and packs everything together with states data to .avl file. My main use case was - having interactive graphic exported from Blender, with cross browser transparency support.

You're spoiling us lately, thank you good sir!

Ha, I call it inspiring.

Build a quick test with my mascot. Blown away. This is a game changer for me. Thank you

Dope! It actually works :)

Like a charm. I let Claude code do the hard work

This is what I wanted YouTube to become. Like branching mid-video, micro-interactions, etc. Super cool.

Could definitely use this on How do I get a conversion going from mp4?

@shahruz

This brotha is crazy

this is sooooo cool! ty!!

crazy what becomes possible when AI makes the impossible side project doable :D

true, it's sick

Does it have music in it? Or will be

Technically it's possible, but i have not tested it yet.

You created something beautiful.

Very cool!

respect to you brother,this is insanely good!

HOLY SHIT. I will be giving this a proper look!

@edo_lunardi

@Scobleizer That’s awesome! I wished for this years ago but haven’t thought about it in ages. Good on you for bringing it to life!

We are not worthy 🙇🏼♂️

Amazing 👏

Dude this is insane. You’re literally changing how interfaces work.

I started trying to build something with Claude and wasn't too impressed. I was looking for an about page, hero video where someone could make us go make coffee or arm wrestle. Excited to check this out!

@Scobleizer So cool!!!

Big Buck Bunny is the 🐐

This is why we need AI

Awesome. I love that you used state machines. Underrated for complex interactions

Amazing 👏 looking forward to giving it a go!

