honglin0000/livecanvas

LiveCanvas · 실시간 캔버스

사용자의 한마디를 증거가 있고, 정적으로 읽을 수 있으며, 동적으로 내용을 전달하는 실시간 모션 카드로 만듭니다. 원래 이름은 LiveChart, 현재는 LiveCanvas(실시간 캔버스)로, 차트, 이미지 및 장면 내러티브를 포괄합니다. 기본적으로 주제와 관련된 이미지/아이콘 및 장면 동작을 능동적으로 설계하며, 차트는 선택 사항입니다. 기본값은 중국어, Remotion, 1080×1440, 30fps, 약 3초, 무음입니다. 이는 시작점이며, 내용에 따라 조정할 수 있습니다. 3초는 주장된 Apple 형식 제한이 아닙니다.

먼저 내용을 정하고, 그 다음 모션을 정합니다

1. 요청에서 주제, 지표, 시간 범위, 비교 관계, 용도를 추출합니다. 주어진 기사나 보고서가 있으면 먼저 전체 자료를 읽고, 그런 다음 주요 이벤트, 변화, 능력, 비교 및 장면을 추출합니다. 내용 중요도에 따라 분량을 할당하며, 가격이나 표시하기 쉬운 숫자만 골라잡지 않습니다. 구체적인 요구 사항이 우선이며, 사용자가 제공한 예시를 고정 템플릿으로 취급하지 않습니다.
2. 데이터를 검색하고 확인하며, 데이터 및 측정 기준을 읽습니다. 먼저 원본 증거, 사실 또는 구조화된 데이터를 저장한 다음, 제목, 숫자 및 주석을 작성합니다. 시계열이 없는 주제는 사실 카드, 과정 또는 장면 설명을 사용할 수 있습니다. 차트를 위해 데이터를 조작하지 않습니다.
3. 간단한 제작 설명을 작성합니다: 전체 콘텐츠의 주요 흐름, 각 슬라이드의 주제와 결론, 사실/데이터의 측정 기준, 표지 정보 계층, 스토리보드 타임라인 및 자료 계획. 슬라이드 수는 사용자 요구와 내용에 따라 결정되며, 특정 수나 주제 조합으로 고정되지 않습니다. 주제에 가장 적합한 표현을 선택하며, 기본적으로 꺾은선 그래프와 숫자를 사용하지 않습니다. 디자인 판단을 직접 수행합니다. 누락된 정보가 답변을 실질적으로 변경하는 경우에만 질문합니다.
4. 표지 및 모션에 따라 제작합니다. Emil Kowalski의 animate 원칙인 목적성, 절제, 연속성, 명확한 리듬을 흡수합니다. 사용자가 이미 Remotion을 지정했으므로, 상위 도구 교체 단계를 수행하지 않으며, 대화형 컴포넌트의 시간 제한을 설명형 비디오에 기계적으로 적용하지 않습니다.

카피: 사실과 데이터를 직접 작성합니다

• 제목은 우선 "주제 + 숫자/변화/명확한 결론" 형식으로 작성합니다. 예를 들어 "출력 상한 1M tokens", "최초 작업 비용 39% 절감", "Text Arena 일단 1위". 필요한 숫자가 없으면 제품명, 버전 또는 구체적인 이벤트를 직접 쓰고, 데이터를 억지로 끼워 맞추지 않습니다.
• 간결하고 직관적인 진술을 사용하며, 공허한 홍보, 질문, 비유, 대구, 장식적인 영어 레이블을 삭제합니다. "재정의", "세 가지 변화를 읽다", "수익을 실제 시나리오에 적용하다" 등의 문장을 사실 대신 사용하지 않습니다. 본문과 이미지 설명도 동일한 기준을 따릅니다. 출처는 기관명으로 명확히 작성합니다(예: Artificial Analysis, AA만 쓰지 않음). 작성 예시와 제한 조건은 표지 및 모션을 참조하세요.
• 사용자가 "AI 냄새가 너무 나요", "데이터를 직접 보여주세요", "화려하지 않게 해주세요"라고 말하면, 우선 카피와 관련 없는 장식을 간소화합니다. 기존 주제, 정보, 필요한 자료 및 선택된 디자인 방향은 유지하며, 임의로 주제 표지를 삭제하거나, 주제를 병합하거나, 전체 세트를 동일한 데이터 템플릿으로 변경하지 않습니다.
• 수정 시 확인된 주제, 정보 및 시각적 요구 사항을 유지합니다. 사용자가 슬라이드 수나 초점을 변경하면 콘텐츠를 재할당하고, 병합, 교체 및 재사용 관계를 설명합니다. 기계적으로 페이지를 나누거나 주제를 반복하여 수를 채우지 않습니다. 슬라이드 번호로 개정 전후 콘텐츠를 확인하고, 전체 패키지는 다른 콘텐츠에 대해 중복을 제거합니다.

