正在加载视频...

视频加载失败

返回首页

making websites w Claude Design? well we built hyperframes/website-to-hyperframes skill cuz websites are all just HTML + CSS + JS! and ofc, this launch video also made with hyperframes. comment "hyperframes" - i'll send you full codebase access for this video.

liu8in's profile picture

Bin Liu

8,539 subscribers

43,269 次观看 • 6 个月前 •via X (Twitter)

LIVE

Anya Rossi• Live Now

Private livecam show

41 条评论

Peter Yang 的头像
Peter Yang6 个月前

Is hyper frame part of heygen?

Bin Liu 的头像
Bin Liu6 个月前

yea lol -

Pato 的头像
Pato6 个月前

hyperframes. also genuinely curious how complex the HTML output gets when you chain multiple design passes through Claude

Bin Liu 的头像
Bin Liu6 个月前

here's the hyperframes repo that rendered the video in this post: - simply clone, then run `npx hyperframes preview` in the codebase!

Pato 的头像
Pato6 个月前

niice, ty! will check it out

X Citizen Journal 的头像
X Citizen Journal6 个月前

hyperframes

OneManSaas 的头像
OneManSaas6 个月前

How's the performance compared to traditional HTML/CSS workflows? Curious if the hyperframes approach adds any overhead or if it's actually faster for iterating on designs.

Bin Liu 的头像
Bin Liu6 个月前

similar! btw - here's the hyperframes repo that rendered the video in this post: - simply clone, then run `npx hyperframes preview` in the codebase!

YabsssAI 的头像
YabsssAI6 个月前

you're giving away full codebase access for the launch video just by commenting with the word "hyperframes", what kind of feedback or collaboration are you hoping to get from sharing it so openly

Eren Gündüz 🌟 的头像
Eren Gündüz 🌟6 个月前

tried it and it burned half of my 5-hour Claude Pro limit for a 19s video. the output is pretty unusable and generic, feels like there’s a long way to go. lmk if you want feedback and the output.

Bin Liu 的头像
Bin Liu6 个月前

thank you for the great feedback - not my own experience but would really love to get your prompt and your project zip so we can see where can we improve!

Eren Gündüz 🌟 的头像
Eren Gündüz 🌟6 个月前

happy to see you're open to feedback. I'm sure this will evolve to something great.

CJ25 的头像
CJ256 个月前

@Miguel07Code Hyperframes

Ape 的头像
Ape6 个月前

Hyperframes

rodrigo 的头像
rodrigo6 个月前

hyperframes

Yasir Hussain 的头像
Yasir Hussain6 个月前

Hyperframes

Joulse 的头像
Joulse6 个月前

This looks super useful

Louca 的头像
Louca6 个月前

hyperframes

Dylan Wilcox 的头像
Dylan Wilcox6 个月前

Hyperframes

Prem 🍁 的头像
Prem 🍁6 个月前

hyperframes

Muslim Musafir | Муслим Мусафир 的头像
Muslim Musafir | Муслим Мусафир6 个月前

hyperframes

JoJo | AI Builders 的头像
JoJo | AI Builders6 个月前

hyperframes. I’m increasingly feeling that code is everything… Maybe my Mac screen recording tool, built with vibe coding, should also catch up with the Agent era. It’s truly an amazing open-source project — thanks for all your hard work!

Shawn Smith 的头像
Shawn Smith6 个月前

Hyperframes

Omkar 的头像
Omkar6 个月前

Hey Bin, created this…what do you think of this? Just with 1 prompt…

Ashish Choudhary 👨🏻‍💻🧔🏻👨‍👩‍👦 的头像
Ashish Choudhary 👨🏻‍💻🧔🏻👨‍👩‍👦6 个月前

Hyperframes

Youssef 的头像
Youssef6 个月前

hyperframes

清华哥 的头像
清华哥6 个月前

hyperframes

Ганаа 的头像
Ганаа6 个月前

Hyperframe

Karthik Sivacharan 的头像
Karthik Sivacharan6 个月前

hyperframes

Rui Menoita 的头像
Rui Menoita6 个月前

hyperframes

Oleg VLD 的头像
Oleg VLD6 个月前

hyperframes

