1. 디자인 시스템이란?
•
팀이 제품을 디자인하고, 실현화하고, 개발할 수 있는 모든 요소들을 그룹화하는 단일한 기준을 제공한다.
•
디자인은 '상품'이 아니라 상품'들'에 가깝다. 디자인 시스템은 제품, 툴 그리고 새로운 기술과 함께 지속적으로 발전한다.
•
시스템은 보이는 요소와 보이지 않는 요소로 구성되어 있다.
◦
툴, 패턴, 컴포넌트, 가이드라인...
◦
브랜드 밸류, 일하는 방식, 마인드셋, 신념 등 달성하기 가장 어려운 추상적인 요소들
2. 스타일 가이드 or 패턴 라이브러리 : 뭐가 다를까?
•
스타일 가이드 : 그래픽 스타일(컬러, 폰트, 일러스트레이션...)과 그 용례에 관한 것
•
패턴 라이브러리 : 기능적인 컴포넌트와 그들의 용례를 통합한 것
•
Shopify의 경우, 스타일 가이드를 "비주얼"로, 패턴 라이브러리를 "컴포넌트"라고 부른다.
3. 왜 핫해졌는가?
•
오랫동안 디지털은 사이드 프로젝트 취급 받아왔다.
•
함께 진화해야 하는, 공통된 언어를 사용하여 디지털과 인쇄물 사이의 갭을 줄여나가야 한다.
•
디자인 시스템을 그래픽 가이드라인에서 유래한 것이나, 팀의 워크 플로우에 좀 더 최적화되어 있다.
4. 디자인 시스템에는 어떤 것들이 있나?
1) 목적과 공유된 가치
•
팀과 동일한 목표를 명확하게 설정하고 모두의 생각을 나란히 하는 것은 매우 중요하다.
•
브랜드 목표에 따라 우리의 선택을 가이드해 줄 좋은 이상향이라고 할 수 있다.
2) 디자인 원리
•
디자인 원칙은 팀이 제품에 적합한 디자인을 할 수 있도록 도와주는 가이드 문장이다.
•
미디움의 디자인 원칙 중 하나는 "선택보다 방향"이다. 그 원칙 덕에 수많은 컬러와 폰트로 본문을 디자인하는 대신에 더 간단한 걸 선택할 수 있었다. 덕분에 비주얼보다 내용에 집중할 수 있게 만들어줬다.
•
디자인 원칙은 반드시 디자인 의사 결정에 도움이 되야 한다.
3) 브랜드 아이덴티티&랭귀지
•
아이덴티티는 반드시 전략, 브랜드의 목적과 일치해야 한다.
•
브랜드의 기초를 형성하는 것들
◦
컬러 / 폰트 / 공간 / 모양 / 아이콘 / 일러스트레이션 / 사진 / 애니메이션 / 보이스앤톤 / 사운드
•
디자인 팀이 "적절한 조합"으로 언어를 사용할 수 있게 만들고, 브랜드는 매우 유니크하고 쉽게 알아볼 수 있게 된다.
4) 컴포넌트&패턴
•
컴포넌트 : 레고 블럭과 같다. 디자이너는 스케치로, 개발자는 코드로 사용할 수 있다. 그들의 기능적 역할은 반드시 명시되어야 한다.
•
패턴 : 우리가 제품의 모든 영역에서 컴포넌트를 일관적이고 논리적으로 사용할 수 있도록 도와준다.
5. 어떤 종류가 있나?
•
우리 것을 정의하기 위해서는 올바른 질문들을 스스로 던져보아야 한다.
◦
이 시스템을 몇 명이 사용할 것인가?
◦
그들의 프로필은 어떠하며, 해당 주제에 대해 얼마나 이해도가 높은가?
◦
우리가 정리해야 할 제품의 개수는 몇 개인가? 몇 개의 플랫폼에서? 몇 개의 기술들을 사용하는지?
◦
제품에서 어느 정도의 일관성을 구현해내고 싶은가?
엄격 vs 느슨
•
엄격한 시스템
◦
종합적이고 디테일한 서류를 갖고 있고, 디자인과 개발을 완벽하게 동기화해줄 것이다. 시스템 내에서 새로운 패턴을 소개할 때에는 엄격한 프로세스가 적용될 것이다. 엄격한 시스템은 팀이 마주칠 수 있는 주요 케이스들을 모두 다루어야 하기 때문에 매우 범위가 넓을 것이다.
•
느슨한 시스템
◦
실험을 위한 여유를 조금 남겨둔다. 팀에게 일부 자유를 유지하는 선에서 프레임워크를 제공한다. 시스템을 사용하든 하지 않든 상관 없고, 그들의 제품의 필요에 의할 때만 사용하면 된다.
모듈화 vs 통합
•
모듈러 시스템
◦
교체 가능하고 재사용 가능한 파트들로 구성되어 있다.
◦
빠르게 스케일업해야 하는 프로젝트와 다수의 유저들의 니즈를 충족해야 하는 프로젝트에 어울린다.
◦
단점은 구현하기 어렵다는 것이다. (독립적으로 사용 가능한 동시에 함께 사용되기도 하는 모듈을 만들기 어렵기 때문)
◦
e-커머스, 금융, 정부 웹사이트와 같은 큰 규모의 프로젝트에 잘 어울린다.
•
통합 시스템
◦
하나의 유니크한 맥락에 초점을 맞춘다.
◦
모듈러 시스템처럼 파트들로 구성되어 있긴 하지만 교체가 불가능하다.
◦
각 요소들이 반복되는 비율이 매우 낮거나 아트 디렉션이 강하게 들어가고, 자주 바뀌는 프로젝트에 걸맞다. (포트폴리오, 쇼케이스, 마케팅 캠페인 등)
중앙 집중화 vs 분업화
•
중앙 집중화 모델
◦
한 팀이 시스템을 책임지고 발전시킨다.
◦
이 팀은 다른 팀이 효율적으로 일하도록 돕고, 시스템이 그들의 모든 니즈를 반영하고 있는지 확인하기 위해 그들과 매우 밀접하게 일해야 한다.
•
분업화 모델
◦
몇몇 팀의 구성원이 시스템을 책임진다.
◦
모든 사람이 참여하고 있는 것처럼 느껴지기 때문에 시스템 결정은 빠르게 이루어지나, 각 팀 리더들이 전체적인 비전을 유지할 수 있어야 한다.
6. 사례
7. 끝내며
•
디자인 시스템은 완전한 제품이며, 우리의 제품을 만드는 프로젝트에 투입되는 사람들을 도울 것이다.
•
모든 좋은 제품들이 그러하듯, 일이 밀리기도 할 것이고, 반복적인 일을 수행해야 하고, 유저들(디자인, 개발자, 프로젝트 오너)을 최전방에서 관리해야 한다.
디자인 시스템의 성공을 어떻게 측정할 수 있을까?
