跪拜 Guibai
← All articles
Frontend · AI Coding · Three.js

14 Repos That Give AI Coding Assistants Design Sense, 3D Skills, and Video Editing

By 柳杉 ·
Read original on juejin.cn ↗ Google Translate ↗ Alt translation

One developer with an AI assistant can now produce a marketing page, a Three.js scene, and a short film without leaving the editor, shrinking the team and skill set needed for digital content.

Summary

Over the past year, the author's saved repositories leaned away from source code and toward Skills, MCP servers, and plugins. The reason is that AI coding tools still struggle with aesthetics, modeling, motion, and editing. The list gathers 14 projects into three groups. One group supplies design knowledge, review, and animation components so Claude Code or Codex stops producing template-looking pages. Another connects AI to Blender, Three.js, and motion retargeting, covering the asset pipeline. The third treats video as code, using HTML, Remotion, and camera recipes to produce finished films.

The unifying thread is that front-end engineers can now own design, 3D, and video in one workflow. The author is blunt about the limit: these tools don't judge what good looks like, and the real advantage comes from wiring them into a project and knowing which steps still need human control.

Takeaways
— UI UX Pro Max gives AI a design knowledge base with color, typography, and industry-specific rules for finance, medical, and e-commerce.
— Impeccable reviews and polishes existing pages using design principles instead of random color changes.
— Framelink Figma MCP lets AI read structure, spacing, and component relationships from a Figma link, not just a screenshot.
— React Bits supplies ready-made animation components, text effects, and background effects for landing pages and dashboards.
— GSAP Skills teaches AI the correct use of GSAP timelines, scroll animations, and text effects.
— MCP for Blender enables text-command scene creation, model tweaks, and material setup through MCP.
— dsh-blender-plugin is another AI-driven Blender modeling route with tools and skills for live modeling.
— img2threejs rebuilds Three.js objects from reference images, with quality checks and animation expansion in code.
— Motion2MixamoRig retargets human motion from video onto Mixamo-rigged characters.
— dioramas organizes AI-generated assets into cinematic interactive 3D websites using Three.js and WebGL.
— HyperFrames uses HTML to describe scenes and renders finished video, shortening the path from code to film.
— video-shotcraft is a Remotion-based video Skill for Claude Code and Codex that adds camera language and shot recipes.
— lemo-opuscar generates short films in different styles purely from code, without video generation models.
— mg-styles-15 breaks down 15 motion graphics styles, providing finished films, prompts, and source code.
Conclusions

The shift in saved repos from raw source to Skills, MCPs, and plugins shows that the AI coding ecosystem now treats design, modeling, and video as first-class problems rather than edge cases.

The author's framework groups tools by pipeline stage instead of by language, which suggests the next competitive edge for AI assistants may be how well they plug into existing creative software like Blender and Figma.

The closing argument that tools still need human judgment runs against the hype around autonomous agents, and it's worth weighing when deciding where to automate.

Concepts & terms
Skill (AI coding)
A packaged set of instructions, examples, and rules that give an AI coding assistant domain knowledge or a workflow, such as how to use GSAP or apply design principles.
MCP (Model Context Protocol)
A protocol that lets AI tools read and act on structured data from external applications, e.g., reading a Figma design file's layout and spacing.
Mixamo
A web service for auto-rigging and animating 3D characters; Motion2MixamoRig uses its rigs as targets for retargeting motion from video.
Remotion
A React library for creating videos programmatically as components, used by video-shotcraft to organize product videos in code.
MG animation
Motion graphics animation; mg-styles-15 catalogs 15 distinct styles with finished films, prompts, and source code.
Source: juejin.cn ↗ Google Translate ↗ Backup ↗