큐레이션 · 오픈 · 무료

Channel Studio

하이엔드 프로젝트 사례 연구를 선보이는 프리미엄 브랜드 및 사용자 경험 혁신 스튜디오

01

디자인 DNA

크리에이티브 스튜디오를 위한 미니멀 건축 설계도

02

컬러

다크 배경 위의 고대비 타이포그래피를 적용한 엄격한 단색 체계

03

타이포그래피

geometric-sans

• display75px · 400
• heading18px · 400

디스플레이 텍스트의 자간을 좁혀 임팩트를 강화 · 정교하고 통일된 느낌을 위해 전체적으로 일관된 400 웨이트 유지 · 좌측 정렬 타이포그래피가 강한 수직 축을 형성

04

여백

전체 뷰포트 섹션을 만들기 위한 큰 하단 오프셋의 비대칭 패딩

05

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

보더 없음; 경계는 색상 블록과 대형 이미지로 정의

06

레이아웃

텍스트가 있는 다크 배경과 대규모 프로젝트 이미지가 번갈아 나타나는 풀블리드 섹션

07

모션과 인터랙션

텍스트 및 내비게이션 요소를 위한 부드러운 불투명도 전환 · 스크롤 시 페이지 섹션의 순차적 등장

텍스트 링크에 대한 섬세한 색상 변화 · 불투명도 변화를 통한 즉각적인 시각적 반응

08

컴포넌트

• button 배경이나 보더 없이 텍스트 링크만으로 구성되며, 경우에 따라 화살표 아이콘이 동반됨
• card 대형 제목과 지배적인 배경 이미지로 구성된 풀블리드 프로젝트 카드
• hero 텍스처가 가미된 다크 배경 위에 대형 좌측 정렬 문구가 배치된 몰입감 있는 풀뷰포트 섹션

09

보이스와 금지 목록

• 톤 권위 있고 직접적이며 세련된 어조
• 헤드라인 대형 타이포그래피를 사용한 선언적이고 임팩트 있는 문구
• CTA 시각적 노이즈보다 명확성을 우선시하는 은은하고 기능적인 텍스트 링크

• 선명한 악센트 색상을 사용하지 않음 — 스크린샷은 화이트와 그레이의 엄격한 단색 팔레트를 보여줌
• 두꺼운 보더나 카드를 사용하지 않음 — 스크린샷은 보이는 컨테이너 없이 풀블리드 섹션을 보여줌
• 작은 텍스트에 멀티컬럼 그리드를 사용하지 않음 — 스크린샷은 넉넉한 여백과 좌측 정렬 블록을 보여줌
• 장난스럽거나 둥근 타이포그래피를 사용하지 않음 — 스크린샷은 구조화된 기하학적 산세리프를 보여줌
• 혼란스러운 내비게이션 메뉴를 사용하지 않음 — 스크린샷은 간단하고 수직으로 쌓인 텍스트 목록을 보여줌
• 깊이감을 위해 드롭 그림자를 사용하지 않음 — 스크린샷은 대형 이미지와 고대비 텍스트에 의존
• 피하기: 혼란스러운 레이아웃이나 과도한 UI 요소 회피
• 피하기: 장식적인 그라데이션이나 복잡한 그림자 회피
• 피하기: 장식적인 아이콘이나 일러스트레이션 회피

10

팩 안의 실제 스크린샷

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

11

System Prompt

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