Southeast Asia is rising. And a new generation of founders is building what comes next. We're here to talk to them, cutting past the noise, straight to the signal. Introducing TON SEA.
53
97
1,458
229,635
Seyha Arumaa retweeted
Stop talking to Claude Opus 5.5 like a junior web designer and turn it into a premier web studio. this is a goldmine i built a site with 200+ Opus 5.5 prompts, each based on a premium motion-design website: → beyond-media.ai/aiweb-design > fonts, palettes baked into the prompt > layout & motion techniques written out step by step > filter by technique to find the exact style you need > one click to copy, paste straight into Opus 5.5 No more "make it look modern".
12
5
97
11,729
Seyha Arumaa retweeted
someone built a tool that watches a motion design reference and rebuilds it as code you can edit it's called MotionClone. 500+ stars on GitHub already you paste a link from X, YouTube or Vimeo (or drop in a local file) and it reconstructs the text, shapes, artwork and animation as a HyperFrames project not a screen recording. actual HTML + GSAP timing you can open and change the smart part: the original and the rebuild play side by side, in sync. you scrub, slow it down and see exactly where the timing drifts then you take it out 3 ways: → the rebuilt video as MP4 → a comparison MP4, landscape, portrait or square → the editable project ZIP the ZIP is the useful one. three commands and it's running: > npm install > npm run preview > npm run render swap the copy, colors and pacing yourself, or hand the folder to Claude Code, since HyperFrames ships skills for it setup on Windows: > git clone github.com/blixvip/MotionClo… > cd MotionClone > codex login > .\start.ps1 no API keys to paste. it borrows your Codex login, so you do need ChatGPT account access. Python 3.11+, Node 22+, FFmpeg and Chrome on PATH too honest part: the rebuild is approximate. fonts, photos and complex motion still need a check before you publish. and use refs you actually have the rights to if you make launch videos solo, this kills the "how did they animate that" guesswork bookmark this, repo below ↓
18
15
260
13,416
Seyha Arumaa retweeted
如果你想让 Claude Code 帮你制作动画视频,你一定要了解这 12 个Github 仓库! 从产品介绍、知识动画,到口播剪辑,按用途选择: 1️⃣ Remotion — 用 React 编写视频,控制画面、字幕、声音和时间轴。 github.com/remotion-dev/remo… 2️⃣ Remotion Skills — 官方 AI 技能,覆盖视频创建、预览、字幕和渲染。 github.com/remotion-dev/skil… 3️⃣ HyperFrames — 将 HTML、CSS、媒体素材和动画渲染为 MP4,提供 Claude Code 插件与 Skills。 github.com/heygen-com/hyperf… 4️⃣ Motion Canvas — 用 TypeScript 制作矢量动画,适合流程图、原理讲解和配音同步。 github.com/motion-canvas/mot… 5️⃣ animate — 面向 Claude Code 的程序化动画工具,包含视觉风格、分镜、预览和视频导出流程。 github.com/cth9191/animate 6️⃣ product-launch-motion — 产品发布视频 Skill,围绕界面变化、镜头运动和音乐节奏组织动画。 github.com/AbubakrChan/produ… 7️⃣ motion-graphics-skills — 一组动画制作 Skills,覆盖品牌简报、发布片、动态图表和解释视频。 github.com/charlie947/motion… 8️⃣ claude-motion-design — 使用 HTML、Playwright 和 FFmpeg 制作代码动画,包含音乐同步和逐帧渲染流程。 github.com/howseen-ai/claude… 9️⃣ Herk Edit Kit — 基于 HyperFrames 的视频剪辑工具包,包含转写、停顿处理、字幕和动态图形;原名 HyperFrames Student Kit。 github.com/nateherkai/herk-e… 🔟 Barty-Bart/motion-graphics — 根据视频和字幕制作同步动态图形,另含主体分离、产品演示与音效技能。 github.com/Barty-Bart/motion… 1️⃣1️⃣ claude-motion — 为编码代理提供动效规则、抽帧检查和声音生成工具,也支持网页模拟动画转视频。 github.com/whaleyxbt/claude-… 1️⃣2️⃣ claude-remotion-skill — 基于 Remotion 的社区技能,提供动效、字幕、声音设计和渲染检查规则。 github.com/haidrrrry/claude-…
17
67
655
38,899
Seyha Arumaa retweeted
Opus 5.5 的 20 种开源技能。 动画,物理,3D,声音,交付都有涉及。 01 Remotion → React 视频引擎 github.com/remotion-dev/remo… 02 HyperFrames → HTML 到视频渲染器 github.com/heygen-com/hyperf… 03 Anime.js → 时间线编排 github.com/juliangarnier/ani… 04 React Spring → 弹簧动画 github.com/pmndrs/react-spri… 05 PixiJS → GPU 驱动的 2D 图形 github.com/pixijs/pixijs 06 p5.js → 生成式视觉效果 github.com/processing/p5.js 07 Paper.js → 矢量路径 github.com/paperjs/paper.js 08 Matter.js → 2D 物理 github.com/liabru/matter-js 09 Three.js → 3D 场景 github.com/mrdoob/three.js 10 Rapier → 3D 碰撞 github.com/dimforge/rapier 11 OGL → 自定义着色器 github.com/oframe/ogl 12 tsParticles → 粒子效果 github.com/tsparticles/tspar… 13 glTF Transform → 3D 资产生优化 github.com/donmccurdy/glTF-T… 14 GL Transitions → 着色器过渡 github.com/gl-transitions/gl… 15 OBS Studio → 屏幕捕获 github.com/obsproject/obs-st… 16 Chatterbox → 配音 github.com/resemble-ai/chatt… 16 话匣子→配音 github.com/resemble-ai/chatt… 17 Tone.js → 合成器和音效 github.com/Tonejs/Tone.js 18 faster-whisper → 字幕转录 github.com/SYSTRAN/faster-wh… 19 OpenCut → 时间线编辑 github.com/OpenCut-app/OpenC… 20 FFmpeg → 编码和交付 github.com/FFmpeg/FFmpeg
27
230
1,680
101,688
Seyha Arumaa retweeted
Bon les gars, y’en a marre des apps qui puent l’IA Je vous ai donc concocté une liste de 10 skills à donner à votre agent de code pour le design, les animations et les finitions De quoi donner un peu de gueule à vos projets 👇 1/ frontend-design (Anthropic) Pour définir une direction artistique : typographie, couleurs et composition adaptées à ton produit github.com/anthropics/skills… 2/ UI UX Pro Max Pour trouver des palettes, des associations de polices et des recommandations UX selon ton projet github.com/nextlevelbuilder/… 3/ Impeccable Pour auditer ton design, clarifier tes textes et faire une passe de finition avec ses commandes critique, clarify et polish github.com/pbakaus/impeccabl… 4/ emil-design-eng (Emil Kowalski) Pour soigner les boutons, les transitions et les petits détails qui rendent une interface agréable à utiliser github.com/emilkowalski/skil… 5/ create-design-md (ibelick) Pour documenter tes règles visuelles dans un DESIGN.md et donner un cadre cohérent à ton agent github.com/ibelick/ui-skills… 6/ review-animations (Emil Kowalski) Pour repérer les animations trop lentes, les mauvaises courbes et les mouvements inutiles github.com/emilkowalski/skil… 7/ mobile-native (Emil Kowalski) Pour corriger les détails pénibles d’une web app sur téléphone : toucher, scroll, zoom des champs et contenu sous l’encoche github.com/emilkowalski/skil… 8/ break-ui (Emil Kowalski) Pour tester tes écrans avec des noms trop longs, des listes vides et des données qui font déborder l’interface github.com/emilkowalski/skil… 9/ web-design-guidelines (Vercel) Pour vérifier l’accessibilité, les formulaires, le focus et les états de ton interface github.com/vercel-labs/agent… 10/ webapp-testing (Anthropic) Pour tester les parcours dans le navigateur avec Playwright, inspecter les erreurs et prendre des captures github.com/anthropics/skills…
37
211
2,337
172,380
Seyha Arumaa retweeted
If you design with AI, this is all you need 1. jiro.build — 1,300+ prompts for building websites using AI. 2. godly.website — award-winning websites 3. landdding.com — top-notch landings 4. fontinlogo.com — fonts behind brands 5. 60fps.design — mobile UI animations Save this for later
20
58
377
24,158