SK브로드밴드 '플랜디넷' 실시간 관제 및 관리자 시스템 UI/UX 구축

Client.

SK브로드밴드

Work.

Planning, UI Design, Publishing

Production.

WEB

Device.

PC

Period.

20.11~21.02

Project Overview.

SK 브로드밴드의 관리자 시스템입니다. 대쉬보드를 통해 시스템의 실시간 장애 현황 및 트래픽그래프 등 여러 수치들을 확인할 수 있습니다. 여러가지 지표들을 한눈에 볼 수 있게 선명한 채도의 색상을 사용하였고, 복잡한 자료들도 쉽게 파악이 용이하게 배치함으로써 시스템의 관리 프로세스에 효율성을 더했습니다.


SK브로드밴드 실시간 관제 및 관리자 시스템 UI/UX 구축1
SK브로드밴드 실시간 관제 및 관리자 시스템 UI/UX 구축2
SK브로드밴드 실시간 관제 및 관리자 시스템 UI/UX 구축3
SK브로드밴드 실시간 관제 및 관리자 시스템 UI/UX 구축4
SK브로드밴드 실시간 관제 및 관리자 시스템 UI/UX 구축5
SK브로드밴드 실시간 관제 및 관리자 시스템 UI/UX 구축6


선명한 데이터 시각화로 신속하게 대응하는, '플랜티넷'


플랜티은 네트워크 상태와 트래픽 지표를 실시간으로 모니터링하는 어드민 플랫폼입니다. 기존 모니터링 환경은 수많은 수치와 트래픽 그래프, 장애 알림이 복잡하게 나열되어 있어 시각적 피로도가 높았고, 실시간 이상 징후 파악과 장애 대응의 골든타임 확보에 어려움이 있었습니다. 이에 방대한 수치 지표를 한눈에 파악하고 신속히 제어할 수 있는 관제 중심의 관리자 시스템 구축이 시급했습니다.


유엑스스토리(UXstory)는 대시보드 중심의 정보 구조(IA)와 고대비 데이터 시각화 인터페이스를 설계했습니다. 높은 대비와 선명한 채도의 컬러 팔레트를 적용해 정상·경고·심각 등 상태 지표와 트래픽 변동성을 즉각 인지할 수 있도록 했습니다. 주요 수치와 지표를 중요도에 따라 모듈형 카드 레이아웃으로 재구성하여, '실시간 현황 감지 → 지표 분석 → 실시간 원격 제어'로 이어지는 관리자 전용 단축 동선을 구현했습니다.


장시간 모니터링에도 인지 부하를 줄여주는 어드민 전용 컬러 체계와 트래픽 차트 컴포넌트, 상태 알림 라이브러리를 정립하여 디자인 시스템을 구축했습니다. 이를 통해 실시간 장애 관제 메인 대시보드와 네트워크 리포트 뷰, 모니터링 상세 모달을 완성했으며, 관리자의 장애 감지 및 대응 속도를 대폭 단축하여 안정적이고 효율적인 시스템 관제 환경을 완성했습니다.



Key Features

- 선명한 데이터 시각화: 고대비 및 선명한 채도의 컬러를 적용해 트래픽 및 장애 상태 시인성 극대화
- 모듈형 대시보드 레이아웃: 핵심 관제 지표와 수치 자료를 중요도별 카드 모듈로 재구성한 메인 화면
- 단축 관리자 동선: 현황 감지부터 지표 분석, 실시간 원격 제어 및 장애 조치까지 이어지는 직관적 프로세스
- 네트워크 트래픽 리포트: 시스템 이상 징후 파악 및 데이터 분석을 돕는 상세 모달과 통계 뷰
- 관제 전용 디자인 시스템: 장시간 모니터링에 최적화된 차트·그래프 모듈 및 알림 컴포넌트 라이브러리 정립