무료GitHub에 공개한국어 소개

after-hours-editorial-template

어두운 배경과 세리프 글꼴로 패션 잡지 같은 세 페이지 동적 연출을 만듭니다. 글자 단계 표시와 장면 전환을 포함한 단일 HTML 파일로 출력합니다.

원문원문 설명 보기

Luxury dark-editorial HyperFrames template for three-page cinematic storyboards, inspired by haute couture title cards and magazine chapter spreads. Use when the user asks for premium fashion-style motion pages, moody serif-led storytelling, or a high-end dark presentation aesthetic with rich transitions.

nexu-io/open-design

AI 평가80점/ 100 설치 방법 보기

이럴 때 유용합니다

패션 잡지 분위기의 움직이는 소개 제작
짧은 이야기를 세 페이지로 표현
기존 브랜드 표현을 어두운 지면에 적용

한국어 소개

할 수 있는 일

after-hours-editorial-template은 어두운 배경과 세리프 글꼴을 중심으로 패션 잡지의 장 첫머리 지면을 연상시키는 세 페이지의 짧은 연출을 만듭니다. 글자가 차례로 나타나는 표시, 화면을 쓸어 넘기는 장 전환, 필름 입자, 화면 가장자리의 음영을 결합합니다. CSS와 JavaScript를 내장한 단일 HTML 파일로 출력합니다.

이럴 때 유용합니다

패션을 주제로 한 짧은 프레젠테이션이나 분위기를 중시하는 이야기 소개에 적합합니다. 기존 DESIGN.md의 색상, 글자의 인상, 배치 리듬을 반영하면서 어두운 잡지 지면 같은 표현을 유지할 때도 사용할 수 있습니다.

사용 예시

“어두운 배경과 마젠타 강조색으로 세 페이지의 잡지 기사풍 시퀀스를 만들어 주세요. 글자는 단계적으로 표시하고 각 페이지는 삼 초 이내로 해 주세요.”
“기존 DESIGN.md를 반영해 장 전환과 필름 입자 효과가 있는 짧은 소개를 만들어 주세요.”

주의 사항

데스크톱용 HyperFrames 템플릿이며 파일 쓰기 권한이 필요합니다. 디자인 시스템을 참고하는 것을 전제로 하며, 기본 구성은 세 페이지입니다. 각 페이지의 표시 시간은 삼 초 이내입니다.

이 소개문은 공개된 SKILL.md를 바탕으로 AI(OpenAI Codex)가 작성했습니다. 정확한 사양은 아래 원문을 확인하세요.

객관 평가

AI가 SKILL.md의 내용만을 근거로 4가지 관점에서 판정했습니다. 스타 수나 인기도는 판정에 넣지 않았습니다.

지시의 명확성언제 쓰고 무엇을 하는지 알 수 있는가: A양호어두운 잡지풍의 세 페이지 연출과 단일 HTML 출력이 명시되어 있습니다.
절차의 구체성절차·입출력·예시가 구체적으로 적혀 있는가: A양호DESIGN.md 참조, 템플릿 복사, 표시 시간, 점검표 검증 절차가 구체적입니다.
안전성전송·삭제·명령 실행 등을 명시하고 있는가: B일부 부족index.html 쓰기를 지시하지만 기존 파일을 덮어쓰기 전 확인 절차는 기재되어 있지 않습니다.
도입의 용이성필요한 도구나 API 키가 적고 적혀 있는가: B일부 부족데스크톱, 쓰기 권한, DESIGN.md 요구는 명시하지만 환경 준비 절차는 없습니다.

총점은 각 항목을 A=25점, B=15점, C=5점으로 더한 값입니다. 2026년 10월 20일 기준으로 AI(OpenAI Codex)가 판정했습니다. 참고용이므로 설치 전에 원문도 확인해 주세요.

평가가 다르다고 생각되면 재검토를 요청하기

포함된 파일(4)

SKILL.md2.4 KB
assets/template.html11.9 KB
example.html432 B
references/checklist.md1.1 KB

SKILL.md(원문)

설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.

After Hours Editorial Template

Produce a self-contained HTML editorial motion artifact in a dark luxury style, with three short pages, cinematic typography, and premium transition language.

Resource map

after-hours-editorial-template/
├── SKILL.md
├── assets/
│   └── template.html
├── references/
│   └── checklist.md
└── example.html

Workflow

Read active DESIGN.md and map colors, typography tone, and layout rhythm into CSS variables while preserving a dark editorial baseline.
Copy assets/template.html to index.html.
Keep three narrative pages in sequence; do not increase default page dwell above 3 seconds.
Preserve premium motion behavior:
- staged text reveal hierarchy
- chapter wipe transitions
- ambient grain/vignette depth
- restrained cursor-light interaction for local preview
Keep output single-file HTML with inline CSS and JS.
Avoid sandbox-hostile browser APIs (e.g. localStorage and confirm).
Validate with references/checklist.md before emitting.

Output contract

One short orientation sentence, then:

<artifact identifier="after-hours-editorial" type="text/html" title="After Hours Editorial Template">
<!doctype html>
<html>...</html>
</artifact>

리뷰

아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.

로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.

아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.

같은 저장소의 스킬