Film Strip Herov1.0.1
이 Skill로 다음을 할 수 있습니다: UI 비주얼 제작.
급상승
5.0다운로드 33회좋아요 0개저장 0회
$4.99
이 Skill을 구매하면 무엇을 받나요?Film Strip Hero는 바로 붙여 넣어 쓰는 Hero 섹션으로, 편집 가능한 소스와 사용 예제가 함께 제공됩니다. 방문자가 직접 조작하는 스크롤·단계 인터랙션과 튕기지 않고 차분히 자리 잡는 등장 모션을 갖추고 있습니다. 색상, 서체, 모서리 반경은 토큰으로 관리되어 한 번만 수정하면 블록 전체에 반영됩니다.
2026년 8월 31일 업데이트
미리보기 갤러리
비슷한 Skill
모든 Skill 보기
제공 내용
- Film Strip Hero의 전체 소스 — 컴포넌트 파일과 실행 가능한 사용 예제로, 바로 붙여 넣고 편집할 수 있습니다.
- 문서화된 비주얼 규약: 팔레트, 타입 스케일, 모서리 반경, 아이콘 선 굵기, 모션 타이밍을 모두 한곳에서 수정하는 토큰으로 정리했습니다.
- 인물 사진과 사진 이미지가 블록과 함께 제공되며, 외부에서 불러오지 않고 로컬에 저장된 상태로 이미 배치되어 있습니다.
이런 분께 추천
- Hero 섹션이 필요하고, 빈 캔버스보다 완성된 섹션을 원할 때.
- 이미지까지 배치되어 렌더링 즉시 완성돼 보이는 첫 화면을 원할 때.
- 또 하나의 의존성을 계속 업그레이드하며 관리하기보다, 읽기 쉽고 직접 수정할 수 있는 소스를 원하는 경우.
이런 분께는 비추천
- 이미 성숙한 디자인 시스템을 운영 중인 팀 — 이 팔레트와 타입 스케일이 기존 것과 충돌합니다.
- 버전 관리되는 npm 패키지를 원하는 경우 — 이 Skill은 직접 유지보수할 소스를 제공합니다.
- 내비게이션, 폼, 인증, 결제가 필요한 프로젝트 — 이 블록은 그중 어느 것도 다루지 않습니다.
브랜드 아이덴티티·비주얼 시스템제품 런칭·앱 성장웹 디자인·디지털 경험UI 비주얼 제작홈페이지 제작랜딩페이지 제작편집 가능한 결과물세련된 비주얼초보자 친화웜 뉴트럴틸 포인트키네틱사진풍
이 Skill 소개
블록 하나만 붙여 넣으면 페이지 상단이 완성됩니다. 헤드라인, 보조 문구, 버튼, 아트워크가 이미 서로 맞물려 자리 잡고 있습니다. 레이아웃을 잡을 필요도, 회색으로 비워 둘 곳도 없습니다.
제공 내용
- Film Strip Hero의 전체 소스 — 컴포넌트 파일과 실행 가능한 사용 예제로, 바로 붙여 넣고 편집할 수 있습니다.
- 문서화된 비주얼 규약: 팔레트, 타입 스케일, 모서리 반경, 아이콘 선 굵기, 모션 타이밍을 모두 한곳에서 수정하는 토큰으로 정리했습니다.
- 인물 사진과 사진 이미지가 블록과 함께 제공되며, 외부에서 불러오지 않고 로컬에 저장된 상태로 이미 배치되어 있습니다.
사용 방법
- 섹션을 넣을 위치를 어시스턴트에게 알려 주세요. 먼저 프로젝트를 읽은 뒤, 기존 코드 작성 방식에 맞춰 블록을 작성합니다.
- 문구를 직접 쓴 내용으로 바꾸세요. 글자 크기와 간격은 알아서 유지됩니다.
- 원하는 이미지를 넣으세요. 사람이 나오는 자리에는 인물 사진을, 나머지 자리에는 일반 사진을 넣습니다.
- 배포하기 전에 휴대폰에서 확인해 보세요. 모바일에서도 무너지지 않도록 이미 만들어져 있습니다.
시작 전에 필요한 것
- 최근 테스트
- v1.0.1 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
사용자 리뷰
리뷰를 불러오는 중…