최대 30명까지 함께 사용할 수 있는 화이트보드 ‘tldraw’

저는 킥오프 미팅이나 아이디어를 구체화하는 과정에서 화이트보드 서비스를 자주 활용하는데요. 아이디어를 펼쳐서 입체적으로 확인하기 좋고, 노션에 텍스트로 작성하는 것보다 더 적극적으로 참여할 수 있다는 장점이 있기 때문입니다. 회사에서는 주로 피그마, 피그잼을 쓰고 있지만, 개인적인 사이드 프로젝트를 진행할 땐 간단하고 빠르게 활용할 수 있는 협업 도구로 화이트보드를 활용하고 있습니다.

오늘 소개할 ‘tldraw’ 는 화이트보드 사용을 위해 새 계정을 만들 필요가 없고, 무료로 최대 30명까지 함께 사용할 수 있습니다. 화이트보드에서 서로의 의견이나 내용을 공유함에 있어 꼭 필요한 핵심 기능을 제공합니다.

기본에 충실한 온라인 화이트보드

‘tldraw’ 에 접속하면 회원가입 또는 로그인, 서비스 소개 페이지 등을 거치지 않고 바로 편집 화면으로 이동합니다. 편집 화면은 기본 ‘다크 모드'로 설정되어 있으며 왼쪽 사이드 메뉴 - 설정을 통해 ‘라이트 모드'로 변경이 가능합니다.

이 설정에서는 ‘그리드 보기, 포커스 모드(메뉴가 모두 사라짐), 디버그 모드' 등을 추가로 선택할 수 있으며 화이트보드를 본격적으로 사용하기 전 각자에게 맞는 설정을 먼저 진행하는 것이 좋습니다. 저는 오프라인으로 활용하던 화이트보드의 ‘흰색'이 좋아 보통 라이트 모드로 사용하고 있습니다.

화이트보드의 특성상 전체 화면에서 내용을 입력할 수 있고, 왼쪽 위에는 앞서 살펴본 것처럼 라이트 모드 등으로 변경할 수 있는 기본 설정 메뉴를 포함하고 있습니다. 저장한 화이트보드 파일을 불러오거나 입력한 내용을 선택 후 삭제, 되돌리기, 회전이나 링크 입력 등의 편집 도구도 있고요. 기본 설정된 페이지 외 페이지를 추가하는 기능도 활용할 수 있습니다.

화면 가운데 아래에는 입력 도구들이 모여있는데, 화면을 이동하거나 선을 그리거나 화살표와 텍스트, 도형과 미디어 등을 첨부 또는 입력할 수 있는 기능이 있습니다. 마지막으로 오른쪽 위에는 입력한 내용의 스타일을 매만질 수 있는 도구가 있고, 주로 컬러와 크기 선의 종류 등을 선택할 수 있도록 구성되어 있습니다.

본격적으로 화이트보드를 사용하기에 앞서 주요 도구를 자세히 살펴보겠습니다. 먼저 화면의 왼쪽 상단에 자리 잡고 있는 도구입니다. 사이드 메뉴를 통해서는 파일을 저장하거나 불러오는 등의 행동을 할 수 있으며, 편집 기능을 통해 이미지 등으로 화이트보드에 작성한 내용을 내보낼 수 있습니다. 보기에서는 화이트보드를 보는 사이즈를 변경할 수 있고(이건 왼쪽 하단 숫자를 클릭해 변경하는 것도 가능), 미디어 삽입 기능을 통해 원하는 이미지나 영상을 첨부할 수 있습니다.

무료임에도 좋았던 기능 중 하나는 바로 ‘페이지’ 관리인데요. 처음 생성된 페이지를 기준으로 페이지 이름을 바꾸거나, 별도의 페이지를 추가하는 것이 가능합니다. 페이지 생성은 임의로 10개까지 해봤는데 별도 안내가 없는 것으로 봐선 그 이상도 가능할 것 같습니다. 아무래도 화이트보드는 정제된 내용보다 즉흥적이고 날 것의 의견을 담는 경우가 많은데, 페이지를 바로 생성해 내용을 이어가는 등의 작업 환경을 제공해 편리합니다.

이어서 입력과 스타일 편집 도구를 살펴보겠습니다. 이 서비스에서 입력에 활용할 수 있는 도구는 크게 7가지입니다. (1) 선 그리기 (2) 지우개 (3) 화살표 (4) 텍스트 (5) 메모 (6) 미디어 (7) 도형 등으로 구성됩니다. 가장 왼쪽의 화살표는 입력된 도구를 선택할 때, 다음의 손 모양은 입력된 것을 선택하지 않으며 화면을 이동할 때 활용할 수 있습니다. 도형의 경우 18개를 제공하는데 함께 작업하며 사용할 수 있는 형광펜과 레이저 포인트도 있습니다.

