← OpenDesign
큐레이션 · 오픈 · 무료
Vectary
인터랙티브 3D 및 AR 프레젠테이션을 만들고 공유하는 브라우저 기반 플랫폼.
design 3d
01
디자인 DNA
3D design presentation AR interactive
디지털 제품 시각화를 위한 깔끔하고 전문적인 디자인 스튜디오
02
컬러
#FBD302Accent
#252525Ink
#595959Ink soft
#FFFFFFBG
#FCFCFCBG soft
#F3F3F3BG quiet
#949494Muted
rgba(148, 148, 148, 0.12)Line
명확성을 위한 깨끗한 여백과 짙은 잉크색을 사용하며, 프로모션 강조를 위해 단일한 고가시성 노란색을 활용합니다.
03
타이포그래피
humanist-sans
display 56px · 500headline 36px · 500body 18px · 400small 14px · 400
04
여백
4px
8px
16px
24px
32px
48px
64px
96px
일관된 4px 기반에 숨 쉴 공간을 위한 넉넉한 padding
05
표면 (라운드 / 그림자 / 경계선)
sm · 4px
md · 8px
lg · 16px
pill · 999px
메인 버튼: 1px solid #252525, 보조 요소: 1px solid #E0E0E0
0px 0px 20px 11px rgba(148, 148, 148, 0.12)
06
레이아웃
1280 container
12 columns
24px gutter
768 / 1024 breakpoints
넓은 마진을 가진 중앙 정렬 단일 열 hero 레이아웃
07
모션과 인터랙션
220ms micro
400ms small
800ms medium
cubic-bezier(0.25, 0.1, 0.25, 1.0) easing
버튼의 hover 전환 (0.2s) · 뷰포트 내 인터랙티브 3D 모델 조작
은은한 배경색 변화 또는 투명도 변경 · 약간의 스케일 또는 색상 변화를 동반한 표준 active 상태
08
컴포넌트
button 단색 배경 또는 테두리를 가진 알약형 및 직사각형 형태 card 미디어 컨테이너를 위한 은은한 둥근 모서리와 부드러운 그림자 input 미니멀한 둥근 필드 (SaaS 패턴에서 추론) hero 하단에 미디어를 배치한 전체 너비 중앙 정렬 텍스트 블록
09
보이스와 금지 목록
톤 전문적이고 혁신적이며 empowering한 어조 헤드라인 행동을 유도하고 혜택에 초점을 맞춘 스타일 CTA 직접적이고 격려하는 스타일 (예: '계정 만들기', '대화하기') 화려한 세리프 서체를 사용하지 마세요 — 스크린샷은 깔끔한 humanist-sans-serif 타이포그래피를 보여줍니다 다색 그라데이션 배경을 사용하지 마세요 — 스크린샷은 단색 흰색 (#FFFFFF) 배경을 보여줍니다 얇고 대비가 낮은 텍스트를 사용하지 마세요 — 스크린샷은 밝은 배경 위의 짙은 잉크색 (#252525)을 보여줍니다 컨테이너에 날카롭고 불규칙한 모서리를 사용하지 마세요 — 스크린샷은 부드러운 둥근 테두리 (16px radius)를 보여줍니다 밀집되고 복잡한 레이아웃을 사용하지 마세요 — 스크린샷은 넉넉한 여백과 중앙 정렬을 보여줍니다 장난스럽고 만화 스타일의 일러스트레이션을 사용하지 마세요 — 스크린샷은 고품질 3D 제품 렌더링을 보여줍니다 피하기: 전문 용어 피하기: 공격적인 판매 언어 피하기: 지나치게 장난스럽거나 비공식적인 어조
10
팩 안의 실제 스크린샷
桌面首屏(hero) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 移动首屏 실제 페이지에서 캡처 · 실 computed styles
11
System Prompt
Vectary는 인터랙티브 3D 및 AR 디자인 프레젠테이션을 위한 SaaS 플랫폼입니다. 디자인은 깨끗한 흰색 (#FFFFFF) 배경에 짙은 잉크색 (#252525)과 부드러운 회색 (#949494)을 보조 텍스트로 사용합니다. 타이포그래피는 humanist-sans (Inter/Fira Sans)에 자간을 타이트하게 적용합니다. 프로모션 배너에는 고가시성 노란색 (#FBD302)을 사용합니다. 중요한 주의사항: 무거운 그림자, 복잡한 그라데이션, 화려한 타이포그래피는 피해야 합니다. 레이아웃은 중앙 정렬되고 넉넉하며, 3D 비주얼 콘텐츠를 우선시합니다.
더 보기
en · zh-CN · zh-TW · ja · ko
OpenDesign · curated web aesthetics for AI-readable design DNA · opendesign.cc
왜 수록: 전문적인 절제감과 3D 비주얼을 통한 혁신적인 제품 전시를 균형 있게 조화시킨 현대적인 SaaS hero 섹션의 완벽한 예시입니다.