시각적 표현

• 표지는 제품명, 버전 번호 또는 핵심 개체로 시각적 위계를 설정합니다. "등장감", "충격력" 등은 효과 설명이며, 직접 화면 텍스트로 사용하지 않습니다. 구체적인 방법은 표지 및 모션을 참조하세요.

• 전체 세트는 통일된 색상, 글꼴 및 그래픽 언어를 사용하며, 내용에 따라 구도를 선택합니다. 그래픽으로 사실과 관계를 설명하고, 텍스트, 큰 숫자, 장식용 카드를 쌓거나 동일한 템플릿을 기계적으로 반복하지 않습니다.

• 기본적으로 주제의 개체가 화면에 나타나도록 합니다: 제품 PNG, 커피잔, 자동차, 열차, 메달, 도시 사진, 날씨 이모지 등. 내용과 관련된 통일된 스타일의 자료 세트를 선택하며, 차트 구석에 장식을 붙이지 않습니다.

• 개체의 등장, 움직임, 배열, 교체 또는 상태 변화를 설계하여 내용을 설명합니다. 예를 들어 열차가 연도 노드를 지나가고, 커피잔이 매장 카드를 가져오고, 도시 화면이 계절에 따라 전환됩니다.

• 주제에 따라 장면, 이미지 비교, 아이콘 배열, 타임라인, 과정 시연, 주요 텍스트 및 필요한 차트를 결합합니다. 순수 차트는 가장 명확하거나 사용자가 지정한 경우에만 사용합니다.

• 이미지나 이모지를 사용할 때는 이미지 및 아이콘을 읽고, 자료를 찾고 가용성을 확인하여 프로젝트에 포함시킵니다. 사용자가 먼저 자료를 제공할 필요가 없습니다.

검색 기본값

• "최근 3년": 최신 신뢰할 수 있는 완료된 관측일까지의 롤링 3년, 실제 시작 및 종료 날짜를 명시하며, 세 개의 연말 값으로 기본 설정하지 않습니다. 월별 차트는 완료된 월말 관측치를 사용합니다. 가장 최근의 미완료 월은 별도로 명시해야 합니다.
• "연간 온도"에 연도가 지정되지 않은 경우: 가장 최근의 완전한 자연년을 사용하며, 기본적으로 월 평균 기온을 사용합니다. 결과 시작 부분에 선택을 설명합니다. 의도가 명백히 연중 기후인 경우, 명확한 기준 기간이 있는 기후 평균값을 사용합니다.
• 회사 간 비교는 관측 날짜, 지표, 통화를 일치시키거나 동일한 기준 지수를 사용하며, 원래 절대값을 유지합니다.
• 상승, 하락, 보합, 계절 순환을 허용합니다. 사용자가 "성장 곡선"이라고 말했더라도 하락을 성장으로 그리지 않습니다.
• 날짜는 사용자 시간대를 기준으로 해석하며, 기계 날짜를 사용하여 "올해"를 하드코딩하지 않습니다.

제작 및 패키징

실행 및 전달 및 직접 전달을 읽습니다. 리소스 경로는 이 skill 디렉토리를 기준으로 합니다. 이 절대 경로를 SKILL_DIR이라고 합니다.

