큐레이션 · 오픈 · 무료

Notreal Tv

글로벌 브랜드를 위해 공예, 스토리텔링, 기술을 결합하는 독립 크리에이티브 하우스.

AgencyPortfolioTypographyEditorialClean

↓ 디자인 시스템 다운로드 (32 MB)OpenDesign 에서 열기

원본 사이트: https://notreal.tv

📦 팩 내용 보기 →

디자인 DNA

creativeindependentdesign-drivencraftstorytellingtechnology

하이엔드 크리에이티브 스튜디오의 큐레이션된 갤러리.

컬러

#292a2cInk

#f2f2f2BG

rgba(0,0,0,1)Line

포트폴리오 이미지가 색상을 제공하는 미니멀하고 고대비의 캔버스입니다.

타이포그래피

transitional-serif · geometric-sans

display80px · 400
h225px · 400
body18px · 400

메인 로고와 예술적 강조에는 전환형 세리프를 사용합니다. · 모든 내비게이션, 설명, 본문 텍스트에는 기하학적 산세리프를 사용합니다.

여백

4px

8px

16px

24px

32px

48px

64px

96px

공간감 넘치고 여유로우며, 포트폴리오 항목 사이에 넓은 마진과 텍스트 블록 주변에 충분한 패딩을 둡니다.

표면 (라운드 / 그림자 / 경계선)

sm · 0px

md · 0px

lg · 0px

pill · 999px

미니멀하며, 미세한 구조적 구분을 위해 가끔 2px solid black을 사용합니다.

0px 0px 5px 0px rgb(128, 128, 128)

레이아웃

1280container

12columns

24pxgutter

768 / 1024breakpoints

비대칭적이며 그리드 기반의 레이아웃으로, 크고 눈에 띄는 미디어 블록과 간결하게 왼쪽 정렬된 텍스트 캡션을 특징으로 합니다.

모션과 인터랙션

200msmicro

300mssmall

800msmedium

cubic-bezier(0.25, 0.1, 0.25, 1)easing

내비게이션과 인터랙티브 요소에 대한 미세한 전환 효과. · 포트폴리오 항목에 대한 hover 효과.

텍스트 링크와 포트폴리오 카드에 대한 시각적 변화나 밑줄 표시. · 프로젝트 상세 페이지로 직접 이동.

컴포넌트

button 내비게이션용 간단한 텍스트 링크입니다.
card 전체 너비 또는 절반 너비의 미디어 블록으로, 캡션이 바로 아래에 위치합니다.
hero 왼쪽에 거대한 세리프 로고, 오른쪽에 설명 텍스트, 그리고 아래에 대형 특집 포트폴리오 이미지가 위치합니다.

보이스와 금지 목록

톤 전문적이고, 세련되었으며, 예술적입니다.
헤드라인 간결하고 묘사적이며, 강조를 위해 자주 이탤릭체로 표시됩니다.
CTA 내비게이션에 위치한 미니멀한 텍스트 기반 링크입니다.

둥근 모서리를 사용하지 않습니다 — 스크린샷은 날카롭고 사각형 모서리를 보여줍니다.
밝고 채도 높은 UI 색상을 사용하지 않습니다 — 스크린샷은 중립적인 오프화이트 배경을 보여줍니다.
메인 로고에 산세리프를 사용하지 않습니다 — 스크린샷은 전환형 세리프를 보여줍니다.
레이아웃을 복잡하게 만들지 않습니다 — 스크린샷은 충분한 여백을 가진 매우 깔끔하고 여유로운 그리드를 보여줍니다.
주요 요소에 드롭 섀도우를 사용하지 않습니다 — 스크린샷은 플랫 이미지를 보여주며, 특정 요소에만 미세하고 절제된 그림자가 적용되어 있습니다.
본문 텍스트에 전부 대문자를 사용하지 않습니다 — 스크린샷은 문장 대소문자나 제목 대소문자를 보여줍니다.
피하기: 지나치게 캐주얼하거나 은어를 사용하는 표현.
피하기: 감탄사의 과도한 사용.
피하기: 모호하거나 일반적인 설명.

팩 안의 실제 스크린샷

Notreal Tv — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

실제 페이지에서 캡처 · 실 computed styles

System Prompt

This is the design DNA for NotReal, an independent creative house. The site features a clean, editorial layout on an off-white (#f2f2f2) background with deep charcoal (#292a2c) text. Typography contrasts a refined transitional serif for the logo and accents with a clean geometric sans-serif for navigation and descriptions. The layout is grid-based but asymmetrical, giving significant visual weight to large, high-quality portfolio images. Critical design constraints: Do not use rounded corners or bright UI colors; the aesthetic is sharp, flat, and professional. Do not clutter the interface; ample whitespace is a core feature. Do not use sans-serif for the main 'NotReal' brand mark; it must remain a serif.

이 감각을 당신의 에이전트에

이 디자인의 기계 판독 가능한 사양——색상·타이포·모션까지——을 그대로 AI 에이전트에 전달하세요.

OpenDesign 스킬 ↗ · 이 팩 (에이전트용) ↗

en · zh-CN · zh-TW · ja · ko