디자인 참고하기

크립토퀀트 라이브팀에서는 디자인 시스템을 사용하여 디자이너와 개발자가 협업하고 있습니다.

잘 합의된 디자인 시스템은 커뮤니케이션 비용을 엄청나게 낮출 수 있고 일관성 있는 사용자 경험을 제공할 수 있기 때문에 꼭 해야 하는 일이었지만 입사하자마자 리브랜딩과 프로덕트 전체 개편을 맡아서 극 초기부터 시스템을 만든다는 게 부담이었어요.

하지만 프로덕트 디자인을 혼자 맡고 있어서 무조건 수정이 쉽게, 효율적인 개발자와의 협업을 위해 할 수 있는 것부터 차근차근 해야겠다고 생각했어요.

그래서 우선 컬러부터 구축하기로 했습니다.

디자인이 어느 정도 진행되고 나서 시스템을 구축해도 시행착오가 많았을 텐데 극초기부터 하다 보니 삽질도 많이 했고 계속해서 새로운 기능을 만들고 테스트하기 때문에 정말 많은 부분이 정말 자주 변경되었어요. 이러한 과정들을 거치면서 효과를 보고 있는 지금까지의 이야기를 공유드립니다.

저희 컬러 시스템은 기본 컬러인 Basic 컬러와 UI에 적용되는 Semantic 컬러가 있습니다.

Basic 컬러는 기본 컬러 팔레트의 기능을 하며 톤 혹은 기능과 서비스에 따라 정의하고 Basic 컬러를 토대로 사용하는 목적과 UI에 따라 Semantic 컬러를 구축합니다.