Dragu Jhn 的头像
Dragu Jhn6 个月前

Hyperframes

Hunter Lapeyre 的头像
Hunter Lapeyre6 个月前

hyperframes

Tyler Durden 的头像
Tyler Durden6 个月前

Hyperframes

Sevan Bomar 的头像
Sevan Bomar6 个月前

Hyperframes

Kyle Stimpson 的头像
Kyle Stimpson6 个月前

hyperframes

Jay E 的头像
Jay E6 个月前

Codebases

Thomas Nabseth 的头像
Thomas Nabseth6 个月前

hyperframes

J 的头像
J6 个月前

hyperframes

OrganicDNA 的头像
OrganicDNA6 个月前

Hyperframes

Bahia 的头像
Bahia6 个月前

hyperframes

相关视频

We built our launch video in Claude Code using HyperFrames. Now it's yours. Open source, agent-native framework. HTML to MP4. $ npx skills add heygen-com/hyperframes RT + Comment "HyperFrames" to get the full source code of this launch video (must follow)
0:49

We built our launch video in Claude Code using HyperFrames. Now it's yours. Open source, agent-native framework. HTML to MP4. $ npx skills add heygen-com/hyperframes RT + Comment "HyperFrames" to get the full source code of this launch video (must follow)

HeyGen

3,014,698 次观看 • 6 个月前

partnering with Claude - we want to allow your work to speak for themselves we tuned the HyperFrames MCP agent to specialize at making explainer videos documents get skimmed, video gets across. should we open source this launch video? made with hyperframes ofc.
0:54

partnering with Claude - we want to allow your work to speak for themselves we tuned the HyperFrames MCP agent to specialize at making explainer videos documents get skimmed, video gets across. should we open source this launch video? made with hyperframes ofc.

Bin Liu

49,975 次观看 • 4 个月前

alright - verdict is in - Motion Design is solved made with HyperFrames + Claude Design btw - HyperFrames is open source, star it on github and I'll send tutorial on how i made this with 2 prompts.
0:24

alright - verdict is in - Motion Design is solved made with HyperFrames + Claude Design btw - HyperFrames is open source, star it on github and I'll send tutorial on how i made this with 2 prompts.

Bin Liu

619,991 次观看 • 6 个月前

Your Hermes Agent can now build full videos with the official HyperFrames skill by HeyGen HyperFrames videos are HTML-native, so your agent has total control over the final output Video made entirely by Hermes using the HyperFrames skill
0:41

Your Hermes Agent can now build full videos with the official HyperFrames skill by HeyGen HyperFrames videos are HTML-native, so your agent has total control over the final output Video made entirely by Hermes using the HyperFrames skill

Nous Research

376,315 次观看 • 5 个月前

Introducing the HyperFrames MCP in Claude Design The difference between prototyping a design and shipping it as video Animate in Claude Design, hit share, and hyperframes agent scores it, adds sfx, tightens the motion and renders the MP4 Just send it to HyperFrames. We'll take it from there.
0:45

Introducing the HyperFrames MCP in Claude Design The difference between prototyping a design and shipping it as video Animate in Claude Design, hit share, and hyperframes agent scores it, adds sfx, tightens the motion and renders the MP4 Just send it to HyperFrames. We'll take it from there.

HyperFrames

63,426 次观看 • 2 个月前

Hyperframes is now an official Claude connector LLM answers are often dense pages of text that go unread we partnered with anthropic to fix that, HyperFrames runs as an mcp where you work docs get skimmed. video gets understood proof: this video was made with Hyperframes
0:54

Hyperframes is now an official Claude connector LLM answers are often dense pages of text that go unread we partnered with anthropic to fix that, HyperFrames runs as an mcp where you work docs get skimmed. video gets understood proof: this video was made with Hyperframes

HeyGen

753,200 次观看 • 4 个月前

your agent builds the edit. you finish it. made this launch film for hyperframes studio… in hyperframes studio: captions, kinetic type, b-roll, music, then every tweak by hand on the timeline. it all lands back in the code. npx hyperframes preview Bin Liu HyperFrames
0:44