스타일은 입력된 도구의 컬러 등을 변경할 때 사용되며, 기본 12개의 컬러를 바탕으로 컬러의 투명도를 슬라이드로 변경할 수 있습니다. 입력된 내용에 따라 조금씩 다르지만, 텍스트나 화살표 등의 경우 크기를 S, M, L, XL 네 가지로 변경할 수 있으며, 선의 모양 역시 네 가지 스타일에 따라 편집할 수 있습니다. 컬러를 직접 입력할 수 있으면 더 좋겠지만, 세세하게 변경할 일은 많지 않아서 기본 도구만으로도 충분합니다.

위 이미지는 ‘선 그리기’ 기능과 ‘스타일 편집’ 기능을 통해 작성한 것으로, 선을 먼저 그린 뒤 컬러, 두께, 모양을 바꿀 수 있습니다. 반대로 먼저 원하는 스타일을 선택한 뒤 선 그리기를 진행하는 것도 가능합니다. 서비스는 물론 기능 자체도 복잡하지 않아, 몇 번 사용해 보면 금방 익숙하게 활용할 수 있을 겁니다.

화살표는 선과 다르게 두 가지 스타일을 적용할 수 있습니다. 기본적인 컬러와 선의 모양은 물론이고, 머리와 꼬리를 어떤 모양으로 할 것인지도 정해진 범위 내에서 선택할 수 있습니다. 아무래도 화이트보드에서 입력한 내용 간 상관관계를 따지거나, 이미지 등 특정 부분에 관한 내용을 작성할 때 화살표를 자주 사용하기 때문에, 다양한 사용 환경을 제공해 줍니다. 위 이미지는 크기와 선, 머리 모양 등을 선택해 입력한 4가지의 화살표 모습입니다.

세 번째 입력 도구는 화이트보드에서 가장 자주 사용하는 ‘텍스트’ 기능입니다. 앞서 화살표 입력 시 화살표만을 위한 스타일(머리 및 꼬리 모양)을 제공한다는 것을 확인했는데, 텍스트 역시 기본 컬러와 크기 외 정렬 기능을 활용할 수 있습니다. 왼쪽, 오른쪽 등 텍스트가 입력되는 위치에 따라 유용하게 사용할 수 있는 기능입니다.

이어서 ‘메모’ 기능입니다. 메모는 배경 컬러가 없는 텍스트로 설명하기 어려울 때 활용하면 좋습니다. 미디어와 도형 위에 덧붙이는 것도 가능하며, 내용을 함께 입력하고자 할 때 사용합니다. 다른 도형과 달리 텍스트를 직접 입력할 수 있으며, 크기와 컬러, 기타 편집은 다른 입력 도구와 동일하게 사용할 수 있습니다.

미디어 역시 제한 없이 첨부할 수 있습니다. JPEG, PNG 외에도 GIF, MP4 등의 파일 형식도 업로드가 가능합니다. 또한 이미지를 첨부한 뒤 화살표와 텍스트를 활용해 내용을 등록하거나, 이미지 위에 메모를 삽입해 필요한 텍스트를 입력할 수 있습니다. 화이트보드에 가장 많이 활용되는 것이 이미지라서 이 기능이 없었다면 서비스를 소개하는 것도 어려웠을 겁니다. 첨부한 이미지는 선택 후 크기 등을 자유롭게 변경할 수 있습니다.

마지막으로 도형은 플로우차트 등을 화이트보드 내 표현하거나 도형에 따라 의미를 부여해 작성하는 등의 과정에 유용하게 쓰입니다. 기본적인 도형 외에도 다양한 도형을 제공하고 있어, 클릭 한 번으로 원하는 도형을 입력할 수 있습니다. 저는 구름 도형을 자주 사용하는데 회의 참여자들의 컬러를 미리 지정하고, 각자의 의견을 입력 후 구분할 수 있어서 좋습니다.

한 번은 꼭 써봐야 하는 이유

‘tldraw’의 최대 장점은 별도 가입 없이 무료로 자유롭게 사용할 수 있다는 점입니다. 피그잼, 미로 등은 모두 제한된 기능이나 파일 개수 등을 갖고 있기에 마음껏 사용할 수 없지만, ‘tldraw’는 오픈 소스로 제공되는 무료 서비스입니다. 파일 내보내기 등을 통해 작성한 내용을 어려움 없이 관리하고 다시 등록할 수 있는 환경을 제공합니다.

또한 기본적으로 제공되는 입력, 편집 도구 역시 사용이 간편하고 크게 부족한 점이 없습니다. 여기에 최대 30명까지 초대해 함께 작업할 수 있는 환경을 제공하기 때문에, 협업 툴로 활용하기 좋습니다.

약간 아쉬운 점이 있다면 메뉴에 포함된 세부 기능들이 분산되어 있다는 점인데, 쓰다 보면 금방 적응되어 크게 불편하진 않습니다. 혹시나 해서 모바일에서도 편집해 봤는데요. PC에 비해 화면이 작다는 것 외에는 모바일 환경 대응도 잘 되어 있습니다. 회의, 협업, 사이드 프로젝트 등 온라인 화이트보드가 필요할 때 사용해 보시길 바랍니다.

https://www.tldraw.com/