Skip to content
Skillpedia
Motion & animation101k · #615

video-template-frame-bold-poster

Helps your agent create a 1970s poster-style video. It adds elements like lines, figures, and headlines for a striking look.

What it does

This template creates a short video with a 1970s European magazine poster style. It includes effects like a red line across the screen, a tilted figure appearing, and a headline rising line by line.

When to use it

  • ✓To introduce a brand manifesto or vision statement.
  • ✓As an opener for an editorial or cultural pitch.
  • ✓When you want a few words to feel like a magazine cover.

Example of what to ask your AI

“Create a 1970s European magazine poster style video with the title 'Sustainable Future', a growing tree figure, and the subtitle 'A new beginning'.”

Want more? Open the sections below.

How to use

The easiest way: copy the message below and paste it into Claude, ChatGPT, Cursor or any AI. It reads the skill and follows the instructions.

Skill link

https://github.com/nexu-io/open-design/blob/main/plugins/_official/video-templates/frame-bold-poster/SKILL.md

Ready-to-paste message

Use this skill to help me: https://github.com/nexu-io/open-design/blob/main/plugins/_official/video-templates/frame-bold-poster/SKILL.md Read the SKILL.md file at that link and follow its instructions for my task.
How it works

The AI uses pre-defined code to animate elements like text and images. You just provide the content (headlines, text), and the AI inserts it into the existing animation.

Installation

Easiest way: copy the skill link and paste it into Claude, ChatGPT or Cursor asking it to follow the instructions.

In the terminal (Claude Code, Codex, Cursor), in your project folder:

npx skills add nexu-io/open-design --skill video-template-frame-bold-poster

Or download just the file:

curl -L https://raw.githubusercontent.com/nexu-io/open-design/main/plugins/_official/video-templates/frame-bold-poster/SKILL.md -o SKILL.md
Technical content (original SKILL.md)

Original text by the author, straight from GitHub.

Bold Poster Frame

A 1970s European editorial poster in motion — a red rule draws across, a giant tilted figure drops in, a three-line headline rises line-by-line, an italic serif standfirst fades.

What this template is

A HyperFrames-ready HTML + CSS + GSAP motion composition, bundled under source/. It renders deterministically to MP4 / WEBM at 16:9, 9:16, 1:1, default 15s, 60fps.

Best for: Brand manifesto / vision statement · Editorial or cultural pitch opener · A few words that should feel like a magazine cover

Workflow

  1. Read source/index.html to understand the named layers and the animation timeline.
  2. Replace the sample copy (headlines, figures, labels) with the user's real content; keep the motion timing and visual signature intact.
  3. Keep the composition self-contained under source/; do not introduce external network assets that would break a headless render.
  4. Render to MP4 via the html-video / HyperFrames renderer.

Attribution

Source: html-video templates/frame-bold-poster (license Apache-2.0). Derived from frontend-slides (Zara Zhang, MIT) — https://github.com/zarazhangrui/frontend-slides.

FAQ

What kind of video does this template create?

It creates short videos (motion graphics) with a look inspired by 1970s European editorial posters.

Can I change the colors or speed?

This template is designed to maintain its original style. The main changes are to the text and images, not the animation itself.

What are the video's size and format?

The video is rendered in MP4 or WEBM format, with common aspect ratios (16:9, 9:16, 1:1) and a default duration of 15 seconds.

Details

Original description by the author

Use this plugin when the user wants a "Bold Poster Frame" HyperFrames motion video — A 1970s European editorial poster in motion — a red rule draws across, a giant tilted figure drops in, a three-line headline rises line-by-line, an italic serif standfirst fades.

repo: nexu-io/open-design

Popularity

GitHub stars
101k
Ranking position
#615
License
Apache-2.0
Updated
10/16/2026

Is this skill useful?

0

Sign in to vote.

Comments

  • …

More skills from this repository

Similar skills