your agent builds the edit. you finish it. made this launch film for hyperframes studio… in hyperframes studio: captions, kinetic type, b-roll, music, then every tweak by hand on the timeline. it all lands back in the code. npx hyperframes preview Bin Liu HyperFrames

Hanif | AI For Productivity

14,780 次观看 • 20 天前

Claude Mythos / Fable 5 solved motion graphics with HTML! this HyperFrames video was completely one-shotted by Mythos btw
1:30

Claude Mythos / Fable 5 solved motion graphics with HTML! this HyperFrames video was completely one-shotted by Mythos btw

Miguel Ángel

122,547 次观看 • 4 个月前

You can now edit HyperFrames’ Timeline directly! Drag in preview → video updates When Claude Code struggles with timing, you can give it a hand Experimental, open sourced in @hyperframes/player $ npx hyperframes upgrade RT + Comment "Timeline" for source code (must follow)
0:33

You can now edit HyperFrames’ Timeline directly! Drag in preview → video updates When Claude Code struggles with timing, you can give it a hand Experimental, open sourced in @hyperframes/player $ npx hyperframes upgrade RT + Comment "Timeline" for source code (must follow)

HeyGen

730,278 次观看 • 6 个月前

"I've spent $30K on a launch video, now you can make one with code." Here's my new episode with Bin Liu and Jake Moran, where they shared their 5-step playbook for using HyperFrames to make professional launch videos in Codex and Claude Code: 1. Gather video assets and create a frame.md 2. Create a storyboard.md with the scenes 3. Pull animations from the HyperFrames repo 4. Generate and review static frames 5. Build the video with HyperFrames Studio You can also start simple by using the built-in /website-to-video skill to one shot a launch video from any URL. HyperFrames is 100% free and I love how it democratizes video creation for everyone. 📌 Watch now: Thanks to our sponsors: Wispr Flow: 4x faster than typing with your voice Riverside: All-in-one AI studio for podcasts and video
0:43

"I've spent $30K on a launch video, now you can make one with code." Here's my new episode with Bin Liu and Jake Moran, where they shared their 5-step playbook for using HyperFrames to make professional launch videos in Codex and Claude Code: 1. Gather video assets and create a frame.md 2. Create a storyboard.md with the scenes 3. Pull animations from the HyperFrames repo 4. Generate and review static frames 5. Build the video with HyperFrames Studio You can also start simple by using the built-in /website-to-video skill to one shot a launch video from any URL. HyperFrames is 100% free and I love how it democratizes video creation for everyone. 📌 Watch now: Thanks to our sponsors: Wispr Flow: 4x faster than typing with your voice Riverside: All-in-one AI studio for podcasts and video

Peter Yang

70,122 次观看 • 4 个月前

HyperFrames, now natively in Claude Design Drop in the skill file, generate motion graphics, download project ask Claude Code or run command: $ npx hyperframes render Design to animation to MP4, all in one flow details in thread
0:40

HyperFrames, now natively in Claude Design Drop in the skill file, generate motion graphics, download project ask Claude Code or run command: $ npx hyperframes render Design to animation to MP4, all in one flow details in thread

HeyGen

580,662 次观看 • 6 个月前

open-sourced new 25 HyperFrames carousel blocks added to the catalog made by our launch king @JakeFromHeyGen! install them all with $ npx hyperframes add carousel
1:15

open-sourced new 25 HyperFrames carousel blocks added to the catalog made by our launch king @JakeFromHeyGen! install them all with $ npx hyperframes add carousel

Miguel Ángel

19,839 次观看 • 1 个月前

Want to turn a website into a launch video for your brand? This tutorial shows you how We used ollama as example, but the workflow works for any company. Every frame is HTML, CSS, and GSAP, written like a webpage and rendered with HyperFrames Follow the workflow below ↓
0:38

Want to turn a website into a launch video for your brand? This tutorial shows you how We used ollama as example, but the workflow works for any company. Every frame is HTML, CSS, and GSAP, written like a webpage and rendered with HyperFrames Follow the workflow below ↓

HeyGen

36,600 次观看 • 4 个月前

GPT-5.6 Sol Ultra Made a video of introducing GPT 5.6 tested with both remotion & hyperframes Remotion / HyperFrames
0:24

