Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

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 görüntüleme • 6 ay önce •via X (Twitter)

LIVE

Anya Rossi• Live Now

Private livecam show

41 Yorum

Peter Yang profil fotoğrafı
Peter Yang6 ay önce

Is hyper frame part of heygen?

Bin Liu profil fotoğrafı
Bin Liu6 ay önce

yea lol -

Pato profil fotoğrafı
Pato6 ay önce

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

Bin Liu profil fotoğrafı
Bin Liu6 ay önce

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

Pato profil fotoğrafı
Pato6 ay önce

niice, ty! will check it out

X Citizen Journal profil fotoğrafı
X Citizen Journal6 ay önce

hyperframes

OneManSaas profil fotoğrafı
OneManSaas6 ay önce

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 profil fotoğrafı
Bin Liu6 ay önce

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 profil fotoğrafı
YabsssAI6 ay önce

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 🌟 profil fotoğrafı
Eren Gündüz 🌟6 ay önce

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 profil fotoğrafı
Bin Liu6 ay önce

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 🌟 profil fotoğrafı
Eren Gündüz 🌟6 ay önce

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

CJ25 profil fotoğrafı
CJ256 ay önce

@Miguel07Code Hyperframes

Ape profil fotoğrafı
Ape6 ay önce

Hyperframes

rodrigo profil fotoğrafı
rodrigo6 ay önce

hyperframes

Yasir Hussain profil fotoğrafı
Yasir Hussain6 ay önce

Hyperframes

Joulse profil fotoğrafı
Joulse6 ay önce

This looks super useful

Louca profil fotoğrafı
Louca6 ay önce

hyperframes

Dylan Wilcox profil fotoğrafı
Dylan Wilcox6 ay önce

Hyperframes

Prem 🍁 profil fotoğrafı
Prem 🍁6 ay önce

hyperframes

Muslim Musafir | Муслим Мусафир profil fotoğrafı
Muslim Musafir | Муслим Мусафир6 ay önce

hyperframes

JoJo | AI Builders profil fotoğrafı
JoJo | AI Builders6 ay önce

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 profil fotoğrafı
Shawn Smith6 ay önce

Hyperframes

Omkar profil fotoğrafı
Omkar6 ay önce

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

Ashish Choudhary 👨🏻‍💻🧔🏻👨‍👩‍👦 profil fotoğrafı
Ashish Choudhary 👨🏻‍💻🧔🏻👨‍👩‍👦6 ay önce

Hyperframes

Youssef profil fotoğrafı
Youssef6 ay önce

hyperframes

清华哥 profil fotoğrafı
清华哥6 ay önce

hyperframes

Ганаа profil fotoğrafı
Ганаа6 ay önce

Hyperframe

Karthik Sivacharan profil fotoğrafı
Karthik Sivacharan6 ay önce

hyperframes

Rui Menoita profil fotoğrafı
Rui Menoita6 ay önce

hyperframes

Oleg VLD profil fotoğrafı
Oleg VLD6 ay önce

hyperframes

Dragu Jhn profil fotoğrafı
Dragu Jhn6 ay önce

Hyperframes

Hunter Lapeyre profil fotoğrafı
Hunter Lapeyre6 ay önce

hyperframes

Tyler Durden profil fotoğrafı
Tyler Durden6 ay önce

Hyperframes

Sevan Bomar profil fotoğrafı
Sevan Bomar6 ay önce

Hyperframes

Kyle Stimpson profil fotoğrafı
Kyle Stimpson6 ay önce

hyperframes

Jay E profil fotoğrafı
Jay E6 ay önce

Codebases

Thomas Nabseth profil fotoğrafı
Thomas Nabseth6 ay önce

hyperframes

J profil fotoğrafı
J6 ay önce

hyperframes

OrganicDNA profil fotoğrafı
OrganicDNA6 ay önce

Hyperframes

Bahia profil fotoğrafı
Bahia6 ay önce

hyperframes

Benzer Videolar

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,776 görüntüleme • 6 ay önce

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 görüntüleme • 4 ay önce

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 görüntüleme • 6 ay önce

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 görüntüleme • 5 ay önce

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 görüntüleme • 2 ay önce

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 görüntüleme • 4 ay önce

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 görüntüleme • 21 gün önce

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 görüntüleme • 4 ay önce

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 görüntüleme • 6 ay önce

"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 görüntüleme • 4 ay önce

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 görüntüleme • 6 ay önce

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 görüntüleme • 1 ay önce

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 görüntüleme • 4 ay önce

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 görüntüleme • 3 ay önce

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 görüntüleme • 5 ay önce

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 görüntüleme • 5 ay önce

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 görüntüleme • 17 gün önce

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 görüntüleme • 4 ay önce

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 görüntüleme • 4 ay önce

🚨 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 görüntüleme • 6 ay önce