팀 워크스페이스 대시보드 디자인

팀 워크스페이스 대시보드 디자인

OpenDesign의 팀 워크스페이스 대시보드 디자인은 Acme Studio 워크스페이스를 데스크톱 운영 화면으로 보여줍니다. 왼쪽 내비게이션은 Workspace, Private, Connections 영역을 나누고, 메인 페이지는 “Acme Studio / Workspace / Team Dashboard” 경로를 따릅니다. 이 구조 덕분에 대시보드 내용이 시작되기 전에 독자가 자신의 위치를 파악할 수 있습니다.

제목은 “Team Dashboard”이고, 그 아래에 “Last edited by Sarah Chen”과 “Last refreshed just now”가 이어집니다. 새로고침 컨트롤인 “Auto · on”과 “Refresh from Notion”은 이 메타데이터와 같은 가로 띠에 놓입니다. 그래서 최신성과 새로고침 의도가 페이지 제목 가까이에서 보이지만, 구성상 이 컨트롤들은 대시보드 본체보다 시각적 비중이 낮습니다.

이 디자인은 고정 사이드바 레이아웃 안에서 최대 너비 1100px의 중앙 정렬 페이지를 사용합니다. 이 비율 덕분에 워크스페이스 전환용 내비게이션을 유지하면서, 더 넓은 영역을 묶인 운영 정보에 할당할 수 있습니다. 대신 밀도가 높아집니다. 한 화면에 여러 모듈을 보여줄 수 있지만, 긴 작업 이름과 활동 메시지는 주어진 열 안에서 줄바꿈되어야 합니다.

팀 운영을 위한 지표

이 대시보드는 사용자가 작업량과 예외 사항을 간결하게 확인해야 하는 팀의 일일 점검에 적합합니다. 첫 번째 요약 블록에는 “Total tasks 142”, “Done this week 23”, “Active members 11 / 14”, “Docs awaiting review 7”이라는 네 개의 필드가 있습니다. 필드마다 의미 구조가 달라, 이 행은 하나의 점수보다는 서로 구분되는 지표 묶음으로 쓸 때 더 유용합니다.

화살표는 세 필드에 비교 맥락을 더합니다. 전체 작업은 지난주보다 6 늘었고, 완료된 작업은 4 늘었으며, 검토 대기 문서는 2 줄었습니다. “Active members 11 / 14 · Stable”은 주간 증감 대신 분모와 정성적 상태를 사용합니다. 이 차이는 중요한 디자인 선택입니다. 모든 지표를 같은 비교 형식에 억지로 맞추지 않고 멤버 수용 인원의 정의를 보존하기 때문입니다.

화면에 보이는 값은 샘플 데이터로 명확히 표시되어 있습니다. 데이터가 채워진 대시보드가 어떻게 읽힐지는 보여주지만, Acme Studio의 성과나 연결된 운영 워크스페이스를 입증하는 근거는 아닙니다. 따라서 이 인터페이스는 정보 간 관계를 분명히 시연하면서, 실제 지표 정의와 데이터 출처는 이후 구현 단계로 남겨 둡니다.

추이에서 Active Sprint까지

페이지 중간부터는 요약에서 설명으로 넘어갑니다. 주간 차트의 제목은 “Tasks created · last 7 days”이고 “98 total”을 표시하며, 가로 레이블은 Wed, Thu, Fri, Sat, Sun, Mon, Tue 순서입니다. 그려진 선은 금요일까지 오르고 토요일에 내려갔다가 월요일에 눈에 보이는 최고점에 이르며 화요일에 다시 떨어집니다. 이 순서 덕분에 독자는 합계만 보는 것이 아니라 최근 패턴을 살펴볼 수 있습니다.

차트 옆의 “Recent activity”에는 상대 시간과 함께 수행자의 이름이 표시된 동작이 나열됩니다. 예를 들어 Sarah Chen이 “Q3 Roadmap planning”을 3 min ago에 In progress로 옮겼고, Mike Park이 “Fix mobile nav overflow on iOS”에 11 min ago에 댓글을 남겼습니다. 사람, 동작, 대상, 시간이 반복되는 패턴은 빠른 훑어보기를 돕습니다. 다만 자연어로 쓴 활동 행은 이름이나 대상 제목이 길어지면 줄바꿈이 예측하기 어렵게 달라질 수 있습니다.

그다음 페이지는 Tasks · Active sprint로 이어집니다. 보조 문구는 Linked database · filtered by Status ≠ Done · sorted by Updated time입니다. 캡처된 초기 행에는 Done 항목이 없고, 로컬 렌더러는 샘플 업데이트 타임스탬프를 기준으로 정렬합니다. 그러나 이후 시뮬레이션된 새로고침에서 Done으로 표시된 행을 제거하지는 않으므로, 이 필터 레이블은 완전히 구현된 동작이 아닙니다.

열은 Name, Status, Assignee, Due, Priority입니다. 캡처된 초기 상태에서 Fix mobile nav overflow on iOS는 Blocked이고 우선순위가 High인 반면, Pricing experiment readout은 To do이고 우선순위가 Low입니다. 이런 짝은 상태와 긴급도를 구분해 줍니다. 작업 이름은 줄바꿈 대신 말줄임표로 잘리며, 980px 미만에서는 원본이 사이드바와 Due, Priority 필드를 숨겨 그 세부 정보가 덜 보입니다.

눈에 보이는 디자인과 기능의 경계

원본이 구현한 것은 연결된 Notion 워크스페이스가 아니라 로컬 샘플 데이터 시뮬레이션입니다. 초기 KPI 값과 주간 차트는 캡처된 상태와 일치합니다. 열 때 새로고침하는 타이머, 수동 Refresh from Notion 버튼, 30초 자동 새로고침 루프가 로컬 픽스처 값, 작업 상태, 활동 항목을 변경합니다. 원본에는 커넥터 요청, 인증된 워크스페이스 접근, 영구 저장소가 없습니다.

Auto · on은 끌 수 있고, 상대 타임스탬프는 로컬에서 갱신되며, 새로고침 후에도 인터페이스에는 Sample data 배지가 유지됩니다. 푸터에는 Notion API와 composio.notion이 적혀 있지만, 이 레이블이 실제 연동을 입증하지는 않습니다. 초기 토스트 마크업에는 Synced — 3 changes from Notion이라고 되어 있으나, 실행 중인 새로고침 핸들러가 이를 샘플 데이터 메시지로 교체하므로 초기 문구는 동기화 결과의 근거가 아닙니다.

로컬 시뮬레이션은 표시 방식과 데이터 규칙이 어긋날 수 있는 지점도 보여줍니다. 행이 Done이 되어도 내세운 active-sprint 필터에서 제거되지 않을 수 있고, 고정된 주간 비교 레이블은 KPI 값이 바뀌어도 다시 계산되지 않습니다. 실제로 적용하려면 이 화면을 팀의 의사결정에 쓰기 전에 지표 정의, 필터링, 비교 계산을 명확히 갖춰야 합니다.