[디독] 🚣디자인 시스템 로드맵

읽는 디자인 디독

디자인 시스템 로드맵

원문 바로보기

1. 로드맵은 시스템의 방향을 나타낸다.

2. 제품 팀의 기대를 만족시키는 로드맵 시그널

3. 로드맵은 시스템이 무엇에 가치를 두는지 보여준다

4. 당신의 시스템도 로드맵을 갖고 있는가?

새로운 디자인 시스템 팀을 만날 때마다, 항상 하는 질문이 있다.

그래서, 뭘 하고 싶은 거죠?

몇몇 팀은 논리도 없고 장황하기만 해서 여기저기 흩뿌려진 업무만 갖고 모이곤 한다. 다른 팀은 집중해야 할 개별의 분야들을 명확하게 표현하고, 각각을 언제 전달할지 확실하게 계획한다. 나는 후자(제품이 발전하는 방향을 정확한 로드맵을 가지고 멤버 전체가 이해하고 있는 팀)를 시스템이 잘 운영될 징조로 본다.

1. 로드맵은 시스템의 방향을 나타낸다.

디자인 시스템 로드맵은 완벽할 필요는 없다. 내가 본 대부분의 로드맵은 2주짜리 스프린트든, 월별 PT든을 통해 지금, 다음 단계, 그리고 가까운 미래에 무슨 일이 일어나고 있는지 묘사만 해뒀을 뿐이다.

로드맵은 디자인 시스템 팀이 다른 사람에게 자신들이 하는 일을 잘 전달할 수 있게 만들어준다.

전달하고자 하는 가치에 대한 확신 - 올바르게 정의된 자금을 정당화해준다.
투명한 우선 순위 - 각기 다른 흥미를 충족시키는 제품이나 플랫폼을 만들 때 특히 중요하다.
믿을 수 있는 보이스 - 유저들이 의존할 수 있도록, 신뢰가 가는 보이스(호흡/리듬)를 유지해야 한다.

2.제품 팀의 기대를 만족시키는 로드맵 시그널

로드맵은 공개할 때마다, 완전 디테일한 부분을 제외하고 시스템의 방향을 그리는 것만으로도, 가장 중요한 요소가 무엇인지 강조해준다. 이 간단한 내용을 마일스톤 기반의 칼럼형 로드맵으로 정리하면 놀라운 효과를 볼 수 있다.

만약 시스템이 이제 막 시작됐다면, 로드맵은 비주얼 스타일(컬러/타이포그래피 등), Key UI(버튼, 폼 등), 통용되는 정보를 모아야 하는 파트들(레이아웃/그리드 시스템 등) 등 아주 기초적인 요소들에 한정되어있을 것이다.

사실, 모든 달성하고 싶은 부분들을 스티커에 써 붙인 뒤 칼럼형 로드맵으로 배열하는 것은, 초기에 팀의 목적을 한 곳으로 집중하기에 아주 좋은 방법이다.

시스템을 런칭하기 위한 로드맵 워크샵. 지금, 곧, 나중에, 후순위로 전달해야 할 것들을 칼럼 형태로 구성한다.

디자인 시스템이 순조롭게 운영되면, 로드맵은 다음과 같은 순서로 드러나는 경향이 있다.

먼저, 브랜딩 확장, 에디토리얼 가이드라인, 새로운 플랫폼(안드로이드 같은), SEO 최적화 실험 같은 새로운 섹션과 넓은 범위의 토픽.
모달 컴포넌트, 에디토리얼 단어 리스트, 새로운 직원을 트레이닝하기 위한 온보딩 시스템 등 새롭고, 중요한 파트들.
3차 버튼 배리에이션이나 반응형 레이아웃 배리에이션 등 현재 존재하는 요소들을 강화하고 확장하는 매우 중요한 파트들.

디자인 시스템을 운영하는 로드맵을 매 달 같은 호흡으로 전달한 것.

디테일은 일단 신경 쓰지 말자. 관여도가 적은 파트와 시간이 오래 걸리는 수정 파트, 급격하게 증가하는 서류 작업은 로드맵의 심플하고 집중력 있는 매력을 반감시킨다.

3.로드맵은 시스템이 무엇에 가치를 두는지 보여준다

로드맵은 시스템 팀(확장하자면, 기업까지)이 주어진 시간에 무엇에 가치를 두는지를 보여주기도 한다. 우리의 반응형 리디자인 시스템 로드맵은 몇 년에 걸쳐 항상 "coming soon"칼럼에 반응형 이미지를 배치해두는 것처럼 보였다. 매달 스프린트 미팅을 하면서, 우리는 이를 "next"에 집어넣으려고 시도했다.

