개념 설명 / MOTION STUDY

막대와 꺾은선으로 비교하는 차트

막대와 꺾은선으로 비교하는 차트을 만드는 공개 요청문입니다. 원문과 결과를 함께 살펴볼 수 있습니다.

원본 보기 ↗

원본 영상 · 무음으로 자동 재생됩니다. 소리는 영상의 음량 버튼으로 켤 수 있습니다.

원본에서 보기 ↗

자료 상태원문 프롬프트

실행·재현미검증

MP4 출력미검증

자료 확인일2026-10-07

수집한 작품입니다. 이 안내로 같은 결과를 재현했거나 영상 파일 출력을 확인했다는 뜻은 아닙니다. 브라우저 애니메이션과 MP4 영상 출력은 별도로 확인해야 합니다.

어떤 원리로
움직일까요?

공개된 자료만으로 구현 원리를 확정할 수 없습니다. 원본 결과와 요청문을 살펴보고, 구현을 시작하기 전에 사용할 기술과 효과를 에이전트에게 설명해 달라고 요청하세요.

자료에 표시된 도구Remotion · React

공개 자료에서 확보한 원문 요청문입니다.

Create a 1920x1080 dark-themed (#1A1A2E) composition called 'BarLineChart' with a combination chart showing monthly sales data — bars for revenue ($8K, $12K, $15K, $11K, $18K, $22K for Jan-Jun) that grow upward from the baseline, overlaid with a blue (#0B84F3) line tracking conversion rate (2.1%, 2.8%, 3.2%, 2.9%, 3.8%, 4.2%) that draws progressively with a glowing effect, bars animate sequentially with slight overlap while the line follows behind, include axis labels and a pulsing dot marker at the line tip, smooth spring-based timing over 120 frames at 30fps — use remotion-best-practices skill.

이제,
내 버전으로.

소재와 조건을 바꾸면 실행에 쓸 요청문이 완성됩니다.

만들 대상영상 길이 (초)분위기핵심 문구브랜드 색상사용 도구

내 프로젝트 요청문

입력 내용이 바로 반영됩니다.

Create a 1920x1080 dark-themed (#1A1A2E) composition called 'BarLineChart' with a combination chart showing monthly sales data — bars for revenue ($8K, $12K, $15K, $11K, $18K, $22K for Jan-Jun) that grow upward from the baseline, overlaid with a blue (#0B84F3) line tracking conversion rate (2.1%, 2.8%, 3.2%, 2.9%, 3.8%, 4.2%) that draws progressively with a glowing effect, bars animate sequentially with slight overlap while the line follows behind, include axis labels and a pulsing dot marker at the line tip, smooth spring-based timing over 120 frames at 30fps — use remotion-best-practices skill.

[참고 작품]
제목: 막대와 꺾은선으로 비교하는 차트
핵심 효과: 막대와 꺾은선으로 비교하는 차트을 만드는 공개 요청문입니다. 원문과 결과를 함께 살펴볼 수 있습니다.
원본: https://www.remotion.dev/prompts/bar-line-chart-combined
참고 구현 기술: Remotion, React

[내 프로젝트 조건]
만들 대상: 내 서비스 소개
목표 길이: 15초
분위기: 절제된 제품 광고
핵심 문구: 반복 업무를 줄이세요
브랜드 색상: 검정, 흰색
사용 도구: Claude Code

[결과 요구사항]
1. 필요한 파일과 설치 과정을 먼저 알려 주세요.
2. 핵심 효과를 구현한 뒤 글자, 색상, 속도를 쉽게 바꿀 수 있게 해 주세요.
3. 브라우저에서 실행되는 결과를 먼저 확인해 주세요.
4. MP4 출력은 별도 단계입니다. 출력 도구와 해상도, 프레임 수, 파일 생성 여부를 확인하고, 지원하지 않으면 정확히 알려 주세요.
5. 직접 실행하지 않은 항목은 검증 완료로 표시하지 마세요.

[준비할 자료]
- 사용 권한이 있는 로고와 이미지
- 표시할 문구와 브랜드 색상
- 사용할 음악이 있다면 권리를 확보한 음원

[실행 및 확인 순서]
1. 요청문을 에이전트에 전달하고 구현 계획을 확인합니다.
2. 필요한 자료를 추가하고 로컬 실행 방법을 확인합니다.
3. 브라우저에서 오류 없이 실행되는지 확인합니다.
4. 영상 파일이 필요하면 별도 출력 단계를 요청합니다.

[작품별 확인 사항]


[문제 해결]
- 실행 오류를 먼저 해결한 뒤 시각 효과를 조정합니다.

[수정 요청문]
핵심 효과가 잘 드러나지 않습니다. 현재 결과와 요청 조건의 차이를 확인하고, 동작 타이밍과 화면 구성을 한 항목씩 수정해 주세요. 수정 후 실행 결과를 다시 확인해 주세요.

실행할 때 확인할 것

필요한 자료의 사용 권한과 파일 경로를 확인합니다.
브라우저에서 오류 없이 실행되는지 확인합니다.
참고 작품의 핵심 효과와 내 결과를 비교합니다.
MP4 파일이 필요하면 실제 파일 생성과 재생을 확인합니다.

결과가 예상과 다를 때

오류 메시지와 실행 환경을 함께 전달하고 수정을 요청합니다.

한 번에 한 가지 효과를 수정한 뒤 결과를 다시 확인합니다.

막대와 꺾은선으로 비교하는 차트

어떤 원리로움직일까요?

이제,내 버전으로.

내 프로젝트 요청문

실행할 때 확인할 것

어떤 원리로
움직일까요?

이제,
내 버전으로.