• assets/remotion/을 렌더링 프로젝트의 시작점으로 현재 디렉토리에 복사하고, 포함된 잠금 파일을 사용하여 npm ci를 실행합니다. 그 안의 꺾은선 그래프는 예시일 뿐이며, 스토리보드에 따라 composition을 다시 작성해야 하며, 기본 완성본 레이아웃이 아닙니다. 설치된 skill 디렉토리 내에서 출력을 생성하거나 종속성을 설치하지 마십시오.
• 예시 data.json은 합성 데이터이며 테스트용으로만 사용됩니다. 실제 제작 시에는 데이터와 카피를 교체하고, 예시 마커를 제거하기 전에 사실 확인을 완료해야 합니다.
• 시계열 데이터는 scripts/validate_data.py를 사용하여 날짜, 출처 인용, 범위 및 적용 범위를 확인합니다. 다른 콘텐츠는 데이터 및 측정 기준에 따라 적절한 사실/비교 구조를 사용하며, 날짜 시퀀스를 강제로 적용하지 않습니다. 검증을 통과했다고 해서 출처 사실이 확인된 것은 아닙니다.
• 모든 애니메이션은 useCurrentFrame()으로 구동됩니다. CSS 애니메이션, 벽시계, 고정되지 않은 난수, 웹 갤러리 자체 애니메이션은 금지됩니다.
• 이미지, 이모지, 텍스트, 장면 및 차트를 동일한 스토리보드에 통합하고, 추적 가능한 사실, 정적 표지, 결정적 렌더링 및 검증 프로세스를 유지합니다.
• 동일한 composition의 전체 정지 프레임에서 cover.jpg를 내보내고, coverFrame / fps를 기록합니다. 표지 화면은 애니메이션 내에 나타나야 하며, still-image-time은 동일한 시간을 가리킵니다.
• 생성 환경에 따라 페어링 도구를 선택합니다: macOS는 scripts/pair_live_photo.swift를 사용할 수 있습니다. Linux / Windows는 scripts/pair_live_photo.py를 사용하며, 크로스 플랫폼 Apple Live Photo를 읽습니다. 두 경로 모두 무음 H.264와 JPEG를 공유 식별자 및 timed metadata를 포함한 Apple 페어링 리소스로 작성합니다. 이는 중간 단계이며, 전달 완료로 간주되지 않습니다. 다른 입력은 먼저 트랜스코딩하고, 사용자 오디오 트랙을 묵묵히 버리지 않습니다.
• 패키징 완료 후 페어링된 MOV를 다시 일반 트랜스코딩하지 마십시오. 메타데이터 트랙이 손실될 수 있습니다.
• scripts/package_live_photo.py를 사용하여 명명 규칙이 명확한 단일 .pvt 패키지를 생성합니다. 이를 실시간 리소스 패키지로 표시하며, iPhone '파일' 앱에서 직접 미리보기가 가능하다고 보장하지 않습니다. '사진' 앱을 자동으로 열거나 가져오지 않으며, 사진 라이브러리를 수정하지 않습니다. JPG + MOV 페어링 리소스에서 멈추지 않습니다.

검증 및 완료 기준

먼저 사실과 자료를 확인한 다음, 표지와 비디오를 미리 봅니다: 시작, 주요 동작 중간, 전환, 데이터 극값(있는 경우) 및 표지 정지 프레임을 무작위로 확인합니다. 이미지 로딩, 이모지 글리프, 투명 가장자리, 중국어 글꼴, 레이블 겹침, 값 동기화, 단위, 날짜 및 자르기를 확인합니다. 동작이 주제를 설명하고 있는지 확인하며, 숫자와 막대 변화만 있는지 확인합니다. 실제 곡선은 가짜 피크/밸리를 유발하는 부드럽게 처리를 사용하지 않습니다. 누락된 데이터 지점은 선을 끊습니다. 세트 전체에서 중요한 내용과 비교 관계가 유지되는지, 표지 주제가 명확한지, 스타일이 통일되어 있는지 확인합니다. 숫자 스크롤은 중간 프레임과 최종 값을 확인하고, 정적 표지는 완전하고 읽을 수 있어야 합니다.

상태를 각각 기록하며, 이전 항목을 다음 항목의 성공으로 간주하지 않습니다:

1. 데이터 및 출처 확인; 기계적 검증은 그 일부일 뿐입니다.
2. 표지 및 MP4 렌더링 완료, 자료 및 주요 동작 가시적, 메타데이터 및 화면 검사 통과.
3. Live Photo 식별자 일치, timed metadata 시간 위치 정확.
4. Apple 환경이 있는 경우 PHLivePhoto.request 네이티브 로드 성공 또는 구체적인 실패를 기록합니다. 순수 Python 생성 환경에서는 not_available로 기록하고, 통과를 위조하지 않습니다.
5. .pvt 패키지가 완전하고 페어링된 리소스의 해시가 일치합니다.
6. 앨범 가져오기, 기기 재생, 타사 플랫폼 업로드 및 잠금 화면 호환성은 모두 선택 사항이며, 사용자가 별도로 명시적으로 요청한 경우에만 작업하고 기록하며, 파일 전달의 전제 조건으로 간주하지 않습니다.

macOS가 없는 경우 크로스 플랫폼 Python 페어링 및 패키징을 실행하며, 운영 체제 때문에 MP4 + 표지로 되돌릴 수 없습니다. 메타데이터 읽기, 비디오 디코딩 및 패키지 무결성 확인을 통과하면 리소스를 전달할 수 있습니다. Apple 네이티브 로드, iPhone 가져오기/재생은 각각 기록합니다. 실제 종속성이 없고 설치가 불가능한 경우에만 미리보기를 전달하고 차단 항목을 명확히 하며, 플랫폼에서 생성할 수 없다고 주장하지 않습니다. 생성된 파일은 휴대폰 미리보기, 저장 또는 재생 성공을 증명하지 않습니다.

전달

각 주제는 독립 디렉토리를 가지며, 직접 시청 가능한 미리보기와 주제명.pvt 실시간 리소스 패키지를 동시에 제공하고, delivery.json을 저장합니다. 또한 data.json, 원본 증거, sources.md, 로컬 자료가 포함된 편집 가능한 Remotion 프로젝트, 자료 목록 assets.json(자료 사용 시), cover.jpg, motion.mp4, 내부 live/ 페어링 리소스 및 manifest, qa.json을 보관합니다. 압축 패키지는 전송용일 뿐이며, 직접 식별 가능한 Live Photo가 아닙니다.

시청 가능한 표지/동적 미리보기를 우선 표시하고, 별도로 .pvt 리소스 패키지 링크, 데이터 마감일 및 검증 상태를 첨부합니다. 사용자가 휴대폰에서 직접 미리보기를 요청하면 수신 경로를 확인합니다. 파일 패키지 생성 또는 네이티브 로드 성공만으로 충족되었다고 주장할 수 없습니다. 전송 인터페이스가 디렉토리 패키지를 지원하지 않는 경우 .pvt.zip을 첨부하고, 압축을 풀면 리소스 패키지를 얻을 수 있으며 여전히 Live Photo를 지원하는 앱으로 읽어야 한다고 명시합니다. 웹 LivePhotosKit 미리보기와 네이티브 실시간 사진 저장은 두 가지 능력이며, 구현되지 않은 능력을 약속하지 않습니다. 표지 및 MP4는 미리보기로만 표시할 수 있습니다. 채팅 인터페이스에서 Apple 실시간 사진을 네이티브로 표시할 수 없는 경우 간략히 설명합니다. "직접 Live Photo 전달"을 앨범 가져오기로 해석하지 말고, 사진 라이브러리 권한을 요청하지 않으며, 가져오기를 트리거할 수 있는 .pvt를 자동으로 열지 않습니다. 요청 없이 소셜 플랫폼에 게시하지 않습니다.

예시 트리거

• "LiveCanvas로 샤오미의 최근 3년 시가총액 변화를 만들어 줘."

• "애플과 샤오미의 최근 3년 시가총액을 두 장의 실시간 사진으로 만들고, 스타일을 통일해 줘."

• "베이징의 작년 연간 기온을 라이브 사진으로 만들고, 표지도 디자인해 줘."

• "이 데이터를 움직이는 인포그래픽으로 만들어서 Apple 실시간 사진으로 내보내 줘."

• "커피잔 PNG와 매장 카드를 사용해서 스타벅스와 Luckin의 확장 스토리를 만들어 줘."

• "열차, 연도 노드 및 주행 거리 숫자를 사용해서 중국 고속철도의 실시간 모션을 만들어 줘."