하지만 거기에 투입될만한 인원이 없었고, 당연히 시스템 팀은 그들의 일이 아닌 일에 주도권을 갖고 일할 의지도 없었다. 반응형 이미지는 제품이 서로 작동하여 우리 중 한 명이 그것을 제거할 의지가 생길 때까지, 매달 제일 오른쪽 칼럼(coming soon)에 머물러 있어야 했다. 로드맵은 아주 잘 작동했다. 즉, 시스템의 우선 순위가 우리가 서비스하는 포트폴리오와 일치했다.

4.당신의 시스템도 로드맵을 갖고 있는가?

홈페이지에서 멋지게 시각화되었거나, Jira의 백로그에서 다이내믹하게 렌더된 로드맵을 보여줄 필요는 없다.(물론, 그렇게 하는 사람들도 있겠지만)

그냥 팀이 "우리가 지금 [이것을] 하고 있고, 다음으로는 [저것을] 할 것이고, [나머지는] 언젠가 할 것이다..."정도만 일관적이고 확실하게 말할 수 있도록만 하면 된다.

당신이 이 이야기를 직적접으로 전달하고, 예측 가능하고 일관성 있는 스토리를 발표하면, 팀은 자신의 일에 가치를 느끼고 당신을 의지하게 될 것이다.

저자 : Nathan Curtis
원문 링크: https://medium.com/eightshapes-llc/what-s-will-your-design-system-deliver-4b81d41be0d4
*무단 전재 및 재배포 금지(링크 공유 가능)

늘 변화하는 UX/UI 업계에서 살아가는 법, 멀티캠퍼스 UX/UI 아카데미

디자이너의 현재와 내일의 커리어를 위한 라인업!

탄탄한 UX/UI 디자인 실무 역량부터 최신 Skill & Tool, 풀스택 디자이너가 되기 위한 연계 역량까지 디자이너 분들의 커리어 UP을 위해 멀티캠퍼스가 UX/UI 전문 아카데미를 런칭해 소개드립니다.

처음부터 시작하는 UX 기획 Project

UX 디자이너가 되고 싶은, 혹은 UX디자이너가 되었지만 아직 기획이 어려운 분들을 위해 멀티캠퍼스X라이트브레인이 만났습니다.

국내 메이저 에이전시 라이트브레인의 실무 프로세스 그대로, 현직 UX디렉터와 함께 프로젝트를 진행하며 제대로 된 UX기획 역량과 포트폴리오 두 가지 모두 잡을 수 있는 과정!

최종 결과물을 한 번 더 develop할 수 있는 1대1 애프터 세션도 있으니 놓치지 마세요!

💥클래스 살펴보기💥

Figma로 하는 디자인 맛보기 Class

요즘 디자이너들 사이에서 가장 HOT한 툴, Figma

저희 디자인 혼자 하지 않잖아요. 강력한 협업 기능을 지닌 Figma를 잘 활용하면

더 효율적이고 더 완성도 높은 디자인 작업이 가능해진다는 사실!

Figma로 어떻게 디자이너, 개발자와 협업이 가능해지나구요? 도대체 뭐가 달라지냐구요?

맛보기 class로 빠르고, 가볍게 경험해보세요!

💥클래스 살펴보기💥

오늘 콘텐츠는 어떠셨나요?

유익했어요 😍 | 보통이에요 😶 | 아쉬워요 😔

같이 읽고 싶은 친구가 떠오른다면

👉구독링크 공유하기

http://bit.ly/2FNQNpv

번역이 필요한 아티클이 있다면

👉 디독에게 알려주기

[디독 도네이션 OPEN]

작은 금액이라도 디독의 서비스 유지를 위해 후원해주시면 감사하겠습니다. :)

카카오뱅크 3333 14 0517 920 (심예지)

*후원해주신 금액은 전액 서비스 운영(메일 발송 솔루션 비용)에 사용됩니다.
*후원자(입금자명) 리스트 기입을 원하지 않으시는 분은 메일로 말씀해주세요.

2월 후원해주신 분들

차홍기, 구재환, 신사환, 진명우, 혜성, 최아름, 방민지, 김규철, 최기은, 강병우, 김수현, 안소희, 정진영, 최은호,외 4분

후원해주신 분들, 정말 감사합니다! 덕분에 서비스를 유지할 수 있게 되었습니다. :)

디독
d.dok.newsletter@gmail.com
-
수신거부 Unsubscribe

좋은 뉴스레터를 만들고 전하는 일,
스티비가 함께 합니다