선버스트는 중심에서 바깥으로 계층을 어떻게 펼칠까?

학습 과정의 부·회차·활동을 한 원에 펼친다

LLM 학습 과정을 ‘전체 → 기초·응용·검토 → 개별 회차 → 실습’처럼 여러 깊이로 보고 싶다. 선버스트는 루트를 중심에 놓고 자식 세대를 바깥 고리에 배치한다. 같은 가지의 자손은 부모 부채꼴의 각도 범위 안에 들어가므로 중심에서 바깥으로 한 경로를 따라갈 수 있다.

D3의 partition 레이아웃은 계층을 공간을 채우는 인접 도표로 배치한다. 직사각형 좌표를 극좌표로 바꾸면 선버스트가 된다. 아래 교육용 그림에서 중심은 전체, 첫 고리는 상위 영역, 두 번째 고리는 세부 영역이다. 실제 학습자 기록이나 모델 내부 구조를 나타낸 것이 아니다.

중심·고리·각도·경로를 순서대로 읽는다

중심 원은 루트, 안쪽에서 바깥쪽으로 갈수록 깊이가 하나씩 늘어난다. 같은 고리의 부채꼴은 같은 깊이에 있다. 부채꼴의 시작각과 끝각 차이는 값에 비례하며, 자식들의 각도 범위는 부모 안에 포함된다. 바깥쪽 조각이 넓어 보이는 것은 반지름이 커 면적이 늘기 때문일 수 있다.

값을 각도로 부호화했다면 바깥 조각의 면적만 비교하지 않는다. 구현에 따라 면적을 값에 맞추는 반지름 척도도 있으므로 사양을 확인한다. 색은 상위 가지를 이어 주는 데 쓰고, 명도는 깊이나 상태를 보조한다. 이웃한 부채꼴은 순서를 뜻할 수 있지만 인과관계는 아니다.

부모 각도는 자식 각도의 합과 맞는다

응용 영역이 전체의 50%라면 그 자식인 검색 20%, 에이전트 18%, 평가 12%의 합이 50%여야 한다. 부모와 자식 모두 독립 값으로 입력해 50과 58이 동시에 존재하면 계층이 겹친다. 잎 값에서 상위 합을 계산하고, 자식이 없는 부모만 자신의 값을 잎처럼 처리한다.

깊이마다 다른 단위를 쓰면 각도를 비교할 수 없다. 첫 고리는 회차 수, 둘째 고리는 학습 시간, 셋째 고리는 정답 수로 나누지 않는다. 한 그림은 하나의 가중 기준을 사용한다. 구조만 보여 주고 싶다면 모든 잎에 1을 주되 그 사실을 밝혀 ‘항목 수 비중’임을 적는다.

중심 확대는 초점을 바꾸지만 전체 맥락을 남긴다

작은 조각을 선택해 중심으로 확대하면 라벨과 세부 경로를 읽기 쉬워진다. 이때 선택한 노드가 새 루트처럼 커지므로 전체에서 차지하던 비율과 화면에서 차지하는 비율이 달라진다. 상단에 ‘전체 / 응용 / 검색’ 경로와 ‘전체의 20%’를 남겨 확대를 전체 비중으로 오해하지 않게 한다.

Stasko와 Zhang의 선버스트 연구는 방사형 공간채움 계층에서 초점+맥락 탐색을 다뤘다. 확대·왜곡을 사용할 때는 현재 초점, 조상 경로, 원래 비율을 복구할 수 있어야 한다. 뒤로 가기, 키보드 이동, 선택 해제도 제공한다. 애니메이션만으로 계층 변화를 설명하지 않는다.

라벨은 호 길이와 방향을 고려한다

안쪽 고리는 호 길이가 짧고, 바깥 고리는 조각이 많아 라벨이 겹친다. 모든 글자를 원호에 억지로 넣지 않는다. 충분한 각도에는 직접 라벨을 두고 작은 조각은 번호·범례·목록·확대에서 제공한다. 글자를 거꾸로 돌리지 않고 원의 왼쪽에서는 읽는 방향을 반전한다.

터치 화면에서는 툴팁만 두면 호버할 수 없다. 탭과 키보드 초점으로 같은 내용을 열 수 있게 하고, 포커스 테두리가 조각 경계를 넘지 않게 한다. 화면 읽기 프로그램에는 ‘응용, 깊이 1, 값 50, 전체 50%, 자식 3개’처럼 경로와 값을 제공한다.

도넛·트리맵·방사형 트리와 구분한다

도넛 차트는 보통 한 단계의 부분–전체를 보여 주며 여러 고리라고 자동으로 계층이 되지 않는다. 선버스트에서는 부모 각도 안에 자식 각도가 포함돼 경로가 이어진다. 트리맵은 같은 계층을 직사각형으로 채워 공간 효율과 라벨 배치에 유리하고, 선버스트는 깊이와 조상 경로를 방사 방향으로 따라가기 쉽다.