GPT-5.6 Sol Ultra Made a video of introducing GPT 5.6 tested with both remotion & hyperframes Remotion / HyperFrames

Athrix ☄️

32,218 次观看 • 3 个月前

Creating with HyperFrames just got faster Drag elements in the studio to fix placement instead of prompting We also built the full component catalog right into the studio. Browse and add $ npx hyperframes@latest preview Follow @hyperframes_ for updates
0:36

Creating with HyperFrames just got faster Drag elements in the studio to fix placement instead of prompting We also built the full component catalog right into the studio. Browse and add $ npx hyperframes@latest preview Follow @hyperframes_ for updates

HeyGen

284,467 次观看 • 5 个月前

Amazed by HTML-in-canvas demos? it's natively supported by HyperFrames and we built a catalog of effects anyone can use with one command $ npx hyperframes add html-in-canvas take your videos to the next level
0:26

Amazed by HTML-in-canvas demos? it's natively supported by HyperFrames and we built a catalog of effects anyone can use with one command $ npx hyperframes add html-in-canvas take your videos to the next level

HeyGen

504,355 次观看 • 5 个月前

Claude Motion is here, and HyperFrames Studio works with it from day one. In Claude Motion, choose Send to and pick HyperFrames. Your video opens in Studio, where you can make edits and add music and sound effects. Claude Motion is in beta on Claude Team and Enterprise plans.
0:30

Claude Motion is here, and HyperFrames Studio works with it from day one. In Claude Motion, choose Send to and pick HyperFrames. Your video opens in Studio, where you can make edits and add music and sound effects. Claude Motion is in beta on Claude Team and Enterprise plans.

HyperFrames

64,850 次观看 • 16 天前

This week we're launching new skills for HyperFrames, each built around a workflow Today is pr-to-video Nobody reads pull requests. Now agents can turn them into a short explainer video npx skills add heygen-com/hyperframes New skill launching every day. Follow for more
0:31

This week we're launching new skills for HyperFrames, each built around a workflow Today is pr-to-video Nobody reads pull requests. Now agents can turn them into a short explainer video npx skills add heygen-com/hyperframes New skill launching every day. Follow for more

HeyGen

39,040 次观看 • 4 个月前

Introducing 9 new code animations in HyperFrames Download them all with $ npx hyperframes add code
0:23

Introducing 9 new code animations in HyperFrames Download them all with $ npx hyperframes add code

Miguel Ángel

22,272 次观看 • 4 个月前

🚨 Arkadaşlar, video üretimi konusunda çok ciddi bir yenilik geldi. HeyGen, HyperFrames adlı framework’ü tamamen açık kaynak olarak yayınladı. Bu araçla artık Claude Code kullanarak HTML yazmanız yeterli. HTML kodunuz doğrudan kaliteli bir MP4 videoya dönüşüyor. Nasıl çalışıyor? - Claude Code ile HTML + CSS + JavaScript yazıyorsunuz - HyperFrames bu kodu render ediyor ve profesyonel kalitede video üretiyor - Animasyonlar, geçişler, metin efektleri ve hatta karmaşık sahneler bile destekleniyor - Ajan-native tasarlandığı için Claude ile çok uyumlu çalışıyor Kurulum da son derece basit: ```bash npx skills add heygen-com/hyperframes
0:49

🚨 Arkadaşlar, video üretimi konusunda çok ciddi bir yenilik geldi. HeyGen, HyperFrames adlı framework’ü tamamen açık kaynak olarak yayınladı. Bu araçla artık Claude Code kullanarak HTML yazmanız yeterli. HTML kodunuz doğrudan kaliteli bir MP4 videoya dönüşüyor. Nasıl çalışıyor? - Claude Code ile HTML + CSS + JavaScript yazıyorsunuz - HyperFrames bu kodu render ediyor ve profesyonel kalitede video üretiyor - Animasyonlar, geçişler, metin efektleri ve hatta karmaşık sahneler bile destekleniyor - Ajan-native tasarlandığı için Claude ile çok uyumlu çalışıyor Kurulum da son derece basit: ```bash npx skills add heygen-com/hyperframes

DeepTechTR 🇹🇷

21,510 次观看 • 6 个月前