@autoaiai/aicut 0.1.11 → 0.1.13

package/skills/30x-web-to-video/remotion-best-practices/rules/charts.md

@@ -1,120 +0,0 @@
----
-name: charts
-description: Chart and data visualization patterns for Remotion. Use when creating bar charts, pie charts, line charts, stock graphs, or any data-driven animations.
-metadata:
-  tags: charts, data, visualization, bar-chart, pie-chart, line-chart, stock-chart, svg-paths, graphs
----
-
-# Charts in Remotion
-
-Create charts using React code - HTML, SVG, and D3.js are all supported.
-
-Disable all animations from third party libraries - they cause flickering.  
-Drive all animations from `useCurrentFrame()`.
-
-## Bar Chart
-
-```tsx
-const STAGGER_DELAY = 5;
-const frame = useCurrentFrame();
-const { fps } = useVideoConfig();
-
-const bars = data.map((item, i) => {
-  const height = spring({
-    frame,
-    fps,
-    delay: i * STAGGER_DELAY,
-    config: { damping: 200 },
-  });
-  return <div style={{ height: height * item.value }} />;
-});
-```
-
-## Pie Chart
-
-Animate segments using stroke-dashoffset, starting from 12 o'clock:
-
-```tsx
-const progress = interpolate(frame, [0, 100], [0, 1]);
-const circumference = 2 * Math.PI * radius;
-const segmentLength = (value / total) * circumference;
-const offset = interpolate(progress, [0, 1], [segmentLength, 0]);
-
-<circle
-  r={radius}
-  cx={center}
-  cy={center}
-  fill="none"
-  stroke={color}
-  strokeWidth={strokeWidth}
-  strokeDasharray={`${segmentLength} ${circumference}`}
-  strokeDashoffset={offset}
-  transform={`rotate(-90 ${center} ${center})`}
-/>;
-```
-
-## Line Chart / Path Animation
-
-Use `@remotion/paths` for animating SVG paths (line charts, stock graphs, signatures).
-
-Install: `npx remotion add @remotion/paths`  
-Docs: https://remotion.dev/docs/paths.md
-
-### Convert data points to SVG path
-
-```tsx
-type Point = { x: number; y: number };
-
-const generateLinePath = (points: Point[]): string => {
-  if (points.length < 2) return "";
-  return points.map((p, i) => `${i === 0 ? "M" : "L"} ${p.x} ${p.y}`).join(" ");
-};
-```
-
-### Draw path with animation
-
-```tsx
-import { evolvePath } from "@remotion/paths";
-
-const path = "M 100 200 L 200 150 L 300 180 L 400 100";
-const progress = interpolate(frame, [0, 2 * fps], [0, 1], {
-  extrapolateLeft: "clamp",
-  extrapolateRight: "clamp",
-  easing: Easing.out(Easing.quad),
-});
-
-const { strokeDasharray, strokeDashoffset } = evolvePath(progress, path);
-
-<path
-  d={path}
-  fill="none"
-  stroke="#FF3232"
-  strokeWidth={4}
-  strokeDasharray={strokeDasharray}
-  strokeDashoffset={strokeDashoffset}
-/>;
-```
-
-### Follow path with marker/arrow
-
-```tsx
-import {
-  getLength,
-  getPointAtLength,
-  getTangentAtLength,
-} from "@remotion/paths";
-
-const pathLength = getLength(path);
-const point = getPointAtLength(path, progress * pathLength);
-const tangent = getTangentAtLength(path, progress * pathLength);
-const angle = Math.atan2(tangent.y, tangent.x);
-
-<g
-  style={{
-    transform: `translate(${point.x}px, ${point.y}px) rotate(${angle}rad)`,
-    transformOrigin: "0 0",
-  }}
->
-  <polygon points="0,0 -20,-10 -20,10" fill="#FF3232" />
-</g>;
-```

package/skills/30x-web-to-video/remotion-best-practices/rules/compositions.md

