PumlFlow - PlantUML Live Editor & Viewer

About

PumlFlow는 특히 복잡하고 대규모인 시퀀스 다이어그램을 쉽게 탐색하고 편집할 수 있도록 고안된 개발자용 고성능 라이브 뷰어 및 에디터 크롬 확장 프로그램입니다.

다이어그램이 가로 및 세로로 너무 거대해져서 흐름을 잃어버리는 고질적인 문제를 세 가지 핵심 기능으로 완벽하게 해결합니다:

1. 구분선(== 제목 ==) 기준 페이징 분할 (ON/OFF)
- 다이어그램의 각 구분선을 감지하여 페이지 단위로 분할하여 렌더링합니다.
- 해당 페이지에서 다루지 않는 Object(Participant)는 자동으로 감추어 다이어그램의 가로 폭을 최적화합니다.
- 이전 페이지의 최종 흐름을 상단에 간이 배치하여 흐름이 자연스럽게 이어지도록 보조합니다.
2. 마우스 포인터 중심의 정밀 줌(Zoom) & 드래그 이동(Pan)
- 마우스 드래그를 이용해 다이어그램을 부드럽게 이동하고, 마우스 휠 스크롤을 활용하여 포인터가 가리키는 지점을 중심으로 섬세하게 축소 및 확대(3% 미세 스텝)할 수 있습니다.
3. 스마트 가이드라인 및 Sticky Header 이름표
- 세로로 긴 다이어그램을 스크롤하여 내려가도, 각 세로 생명주기선(Lifeline) 위치에 맞추어 상단에 Object 이름표가 말풍선 형태로 고정되어 따라다닙니다.
- 마우스를 올리면 가까운 세로선에 맞추어 세로 안내선이 나타나고, 마우스 커서 옆에 해당 Object의 진짜 이름을 정확하게 툴팁으로 표시하여 줍니다.
4. 에디터-뷰어 비율 스플리터 바 및 자동 리핏
- 에디터와 뷰어 화면의 비율을 실시간 드래그로 조절할 수 있습니다.
- 너비 조절이 완료되면 다이어그램이 새 너비에 맞춰서 최적의 크기로 자동 갱신 및 재정렬됩니다.


[사용 방법]
1. 크롬 설치 후 툴바의 확장 프로그램 아이콘을 클릭하면 에디터 및 뷰어 전용 탭이 열립니다.
2. 좌측 패널에 PlantUML 코드를 입력하거나 실시간으로 편집합니다.
3. 우측 뷰어 패널에서 렌더링된 다이어그램을 감상하고 드래그, 휠, 상단 툴바 옵션(페이징, 스마트 가이드)을 통해 자유롭게 제어합니다.
4. 필요 시 'SVG 다운로드' 버튼을 눌러 고화질 벡터 이미지 파일로 로컬 저장합니다.