큐레이션 · 오픈 · 무료

Descript

선도적인 AI 비디오 편집 플랫폼을 위한 깨끗하고 따뜻하며 기능적인 디자인입니다.

aivideo

Descript 스크린샷

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

원본 사이트: https://www.descript.com

📦 팩 내용 보기 →

01

디자인 DNA

AI 비디오 편집기협업직관적전문적

강력하면서도 접근 가능한 현대 스튜디오.

02

컬러

#1A1A1AInk

#F1EAEDBG

#D1C7CBMuted

rgba(229,231,235,1.0)Line

가독성을 위해 고대비의 어두운 잉크가 적용된 따뜻한 오프 화이트 캔버스를 기본으로 하며, 히어로 섹션에서 강조를 위해 딥 버건디를 사용합니다.

03

타이포그래피

transitional-serif · humanist-sans · monospace

display56px · 400
body18px · 400

04

여백

4px

8px

16px

24px

32px

48px

64px

96px

표준 4px 베이스에 padding과 간격을 위한 명확한 8px/16px/24px 단계적 증가.

05

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

sm · 4px

md · 8px

lg · 12px

pill · 999px

1px solid #E5E7EB

rgba(0,0,0,0.16) 0px 2px 4px 0px

06

레이아웃

1280container

12columns

24pxgutter

768 / 1024breakpoints

핵심 메시지를 위한 중앙 정렬 레이아웃을 가진 전체 너비 히어로 섹션, 그 다음 기능 카드를 위한 다중 열 그리드.

07

모션과 인터랙션

100msmicro

200mssmall

300msmedium

cubic-bezier(0.4, 0, 0.2, 1)easing

hover 및 focus 시 페이드인 전환 · 부드러운 background-color 변화

인터랙티브 요소에서 미세한 배경색 변화 또는 불투명도 변화. · 지연된 애니메이션 없이 즉각적인 시각적 피드백.

08

컴포넌트

button 4px radius와 16px 수직 padding을 가진 깔끔한 사각형 버튼.
card 12px radius의 카드, 큰 배경 이미지와 오버레이 텍스트 적용.
chip 카테고리를 위한 간단한 텍스트 기반 레이블.
input 미세한 테두리가 있는 표준 폼 입력 필드.
hero 딥 버건디 배경과 볼드한 세리프 타이포그래피를 가진 크고 중앙 정렬된 히어로 섹션.

09

보이스와 금지 목록

톤 전문적이고 명확하며, 사용자에게 힘을 실어주는 어조.
헤드라인 권위와 명확성을 전달하는 볼드하고 큰 세리프 글꼴.
CTA 직관적이고 행동 지향적 (예: '무료로 시작하기').

다크 모드 인터페이스를 사용하지 마세요 — 스크린샷은 밝고 따뜻한 오프 화이트 배경을 기본 캔버스로 보여줍니다.
헤드라인에 지나치게 기하학적인 산세리프를 사용하지 마세요 — 스크린샷은 디스플레이 텍스트에 고전적인 트랜지셔널 세리프를 보여줍니다.
네온 또는 일렉트릭 블루를 주요 강조색으로 사용하지 마세요 — 스크린샷은 강조를 위해 딥 버건디와 부드러운 코랄 레드를 사용합니다.
기본 버튼에 과도하게 둥글거나 '알약' 모양을 사용하지 마세요 — 스크린샷은 4px border-radius의 버튼을 보여줍니다.
과도한 드롭 섀도우나 3D 효과를 사용하지 마세요 — 스크린샷은 높이감을 위해 미세한 단일 box-shadow만 사용한 평면적이고 깔끔한 표면을 보여줍니다.
혼잡한 다중 사이드바 네비게이션을 사용하지 마세요 — 스크린샷은 충분한 여백을 가진 깔끔한 수평 상단 네비게이션 바를 보여줍니다.
피하기: 지나치게 기술적인 전문 용어
피하기: 지저분한 레이아웃
피하기: 공격적인 네온 색상
피하기: 둥글고 벌룬 같은 UI 요소
피하기: 과도한 장식적 애니메이션
피하기: 다크 모드를 기본 테마로 사용

10

팩 안의 실제 스크린샷

Descript — 桌面首屏（hero） — 桌面首屏（hero）

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

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

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

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

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

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

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

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

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

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

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

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

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

Descript — 移动首屏 — 移动首屏

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

11

System Prompt

Descript의 디자인은 따뜻함과 권위를 균형 있게 맞춘 깨끗하고 전문적인 SaaS 미학입니다. 가독성을 위해 밝은 오프 화이트 배경(#F1EAED)과 고대비의 어두운 잉크(#1A1A1A)를 사용합니다. 타이포그래피는 볼드한 헤드라인용 고전적인 트랜지셔널 세리프와 본문용 휴머니스트 산세리프를 특징으로 하여, 세련되면서도 접근 가능한 느낌을 줍니다. 핵심 디자인 요소로는 4px 기반의 간격 스케일, 미세한 1px 테두리(#E5E7EB), 그리고 히어로 섹션을 위한 절제된 딥 버건디 색상 사용이 포함됩니다. 중요한 디자인 규칙은 다음과 같습니다: 1) 기본 모드로 다크 모드를 사용하지 않습니다; 2) 지나치게 둥글거나 벌룬 같은 UI 컴포넌트를 사용하지 않습니다; 3) 절대로 네온 또는 고채도의 강조색을 사용하지 않습니다; 4) 넉넉한 여백과 구조화된 12열 그리드 레이아웃을 유지합니다.

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

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

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

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