무료
Solenne · 16:9
이 Skill로 렌더링한 결과
3D 휴대폰 홈 화면 v1.0.0
부드러운 스튜디오 조명 속에서 3D 휴대폰이 회전하며 리퀴드 글래스 홈 화면, 실시간 알림, 내 웹 앱을 보여 줍니다.
아직 평가 없음 0 다운로드
- 포맷
- 영상 · 16:9
- 길이
- 0:15
15초 분량 3D 기기 B롤을 위한 무료 HyperFrames 블록입니다. 셰이더 배경화면 아래 책상 위에서 3D 휴대폰 모델이 회전하고, 리퀴드 글래스 홈 화면에 앱 아이콘, 위젯, 알림이 미끄러져 들어온 뒤 히어로 문구와 카드가 있는 웹 페이지가 열립니다. 화면 속 모든 콘텐츠(아이콘, 레이블, 알림, 페이지)는 편집할 수 있는 HTML이며, 휴대폰과 노트북은 3D 모델입니다.
2026년 11월 4일 업데이트
받게 되는 것
- 3D 휴대폰이 담긴 15초 길이 1920×1080 MP4
- 리퀴드 글래스 홈 화면, 알림, 화면 속 내 페이지
- 화면의 모든 픽셀을 고칠 수 있는 HTML
잘 맞는 경우
- 앱 출시 필름과 B롤
- 랜딩 페이지 히어로 영상
- 투자자 미팅과 키노트 데모
맞지 않는 경우
- 앱의 실제 녹화 화면 보여 주기
- 세로 전용 포맷
이 Skill에 대하여
이렇게 말하세요
/ios26-liquid-glass Solenne 3D 휴대폰 홈 화면을 만들어 줘. 저녁 장면과 에너지 리포트에 관한 알림, 그리고 "Your home, on cue"가 적힌 Solenne 페이지로.
기기 B롤만 있으면 어떤 앱이든 이미 출시된 제품처럼 보입니다. 3D 휴대폰 홈 화면은 최신 리퀴드 글래스 홈 화면을 띄운 진짜 3D 휴대폰을 렌더링해, 스튜디오 조명 아래에서 내 알림이 뜨고 내 웹 앱이 열리게 합니다. 촬영도, 3D 아티스트도 필요 없습니다.
작동 방식
- 요청: 휴대폰에 띄울 알림, 앱 이름, 페이지 내용을 에이전트에게 알려 줍니다.
- 채우기: 문구와 색을 블록 변수에 넣고, 텍스트는 레이아웃이 설계된 길이에 가깝게 맞춥니다.
- 렌더링:
npx hyperframes render로 초안을 렌더링해 몇 프레임을 확인한 뒤 최종 MP4를 렌더링합니다. - 재사용: 변수는 작은 JSON 파일 하나에 들어 있어, 다음 버전도 렌더링 한 번이면 됩니다.
팁
- 기본 앱 아이콘과 이름은 내 것이나 중립적인 것으로 바꾸세요. 저희 샘플도 그렇게 했습니다.
- 알림은 각각 짧은 한 줄로 쓰세요.
- 페이지에는 제품의 실제 브랜드 컬러를 쓰세요.
- 변수가 없는 블록입니다. 에이전트가 SKILL.md에 따라 HTML 안의 텍스트를 직접 고칩니다.
오픈소스
HyperFrames 레지스트리 블록입니다. HeyGen과 HyperFrames 기여자들이 만들어(heygen-com/hyperframes) Apache License 2.0으로 공개했습니다. 다운로드에는 에셋이 포함된 블록과 Reelity가 작성한 SKILL.md가 들어 있어 에이전트가 바로 채우고 렌더링할 수 있으며, HyperFrames 자체는 npm에서 실행됩니다.
시작 전에 필요한 것
- 준비물
- 화면에 띄울 알림, 앱 이름, 페이지 문구, 그리고 브랜드 컬러.
- 의존성
- Node.js 22 이상 — 필수 · FFmpeg — 필수
- 외부 비용
- 없습니다. HyperFrames는 무료 오픈소스이며 내 컴퓨터에서 렌더링됩니다.
- 마지막 테스트
- v1.0.0 —
사용자 리뷰
아직 리뷰가 없습니다. Skill을 설치하고 첫 평가를 남겨 보세요.
자주 묻는 질문
실제 앱 아이콘이 들어 있나요?
원본에는 플레이스홀더로 유명 앱 아이콘이 들어 있습니다. 내 아이콘이나 중립적인 아이콘으로 바꾸세요. 저희 샘플은 생성한 중립 아이콘을 씁니다.
화면에 스크린샷을 넣을 수 있나요?
네. 화면이 HTML이라 앱 이미지로 페이지를 대신할 수 있습니다.
왜 무료인가요?
HeyGen과 HyperFrames 기여자들의 오픈소스 HyperFrames 블록입니다. 그대로 소개하며, 에이전트가 쓸 수 있도록 SKILL.md를 더하고 저희 하우스 브랜드 중 하나인 Solenne로 만든 샘플을 함께 올렸습니다.
