COMPASS UPDATE: 웹과 앱의 화면 구성을 위한 블록 업데이트

컴퍼스 디자인 시스템의 팀원 관리, 체크리스트, 프로젝트 활동 블록 예시

컴퍼스가 웹사이트와 앱 제작에 활용할 수 있는 블록을 업데이트했습니다. 블록은 특정 기능에 필요한 요소를 하나로 묶은 화면 구성 단위입니다. 웹과 앱에서 익숙하게 사용하는 레이아웃을 바탕으로, 필요한 블록을 조합해 화면을 만들 수 있도록 구성했습니다.

화면을 만들 때는 어떤 정보를 보여줄지, 버튼과 입력창을 어디에 배치할지 정해야 합니다. 컴퍼스 블록은 이런 구성을 시작할 수 있는 기본 틀을 제공합니다. 사용자는 필요한 기능의 블록을 고른 뒤 콘텐츠와 디자인을 자신의 브랜드에 맞게 바꿀 수 있습니다.

공식 홈페이지에서는 프로젝트 생성, 알림 설정, 팀원 관리, 프로젝트 활동, 출시 체크리스트 등의 화면 예시를 볼 수 있습니다. 팀원 관리 화면은 이름과 이메일, 역할 설정을 한곳에 모았습니다. 출시 체크리스트는 진행 상태와 할 일을 함께 보여줍니다. 각 기능에 필요한 정보와 조작 요소를 묶는 방식을 확인할 수 있습니다.

블록을 활용하는 과정은 필요한 구성을 고르고, 조합하고, 수정하는 흐름입니다. 준비된 레이아웃을 출발점으로 삼되, 제품의 목적과 콘텐츠에 맞춰 형태를 다듬을 수 있습니다. 제품이 성장하면서 필요한 화면을 구성할 때도 블록을 바탕으로 작업을 이어갈 수 있습니다.

컴퍼스는 앞으로 더 다양한 기능을 위한 블록을 추가할 예정입니다. 업데이트한 블록은 컴퍼스 홈페이지에서 확인할 수 있습니다.

더보기 및 출처

Compass Design System

박종민
프리랜서에서 유니콘급 스타트업 헤드 오브 디자인까지. 18년 넘게 브랜드와 프로덕트를 디자인하며 임팩트를 만들어 왔습니다. 현재는 디자인 나침반 CEO이자 편집장으로서 비즈니스 임팩트를 내는 디자인을 연구하고 있습니다.

디자인 나침반 뉴스레터

최근 소식