Invision 에서 만든 디자인 시스템에 대한 영상중 첫번째 에피소드입니다. 프론트 앤드 개발자인 Brad Frost 가 말하는 "디자인 시스템을 만들기 위한 첫걸음"이 인상적이어서 공유합니다.

Invision 에서 만든 디자인 시스템에 대한 영상중 첫번째 에피소드입니다. 프론트 앤드 개발자인 Brad Frost 가 말하는 "디자인 시스템을 만들기 위한 첫걸음"이 인상적이어서 공유합니다. Brad Frost: 디자인 시스템을 구축하기 위해 가장 처음 했던 일 중 하나는 인터페이스 인벤토리를 만드는 것이었다. 인터페이스 인벤토리란 조직의 다양한 제품에 사용되고 있는 모든 UI 패턴을 수집하는 일이다. 이것은 제품의 DNA 를 파악하고 디자인 시스템의 구성을 결정하는 데 도움이 된다. 또한 디자이너, 개발자, QA 담당자, 프로덕트 오너등 다양한 팀의 구성원들이 한곳에 모여서 함께 문제를 인식함으로서 일관된 시스템을 만들자는 공동의 목표가 생기게 된다. 인터페이스 인벤토리를 만드는 방법 1. 각자 한가지 UI 패턴을 맡아 모든 제품에서 사용된 예를 스크린샷 해온다. - 예) 버튼 담당, 헤더 담당, 타이포그래피 담당, 비디오 플레이어 담당 등 2. 자신이 찾아온 패턴의 특징을 공유한다. - 예) "이 프로덕트에서 쓰인 소셜버튼은 다른 프로덕트에 쓰인 소셜 버튼과는 많이 달라 보입니다." 3. 이렇게 공유 하는 동안 팀 별 일관되지 않게 사용되었던 언어를 찾을 수도 있다. 그리고 대화를 통해 언어의 기준을 세울 수 있다 - 예) 헤더바를 한팀에서는 "어드민 바" , 다른 팀에서는 "회색 바", 또 다른 팀에서는 "유틸리티 바" 라고 부를 수 있다. 4. 대화가 끝나면 찾아온 모든 UI 패턴을 하나의 문서로 통합한다. 그리고 조직 전체가 공유를 한다.