07 · 시스템 소개
디자인 원칙Design Principles
주님의교회 PCL 디자인 시스템이 판단을 내리는 6가지 기준. 새 컴포넌트를 설계할 때 · 기존 컴포넌트를 변경할 때 · 패턴을 새로 정의할 때 — 이 원칙을 기준으로 토론합니다.
6가지 원칙
- 01
에디토리얼 밀도
정보는 잡지처럼 위계가 있어야 합니다. 한 화면에 같은 굵기의 텍스트만 쌓지 않습니다. 제목 · 리드 · 본문 · 캡션의 네 층을 유지합니다.
밀도가 낮으면 스크롤이 길어지고, 밀도가 높으면 눈길이 길을 잃습니다. 적정 밀도는 시선의 리듬에서 나옵니다.
- 02
접근성 기본값
AA 수준의 대비와 키보드 내비게이션은 기본 컴포넌트에 내장합니다. 개발자가 옵션을 켜야 동작하는 접근성은 곧 꺼지는 접근성입니다.
접근성은 후보정이 아니라 구조 선택입니다. 기본값이 옳으면 대부분의 화면이 자동으로 안전해집니다.
- 03
타이포 우선
화려한 그래픽보다 정돈된 글자를 먼저 봅니다. Pretendard · Instrument Serif · JetBrains Mono 세 패밀리로 한글 · 숫자 · 영문의 리듬을 만듭니다.
UI는 결국 글자의 배치입니다. 타이포가 흔들리면 어떤 색 보정으로도 회복되지 않습니다.
- 04
절제된 색
강조색은 한 번에 하나. 페이지 안에 다섯 개의 빨강이 있다면 어느 것도 강조가 아닙니다. 무채색 70% · 브랜드 20% · 시맨틱 10% 비율을 기본으로 합니다.
색을 아껴 쓸수록 클릭해야 할 지점이 분명해집니다. 색은 장식이 아니라 길잡이입니다.
- 05
여백은 구조
간격은 감각이 아니라 체계입니다. 4 · 8 · 12 · 16 · 24 · 32 · 48 · 64 px 스케일 안에서만 고릅니다. 변칙은 반드시 토큰으로 남깁니다.
여백이 규칙을 따르면 서로 다른 사람이 만든 화면도 한 사이트처럼 보입니다.
- 06
복잡함은 레이어로
한 컴포넌트에 옵션을 10개 쌓기보다, 단순한 컴포넌트를 조립합니다. Modal 안에 Form을, Form 안에 Field를 — 구성 요소의 수직 조립을 우선합니다.
플래그가 많아지면 컴포넌트는 곧 블랙박스가 됩니다. 조립은 읽기 쉽고 수정 범위도 좁습니다.
원칙이 충돌할 때
두 원칙이 부딪히면 접근성 기본값이 가장 우선입니다. 그 다음은 에디토리얼 밀도, 그리고 타이포 우선. 나머지 셋은 상황에 따라 조정할 수 있습니다. 이 순서는 “사용자가 읽고 쓸 수 있어야 한다”는 명제에서 나옵니다.
원칙을 깨야 할 이유가 있다면, 그 이유를 변경 사유에 남깁니다. 원칙은 금기가 아니라 기본 선택지입니다.
교회 운영규정 — 디자인의 근거
위 디자인 원칙은 단순한 미감이 아니라, 주님의교회 홈페이지 운영규정에 명문화된 가치기준에서 비롯됩니다. 디자인 판단이 흔들릴 때 최종 기준은 이 규정입니다.
제3조 (가치기준)— ‘주님이 주인 되시는 교회’라는 기본 정신 아래, 선교와 구제를 창립정신의 근간으로 하고, 청소년 사역에 노력하며, 원칙적으로 예배당을 소유하지 않고, 임기제를 시행하며, 무기명 헌금 및 예산의 50% 이상을 대외 경비로 사용한다고 정관에 밝힌 교회 운영의 기본 정신을 서로 나누고 실천하는 온라인 공간이 되도록 하는 데 둔다.
제4조 (기본 정신)
제3조의 가치기준을 구조적·시각적·실천적 원칙으로 치환하며, 다음 정신이 홈페이지의 구조·디자인·카피·게시물에 지속적으로 반영되도록 한다.
- ①‘주님이 주인 되시는 교회’로서 특정한 사람의 업적이나 성과가 강조되지 않도록 한다.
- ②수신자 관점에서 설계하며, 사회적 약자와 소수를 배려하고, 청소년·노인·장애인·다문화가정이 쉽게 접근하고 사용하도록 한다.
- ③과도한 홍보와 성과의 과시를 하지 않으며, 화려한 꾸밈과 장식을 억제한다.
- ④섬김과 내핍의 정신을 반영하며, 간결하고 품위 있는 표현 방식을 사용한다.
- ⑤창립 정신을 실천하는 공간으로 삼으며, 외부인뿐 아니라 기존 교인들도 홈페이지 자체에서 교회의 기본 정신을 지속적으로 느끼고 실천할 수 있도록 한다.