디자인 시스템은 디자인 원칙과 규격, 재사용할 수 있는 UI 패턴과 컴포넌트, 코드를 포괄하는 시스템을 말한다. 디지털 제품 개발 환경에서 이러한 디자인 시스템은 점점 더 중요해지고 있다. 그래서 2020년 2월부터 필자가 약 2년간 고군분투하며 디자인 시스템을 설계하고, 구축해온 과정에 대해 정리해 보고자 한다. 이번 1편에서는 디자인 시스템을 만들기로 결심한 배경과 디자인 시스템이 필요한 이유 등을 알아보고, 이어지는 2, 3편에서는 디자인 시스템의 목표와 원칙, 정기 미팅, 타이포그래피와 프로젝트 관리 등에 대해 살펴볼 예정이다.
처음 Coolors를 알게 된 건 2017년으로 당시 ‘색 조합, 구성에 도움을 주는 서비스 7’ 중 하나로 개인 블로그에 소개했던 기억이 납니다. 그땐 서비스의 기능이 다섯 개의 컬러를 바탕으로 나만의 색 구성을 찾는데 초점이 맞춰져 있었는데요. 모바일 웹에도 최적화된 서비스를 제공해 사용성을 높인 것이 가장 큰 매력이었습니다. 그로부터 5년이라는 시간이 흘렀고, 얼마 전 2.0 버전으로 업데이트되며 컬러와 연관된 더 많은 기능을 제공하기 시작했습니다. 오늘 소개할 ‘Coolors’에서 컬러 조합이라는 핵심 기능을 비롯해, 어떤 추가 기능을 활용할 수 있을지 살펴보고자 합니다.
데이터를 시각화하여 전달하면 우리의 뇌는 빠른 속도로 많은 양의 정보를 처리할 수 있고, 데이터 테이블에 비해 트렌드나 패턴, 아웃라이어 등을 쉽게 파악할 수 있습니다. 때문에 데이터를 쉽게 이해하고 데이터를 기반으로 한 의사결정에 도움을 줍니다. 하지만 모든 데이터 시각화가 쉽고 직관적으로 이해되지는 않습니다. 그 이유는 무엇일까요? 바로 데이터에서 발견한 정보가 시각 요소로 적절하게 디자인되지 않았기 때문입니다. 이번 글에서는 우리의 뇌가 시각 정보를 처리하는 과정을 이해하고, 직관적인 데이터 시각화를 만드는 방법에 대해 살펴보겠습니다.
저는 업무를 할 때 아직도 화이트보드를 즐겨 활용하고 있습니다. 선이 그어진 노트보다 자유도가 높고, 팀원들과 함께 의견을 나누며 실시간으로 시각화하거나, 유사한 내용끼리 그룹화하는 작업이 쉽기 때문입니다. 이런 장점으로 인해 미로, 피그잼 등 화이트보드를 콘셉트로 한 다양한 서비스가 등장했고, 실제로 많은 사람들이 사용하고 있습니다. 오늘은 피그잼과 미로에 비하면 기능은 부족할 수 있지만, 기획 또는 디자인 프로젝트를 준비할 때 가볍고 자유롭게 사용할 수 있는 캔버스 ‘Easel’ 서비스를 소개합니다.