@@ -1,154 +0,0 @@
----
-name: compositions
-description: Defining compositions, stills, folders, default props and dynamic metadata
-metadata:
-  tags: composition, still, folder, props, metadata
----
-
-A `<Composition>` defines the component, width, height, fps and duration of a renderable video.
-
-It normally is placed in the `src/Root.tsx` file.
-
-```tsx
-import { Composition } from "remotion";
-import { MyComposition } from "./MyComposition";
-
-export const RemotionRoot = () => {
-  return (
-    <Composition
-      id="MyComposition"
-      component={MyComposition}
-      durationInFrames={100}
-      fps={30}
-      width={1080}
-      height={1080}
-    />
-  );
-};
-```
-
-## Default Props
-
-Pass `defaultProps` to provide initial values for your component.  
-Values must be JSON-serializable (`Date`, `Map`, `Set`, and `staticFile()` are supported).
-
-```tsx
-import { Composition } from "remotion";
-import { MyComposition, MyCompositionProps } from "./MyComposition";
-
-export const RemotionRoot = () => {
-  return (
-    <Composition
-      id="MyComposition"
-      component={MyComposition}
-      durationInFrames={100}
-      fps={30}
-      width={1080}
-      height={1080}
-      defaultProps={
-        {
-          title: "Hello World",
-          color: "#ff0000",
-        } satisfies MyCompositionProps
-      }
-    />
-  );
-};
-```
-
-Use `type` declarations for props rather than `interface` to ensure `defaultProps` type safety.
-
-## Folders
-
-Use `<Folder>` to organize compositions in the sidebar.  
-Folder names can only contain letters, numbers, and hyphens.
-
-```tsx
-import { Composition, Folder } from "remotion";
-
-export const RemotionRoot = () => {
-  return (
-    <>
-      <Folder name="Marketing">
-        <Composition id="Promo" /* ... */ />
-        <Composition id="Ad" /* ... */ />
-      </Folder>
-      <Folder name="Social">
-        <Folder name="Instagram">
-          <Composition id="Story" /* ... */ />
-          <Composition id="Reel" /* ... */ />
-        </Folder>
-      </Folder>
-    </>
-  );
-};
-```
-
-## Stills
-
-Use `<Still>` for single-frame images. It does not require `durationInFrames` or `fps`.
-
-```tsx
-import { Still } from "remotion";
-import { Thumbnail } from "./Thumbnail";
-
-export const RemotionRoot = () => {
-  return (
-    <Still id="Thumbnail" component={Thumbnail} width={1280} height={720} />
-  );
-};
-```
-
-## Calculate Metadata
-
-Use `calculateMetadata` to make dimensions, duration, or props dynamic based on data.
-
-```tsx
-import { Composition, CalculateMetadataFunction } from "remotion";
-import { MyComposition, MyCompositionProps } from "./MyComposition";
-
-const calculateMetadata: CalculateMetadataFunction<
-  MyCompositionProps
-> = async ({ props, abortSignal }) => {
-  const data = await fetch(`https://api.example.com/video/${props.videoId}`, {
-    signal: abortSignal,
-  }).then((res) => res.json());
-
-  return {
-    durationInFrames: Math.ceil(data.duration * 30),
-    props: {
-      ...props,
-      videoUrl: data.url,
-    },
-  };
-};
-
-export const RemotionRoot = () => {
-  return (
-    <Composition
-      id="MyComposition"
-      component={MyComposition}
-      durationInFrames={100} // Placeholder, will be overridden
-      fps={30}
-      width={1080}
-      height={1080}
-      defaultProps={{ videoId: "abc123" }}
-      calculateMetadata={calculateMetadata}
-    />
-  );
-};
-```
-
-The function can return `props`, `durationInFrames`, `width`, `height`, `fps`, and codec-related defaults. It runs once before rendering begins.
-
-## Nesting compositions within another
-
-To add a composition within another composition, you can use the `<Sequence>` component with a `width` and `height` prop to specify the size of the composition.
-
-```tsx
-<AbsoluteFill>
-  <Sequence width={COMPOSITION_WIDTH} height={COMPOSITION_HEIGHT}>
-    <CompositionComponent />
-  </Sequence>
-</AbsoluteFill>
-```

package/skills/30x-web-to-video/remotion-best-practices/rules/ffmpeg.md

@@ -1,38 +0,0 @@
----
-name: ffmpeg
-description: Using FFmpeg and FFprobe in Remotion
-metadata:
-  tags: ffmpeg, ffprobe, video, trimming
----
-
-## FFmpeg in Remotion
-
-`ffmpeg` and `ffprobe` do not need to be installed. They are available via the `bunx remotion ffmpeg` and `bunx remotion ffprobe`:
-
-```bash
-bunx remotion ffmpeg -i input.mp4 output.mp3
-bunx remotion ffprobe input.mp4
-```
-
-### Trimming videos
-
-You have 2 options for trimming videos:
-
-1. Use the FFMpeg command line. You MUST re-encode the video to avoid frozen frames at the start of the video.
-
-```bash
-# Re-encodes from the exact frame
-bunx remotion ffmpeg -ss 00:00:05 -i public/input.mp4 -to 00:00:10 -c:v libx264 -c:a aac public/output.mp4
-```
-
-2. Use the `trimBefore` and `trimAfter` props of the `<Video>` component. The benefit is that this is non-destructive and you can change the trim at any time.
-
-```tsx
-import { Video } from "@remotion/media";
-
-<Video
-  src={staticFile("video.mp4")}
-  trimBefore={5 * fps}
-  trimAfter={10 * fps}
-/>;
-```

package/skills/30x-web-to-video/remotion-best-practices/rules/fonts.md

@@ -1,152 +0,0 @@
----
-name: fonts
-description: Loading Google Fonts and local fonts in Remotion
-metadata:
-  tags: fonts, google-fonts, typography, text
----
-
-# Using fonts in Remotion
-
-## Google Fonts with @remotion/google-fonts
-
-The recommended way to use Google Fonts. It's type-safe and automatically blocks rendering until the font is ready.
-
-### Prerequisites
-
-First, the @remotion/google-fonts package needs to be installed.
-If it is not installed, use the following command:
-
-```bash
-npx remotion add @remotion/google-fonts # If project uses npm
-bunx remotion add @remotion/google-fonts # If project uses bun
-yarn remotion add @remotion/google-fonts # If project uses yarn
-pnpm exec remotion add @remotion/google-fonts # If project uses pnpm
-```
-
-```tsx
-import { loadFont } from "@remotion/google-fonts/Lobster";
-
-const { fontFamily } = loadFont();
-
-export const MyComposition = () => {
-  return <div style={{ fontFamily }}>Hello World</div>;
-};
-```
-
-Preferrably, specify only needed weights and subsets to reduce file size:
-
-```tsx
-import { loadFont } from "@remotion/google-fonts/Roboto";
-
-const { fontFamily } = loadFont("normal", {
-  weights: ["400", "700"],
-  subsets: ["latin"],
-});
-```
-
-### Waiting for font to load
-
-Use `waitUntilDone()` if you need to know when the font is ready:
-
-```tsx
-import { loadFont } from "@remotion/google-fonts/Lobster";
-
-const { fontFamily, waitUntilDone } = loadFont();
-
-await waitUntilDone();
-```
-
-## Local fonts with @remotion/fonts
-
-For local font files, use the `@remotion/fonts` package.
-
-### Prerequisites
-
-First, install @remotion/fonts:
-
-```bash
-npx remotion add @remotion/fonts # If project uses npm
-bunx remotion add @remotion/fonts # If project uses bun
-yarn remotion add @remotion/fonts # If project uses yarn
-pnpm exec remotion add @remotion/fonts # If project uses pnpm
-```
-
-### Loading a local font
-
-Place your font file in the `public/` folder and use `loadFont()`:
-
-```tsx
-import { loadFont } from "@remotion/fonts";
-import { staticFile } from "remotion";
-
-await loadFont({
-  family: "MyFont",
-  url: staticFile("MyFont-Regular.woff2"),
-});
-
-export const MyComposition = () => {
-  return <div style={{ fontFamily: "MyFont" }}>Hello World</div>;
-};
-```
-
-### Loading multiple weights
-
-Load each weight separately with the same family name:
-
-```tsx
-import { loadFont } from "@remotion/fonts";
-import { staticFile } from "remotion";
-
-await Promise.all([
-  loadFont({
-    family: "Inter",
-    url: staticFile("Inter-Regular.woff2"),
-    weight: "400",
-  }),
-  loadFont({
-    family: "Inter",
-    url: staticFile("Inter-Bold.woff2"),
-    weight: "700",
-  }),
-]);
-```
-
-### Available options
-
-```tsx
-loadFont({
-  family: "MyFont", // Required: name to use in CSS
-  url: staticFile("font.woff2"), // Required: font file URL
-  format: "woff2", // Optional: auto-detected from extension
-  weight: "400", // Optional: font weight
-  style: "normal", // Optional: normal or italic
-  display: "block", // Optional: font-display behavior
-});
-```
-
-## Using in components
-
-Call `loadFont()` at the top level of your component or in a separate file that's imported early:
-
-```tsx
-import { loadFont } from "@remotion/google-fonts/Montserrat";
-
-const { fontFamily } = loadFont("normal", {
-  weights: ["400", "700"],
-  subsets: ["latin"],
-});
-
-export const Title: React.FC<{ text: string }> = ({ text }) => {
-  return (
-    <h1
-      style={{
-        fontFamily,
-        fontSize: 80,
-        fontWeight: "bold",
-      }}
-    >
-      {text}
-    </h1>
-  );
-};
-```

package/skills/3d-asset-generation/SKILL.md

@@ -1,142 +0,0 @@
----
-name: 3d-asset-generation
-description: "Generate, reconstruct, inspect, and route production 3D assets for AICUT worlds using Atlas Cloud, fal.ai, licensed catalogs, and Blender. Runs in AICUT: the film is film.html, a page per shot, drawn by `aicut look` and `aicut render`."
-license: MIT
-source: "calesthio/OpenMontage"
----
-
-# 3D Asset Generation
-
-## Running it in AICUT
-
-AICUT's film is `film.html`: it cuts pages, footage, pictures and sound together on tracks. A page is a web page that
-sets `window.film = { frame(t) }` and draws that moment — no framework, no build step, no composition object, no
-`registerRoot`. Five shots are five pages cut together, not one page that changes scene, so each shot stays trimmable
-and replaceable in Studio.
-
-```sh
-npx -y @autoaiai/aicut@latest          # the manual: the format and the commands, always current
-npx -y @autoaiai/aicut@latest open .   # make this folder a film and print Studio's address
-npx -y @autoaiai/aicut@latest look     # a contact sheet of the whole film, its sound, and a determinism check
-npx -y @autoaiai/aicut@latest look 4.5 # one frame, full size — look at the PNG, not at the code
-npx -y @autoaiai/aicut@latest render   # the MP4, beside film.html
-```
-
-Run the manual before the first film: it is authoritative for the format, and this skill is about the method above it.
-
-Where the words below name another program's part, it becomes this:
-
-| elsewhere | in AICUT |
-|---|---|
-| composition, timeline, project file | `film.html`; tracks and clips inside it |
-| a scene, a sequence, a slide | a page (`pages/<name>.html`) cut onto a track |
-| `useCurrentFrame()`, `interpolate()` | `frame(t)` — the picture depends only on `t`, never on state or `Date.now()` |
-| a still, a screengrab | `aicut look <t>` |
-| `render` / `build` / `export` | `aicut render` (the person can also export from Studio) |
-| a dev server, a preview window | `aicut open` and the Studio address it prints |
-
-Hard rules that hold whatever the method says: the picture depends only on `t`; every value in the person's prompt is
-binding; look at the frames `look` writes before saying a film is done.
-
-
-Use this skill when a production needs real meshes rather than primitive stand-ins.
-It complements `threejs-world-generation`: that skill owns semantic world planning;
-this skill owns how unique and repeated meshes enter the world with provenance.
-
-## Route by asset role
-
-| Need | Tool | Model/path | Why |
-|---|---|---|---|
-| Repeated vegetation, rocks, generic props | `threejs_asset_catalog` | CC0 Kenney catalog | Free, coherent, instancing-friendly |
-| Unique object described in words | `atlas_3d` | `tripo-h3.1/text-to-3d` | Direct textured/PBR GLB with seeds and face limit |
-| Object matching a concept image | `fal_3d` | Hunyuan 3D v3.1 Rapid image-to-3D | Better silhouette/style conditioning from one image |
-| Several objects extracted from one regional composition | `fal_3d` | SAM 3D Objects | Individual and combined GLBs plus placement metadata |
-| Terrain, composition, lighting, camera, final frames | `blender_world` | Blender 4.5 LTS / Eevee Next | Scene-level control; generated-asset APIs are not world renderers |
-
-Never ask a text-to-3D model to generate a whole cinematic world in one mesh.
-Generate hero objects, use licensed catalogs for high-volume scatter, and assemble
-everything in Blender from a semantic specification.
-
-## Paid-call discipline
-
-Before every first provider call, state the exact provider, model, operation,
-estimated unit cost, and number of requested outputs. Generate one sample before
-a batch. As of 2026-08-13:
-
-- Atlas Tripo H3.1: $0.22 untextured; $0.33 standard textures; $0.44 HD
-  textures; detailed geometry adds $0.22; quad mesh adds $0.055.
-- fal Hunyuan 3D v3.1 Rapid: $0.225 per generation; PBR adds $0.15.
-- fal SAM 3D Objects: $0.02 per reconstruction.
-
-Pricing changes. Confirm the provider page before quoting or running a batch.
-
-## Asset prompt contract
-
-Each request describes one isolated object, not a shot:
-
-1. Name the object and silhouette.
-2. Specify construction materials and visible wear.
-3. Specify the project's art style and color constraints.
-4. State scale and orientation.
-5. Exclude ground plane, backdrop, extra objects, labels, and lighting rigs.
-
-For image-to-3D, use a simple background and make the object occupy more than
-half the frame. Request PBR only for assets close enough to benefit from it.
-
-## Mandatory mesh QA
-
-Do not approve from the provider thumbnail alone. Import the downloaded artifact
-into Blender and inspect:
-
-- front, rear, and silhouette;
-- geometry holes and floating pieces;
-- ground contact, scale, and orientation;
-- UV seams and missing texture slots;
-- base-color, roughness, metallic, and normal response;
-- triangle count and whether the intended camera distance justifies it.
-
-Record provider, model id, prompt, seeds, source page, cost, and output path in
-the asset provenance manifest. Failed samples remain failed; do not silently
-swap provider or spend on another model.
-
-### Assembly normalization is mandatory
-
-Provider and catalog GLBs rarely share units, origins, or up-axis assumptions.
-Never compensate with arbitrary scene-level scale guesses. The Blender assembly
-spec declares `target_height`; the renderer measures the imported bounding box,
-normalizes to that target, and offsets the bounding-box floor to the sampled
-terrain height. Review the resulting real-world scale and ground contact.
-
-Repeated scatter must declare semantic `exclusion_zones` around settlements,
-roads, rivers, landmark apertures, and hero camera sightlines. Density that
-occludes the subject is not production detail. Waterways and paths must use flat
-terrain-following ribbons; beveled 3D curves read as pipes from aerial cameras.
-
-Landmarks whose reveal timing matters declare visibility windows in the scene
-spec. Camera occlusion remains preferred for natural reveals, but deterministic
-visibility keys are the hard guarantee for approved timing.
-
-## World fidelity budget
-
-A reference-grade region needs three simultaneous density layers:
-
-- macro: authored terrain silhouettes, waterways, paths, settlements;
-- meso: hero buildings, bridges, cliffs, canopy clusters, props;
-- micro: ground cover, rocks, flowers, debris, material breakup.
-
-The asset gate must show global, regional, and walk-height Blender stills. A
-wide aerial alone can hide broken contacts; a walk shot alone can hide an empty
-world. Primitive-only previews must be labeled `blockout` and cannot pass as a
-production-fidelity review.
-
-For a final animation, render a small bounded frame range first and measure the
-per-frame time. Choose the full-render resolution from that measurement rather
-than intuition, render a numbered PNG sequence, and call `blender_world` with
-`resume: true` after interruption so it starts at the first missing frame.
-
-## Source
-
-Rewritten for AICUT from [`calesthio/OpenMontage`](https://github.com/calesthio/OpenMontage)
-(MIT), .agents/skills/3d-asset-generation/SKILL.md. The method is that skill's own; the way it runs is AICUT's.
-
-The repository holds 140 skills; this is the one its entry stands for.