방사형 노드–링크 트리는 노드 사이 선을 보여 구조 관계가 명확하지만 공간을 채우지 않는다. 값이 없고 구조만 중요하다면 노드–링크가 더 솔직하다. 정확한 잎 크기 비교가 목적이면 막대나 트리맵을 보완한다. 원형 모양이 흥미롭다는 이유만으로 고르지 않는다.

LLM에는 계층 경로와 초점 규칙을 함께 준다

루트부터 잎까지 경로, 잎 값, 단위, 정렬 키를 제공하고 고아·순환·중복·합계 불일치를 검사하게 한다. 같은 깊이에 같은 단위를 사용하게 하며 부모 값을 추정하지 않는다. 결과에는 각 노드의 깊이, 시작각·끝각, 값, 전체 비율, 부모 비율을 표로 반환하게 한다.

확대가 있다면 현재 초점과 조상 경로, 전체 비율을 계속 표시하게 한다. 라벨 최소 각도, 색 범례, 키보드 순서와 대체 계층 목록을 요구한다. 모델이 친숙한 교육과정을 임의로 추가하지 않도록 제공된 경로만 사용하게 하고, 실제 값이 없으면 균등 가중이라는 선택을 명시한다.

잘못된 선버스트는 바깥 면적을 값으로 오해시킨다

수정 전 그림은 첫 고리를 회차 수, 둘째 고리를 학습 시간으로 나눴다. 바깥 조각의 면적이 커 보인다는 이유로 중요도가 높다고 설명했고, 확대 후 전체 비율 라벨을 화면 비율로 바꿨다. 작은 라벨을 곡선에 겹쳐 읽을 수 없었으며 고아 노드를 루트 바로 아래에 임의 배치했다.

수정 후 모든 깊이에 같은 학습 시간 단위를 적용하고 각도값을 표에 공개했다. 확대 화면에도 원래 전체 비율과 경로를 남겼다. 작은 조각은 상세 목록과 키보드 탐색으로 제공하고 고아 노드는 오류 목록으로 보냈다. 정확한 크기 비교를 위해 정렬 막대를 함께 두었다.

직접 실습은 부모 안의 비율을 계산한다

교육 자료에서 응용은 전체 100 중 50이고, 그 안에서 검색 20은 응용의 40%다. “전체의 20%”와 “응용의 40%”는 모두 맞지만 분모가 다르다. 실습에서는 검색 값을 바꾸며 두 비율과 나머지 자식 합을 함께 확인한다. 확대 화면에서는 특히 분모를 제목에 쓴다.

실제 과정 자료에서는 한 활동이 여러 과정에 공유될 수 있다. 선버스트는 부모 하나를 가진 트리에 적합하므로 공유 활동을 두 곳에 복제하면 합계가 중복된다. 주 소속을 정하거나 복제 항목임을 표시하고 고유 활동 수를 별도 보고한다. 다중 소속 자체가 질문이면 네트워크나 코드 다이어그램을 고려한다.

복사해서 쓸 수 있는 LLM 요청문

아래 요청문은 교육용 예시다. 원문을 함께 제공하고, 모델이 빈칸을 추측하지 않도록 금지 조건을 넣었다. 결과를 받으면 원문 문장과 노드·선의 대응을 사람이 다시 확인한다.

다음 계층 경로표를 선버스트용으로 검산해 줘.
1. 루트부터 잎까지의 경로, 잎 값, 단위, 정렬 키를 확인한다.
2. 고아 노드, 순환, 중복 경로, 부모가 둘인 항목을 찾는다.
3. 부모 각도가 같은 단위의 자식 합과 일치하는지 계산한다.
4. 각 노드의 깊이, 값, 전체 비율, 부모 비율을 표로 보인다.
5. 각도와 반지름이 각각 무엇을 뜻하는지 명시한다.
6. 확대 후에도 조상 경로와 원래 전체 비율을 유지한다.
7. 작은 조각은 읽을 수 있는 목록과 키보드 탐색으로 제공한다.
8. 실제 값이 없으면 균등 가중 여부를 밝히고 값을 꾸미지 않는다.

[계층 경로표] …

직접 실습하고 결과를 읽기

이 실습은 브라우저 안에 준비한 교육용 자료만 사용한다. 외부 LLM을 호출하거나 실제 기관 자료를 조회하지 않는다. 입력을 바꾸어 결과가 어떻게 달라지는지 보고, 설명과 맞지 않는 결과가 나오면 어떤 정보가 빠졌는지 적어 본다.

자료와 출처

아래 자료는 이번 글의 정의와 표기법을 확인하는 데 사용했다. 생각그림과 사례 문장은 원자료를 복제하지 않고 이 글의 교육 목적에 맞게 새로 구성했다.

• D3 Hierarchies: Partition, Observable
• John Stasko & Eugene Zhang, Focus+Context Display and Navigation Techniques (IEEE InfoVis 2000)