깊은 블루에서 퍼플로의 gradient는 몰입감 있는 어두운 분위기를 조성하며, 인터랙티브 요소를 위해 밝은 네온 강조색으로 점을 찍습니다.
04
여백
4px
8px
16px
24px
32px
48px
64px
96px
공간적
05
표면 (라운드 / 그림자 / 경계선)
sm · 4px
md · 8px
lg · 12px
pill · 999px
최소화
06
레이아웃
1280container
12columns
24pxgutter
768 / 1024breakpoints
몰입형
07
모션과 인터랙션
220msmicro
400mssmall
800msmedium
cubic-bezier(0.25, 0.46, 0.45, 0.94)easing
physics-simulation · camera-follow
object-proximity · physics-collision
08
컴포넌트
buttoninteractive-object
card3d-entity
herofull-viewport-webgl
09
보이스와 금지 목록
톤플레이풀
헤드라인미니멀
CTA인터랙티브
정적 페이지 레이아웃을 사용하지 마세요 — 스크린샷은 몰입형 3D 환경을 보여줍니다.
전통적 메뉴에 의존하지 마세요 — 탐색은 자동차를 운전하여 이루어집니다.
밝고 다색 배경을 사용하지 마세요 — 스크린샷은 어두운 블루/퍼플 gradient를 보여줍니다.
UI에 표준 타이포그래피를 사용하지 마세요 — 텍스트는 3D 객체에 통합되어 있습니다.
정적 히어로 섹션을 사용하지 마세요 — 전체 뷰포트가 동적인 3D 캔버스입니다.
흰색 배경을 사용하지 마세요 — 디자인은 다크 모드 미학에 깊이 뿌리를 두고 있습니다.
피하기: 정적-레이아웃
피하기: 전통적-탐색
피하기: 글의-벽
11
System Prompt
이것은 창의적 개발자를 위한 실험적, 인터랙티브 3D 포트폴리오입니다. 이 사이트는 사용자가 작은 장난감 자동차를 운전하여 탐색하는 완전히 몰입된 WebGL 환경입니다. 주요 시각적 요소로는 깊은 블루에서 퍼플로의 gradient 배경, 빛나는 블루 점 그리드, 그리고 인터랙티브 3D 객체들이 있습니다. 타이포그래피는 3D 세계에 통합되어 있으며, 전체 경험은 물리와 상호작용을 중심으로 구축되었습니다. 핵심 금지 사항: 정적 페이지 레이아웃을 사용하지 마세요, 전통적 메뉴에 의존하지 마세요, 밝은 배경을 사용하지 마세요.
이 감각을 당신의 에이전트에
이 디자인의 기계 판독 가능한 사양——색상·타이포·모션까지——을 그대로 AI 에이전트에 전달하세요.
