다이어그램 종류는 왜 이렇게 많을까: 그림이 아니라 관점이라는 이야기

최근 블로그 admin의 글쓰기 흐름을 다이어그램으로 그려 본 적이 있습니다. 어떤 단계를 거쳐 글이 발행되는지 한눈에 보고 싶었기 때문입니다. 그런데 다이어그램 종류를 고민하다 그려놓고 보니, 이걸로 충분한가 하는 생각이 들었습니다. 절차는 보이는데 정작 보고 싶던 다른 것들은 그 그림에 담기지 않았습니다.

이 글은 4부작 시리즈 "다이어그램으로 생각하기"의 첫 편입니다. 첫 편에서는 종류를 나열하기보다, 다이어그램을 고를 때 무엇을 기준으로 삼아야 하는지를 먼저 이야기해 보려 합니다.

절차는 보였지만, 보이지 않은 것들

제가 처음 그린 것은 흐름도, 즉 Flowchart였습니다. 글을 쓰고, 검토하고, 발행하는 단계가 화살표로 이어지니 과정 자체는 분명해졌습니다. 다만 그림을 한참 들여다보다 깨달은 것은, 제가 답을 얻은 질문이 "무엇을 거치는가" 하나뿐이라는 사실이었습니다.

정작 궁금했던 다른 질문들은 그 그림에 자리가 없었습니다. 누가 누구를 언제 호출하는가, 그 호출은 동기인가 비동기인가. 그리고 한 편의 글이 작성 중에서 발행, 보관에 이르기까지 어떤 상태를 오가는가. 흐름도는 이 질문들에 답하도록 만들어진 도구가 아니었습니다. 같은 시스템인데도 말입니다.

그때 다이어그램은 그림이 아니라 관점이라는 생각이 들었습니다. 종류가 다르다는 것은 모양이 다르다는 뜻이 아니라, 답하는 질문이 다르다는 뜻이었습니다.

다이어그램은 "답하는 질문"으로 고른다

돌이켜 보면 저는 그동안 다이어그램을 고를 때 은연중에 "어떤 게 더 보기 좋은가"를 떠올렸던 것 같습니다. 하지만 예쁜가는 본질이 아니었습니다. 더 중요한 질문은 따로 있었습니다. 지금 내가 답하고 싶은 질문이 무엇인가.

이 기준으로 보면 종류가 많은 이유도 자연스럽게 이해됩니다. 질문이 여러 가지이기 때문에 그 질문마다 알맞은 도구가 따로 있는 것입니다. 자주 쓰이는 종류를 질문과 짝지어 정리하면 다음과 같습니다.

표로 늘어놓고 보니, 결국 다이어그램의 종류란 서로 다른 질문에 대한 서로 다른 답변 양식이라는 생각이 듭니다. 도구를 먼저 고르고 질문을 끼워 맞추는 것이 아니라, 질문을 먼저 정하고 도구를 부르는 순서가 자연스럽습니다.

같은 시스템을 여러 관점으로 그려 본다

이 깨달음을 제 글쓰기 흐름에 적용해 보았습니다. 같은 시스템을 세 가지 관점으로 그려 보니 각각 다른 것이 보였습니다. Flowchart는 작성에서 발행까지의 절차를, Sequence는 그 안에서 컴포넌트들이 주고받는 호출의 순서와 동기성을, State는 글 한 편이 거치는 생명주기를 드러냈습니다.

가장 단순한 형태의 Flowchart부터 보겠습니다. 아래는 Mermaid 문법으로 쓴 흐름도의 뼈대입니다. 이 블로그는 다이어그램을 직접 렌더링하지 않으므로, 소스 코드를 그대로 옮깁니다. 직접 확인하고 싶다면 mermaid.live에 붙여 넣어 보시면 됩니다.

flowchart LR
    A[시작] --> B{조건?}
    B -->|예| C[처리]
    B -->|아니오| D[대기]

네모는 단계, 마름모는 분기, 화살표는 흐름의 방향을 나타냅니다. 단계와 분기를 따라가기에는 더없이 좋은 도구입니다. 다만 이 그림에는 시간 축 위의 호출 순서도, 상태의 전이도 들어 있지 않습니다. 그것은 흐름도의 결함이 아니라, 애초에 답하려는 질문이 다르기 때문입니다. 시퀀스와 상태 다이어그램으로 같은 흐름을 어떻게 다르게 그리는지는 다음 편에서 자세히 다루겠습니다.

관점을 늘리는 일의 비용

다만 한 가지는 솔직히 적어 두고 싶습니다. 관점을 늘릴수록 보이는 것도 늘지만, 유지보수의 부담도 함께 늘어납니다. 코드가 바뀌면 그에 딸린 다이어그램도 따라 바뀌어야 하는데, 종류가 많아질수록 어느 하나는 슬그머니 낡은 채 남기 마련입니다. 낡은 다이어그램은 없는 것보다 오히려 더 위험할 때가 있습니다.

그래서 저는 모든 종류를 다 그리려 하기보다, 의도된 관점만 그리려고 합니다. 서로 다른 질문에 답하는 조합으로요. 같은 질문에 답하는 다이어그램을 두 개 그리는 것은 중복이지만, 다른 질문에 답하는 다이어그램을 나란히 두는 것은 보완입니다. 결국 중요한 것은 개수가 아니라 각 그림이 맡은 질문이 서로 겹치지 않는가 하는 점이었습니다.

이어지는 이야기

첫 편에서는 다이어그램을 그림이 아니라 관점으로 바라보는 시선을 정리했습니다. 이어지는 편들에서는 이 시선을 종류별로 구체화해 보려 합니다.

2편에서는 흐름을 다루는 두 도구, Flowchart와 Sequence를 나란히 놓고 절차와 호출 순서가 어떻게 다른지 살펴봅니다. 3편에서는 상태와 구조에 주목하여 State, ER, Class 다이어그램을 다룹니다. 마지막 4편에서는 남은 관점들과, 막상 그릴 때 종류를 고르는 법을 정리할 예정입니다. (그리고 그 과정에서 부딪힌 Mermaid의 실전 함정은 별도의 스핀오프 글로 따로 묶어 볼 생각입니다.)

다이어그램 앞에서 어떤 종류를 골라야 할지 망설였던 적이 있다면, 모양을 고르기 전에 질문을 먼저 정해 보시길 권합니다. 무엇을 묻고 싶은지가 분명해지면, 그릴 그림은 의외로 저절로 정해지는 듯합니다.